6. Oct 2022Frontend

Frontend Briefly - News & Insights from Frontend development world #10

A regular summary of the most important news, articles or tweets in the frontend world is here! For the month of September, we have prepared the top 6 news that should not be missed by any frontend developer. In addition, here you will find links to other interesting articles that are worth reading.

1. Web Almanac - state of the web report 2022

The Web Almanac is a detailed report on the state of the web supported by data from a dataset of 8,360,179 web sites, 43.88 TB of data and 108 experts who worked on data analysis. The report has 22 chapters, where you will find clear graphs with current data on the state of the web, information on emerging trends and also tips for improving the current state.

jQuery still with the largest share among JS frameworks and libraries

2. News in Next.js

2.1 Next.js 12.3

The new version of Next came with interesting news:

  • Improved Fast Refresh: .env, jsconfig.json and tsconfig.json files are hot reloaded.
  • TypeScript Auto-Install: After adding .ts, typescript will be automatically configured and installed.
  • Image Component: next/future/image is now stable.
  • SWC Minifier: The new code minifier is 7 times faster than the original version with Terser.
  • New Router + Layouts Update: New information about upcoming features in Next.js.

2.2 Next.js Layouts RFC

The detailed RFC for the biggest Next.js update has been available for several months. Here you will learn about the planned changes for routing, layout or data fetching. In the article Next.js Layouts RFC in 5 minutes you will learn about the most important functions that will come in the new major version of Next.js.

2.3 Next.js Conf 2022

Next.js Conf 2022 will be held on October 25. The topics of this year's conference are

  • Features using Server Components, Streaming or Suspense
  • Conventions that make it easier for developers to optimize and scale applications
  • Open-source tools that speed up development and building

3. News in web platform

In September, new versions of the Firefox 105, Chrome 106 and Safari 16 browsers were released, which brought several interesting novelties:

  • Container queries
  • Grid layout
  • Encoding API
  • New Intl API
  • etc...

Read more in the article on web.dev.

4. React Router 6.4

React Router 6.4 came with several new features that it took over from the Remix framework:

  • Loading data using Route loader
  • Mutation of data using Route action
  • Error handling using Route errorElement
  • Defer non-critical data with defer and Await
  • and many more functions…

5. The Web is Good Now

The evolution in the web environment has simplified a lot of work for developers. In the lecture The Web is Good Now, you can look at improvements for typography, layout animations or media manipulation...

6. :focus-visible available in all modern browsers

CSS pseudo class :focus, creates an ugly outline around buttons or links when clicked. That's why developers often remove styling for the :focus state. However, by doing so, we break accessibility for people using a keyboard to navigate the web. The new CSS property :focus-visible displays the outline only when navigating with the keyboard.

CSS pseudo class :focus-visible solves the ugly frame around the link when the mouse is clicked and at the same time it does not spoil the accessibility of the website.

More articles worth reading

A few articles about accessibility

Conclusion

If you liked the news overview, don't forget to subscribe to our newsletter. You can also read the news from last month, which we brought in the August Frontend Briefly.

Andrej NemečekFrontend Developer