1. Faster loading thanks to fetchpriority

In the article Boost Resource Loading With fetchpriority they described in detail a new HTML attribute with which you can adjust the priority of loading of the content of the page such as. images, javascript, iframe. So far, only Chrome and Edge (Chromium based) support the attribute, but other browsers will be added gradually. You can check the current attribute support at caniuse.com. You can use the fetchpriority attribute to improve LCP metrics or speed up the rendering of more important page content.

2. Modal windows using the <dialog> element

The HTML element <dialog> has recently gained support in all modern browsers. With this element you can create modal windows that will be styleable and especially natively accessible. You don't have to deal with e.g. focus or close with the ESC key. You can find all the important information in the article Building a dialog component or you can watch the video.

3. What is new in ECMAScript 2022

The specification for the new version of JavaScript is already available, although it has not yet been officially approved. If you are interested in the news that this version brings, then read the article What's new in ECMAScript 2022. You can look forward to e.g. on the:

• top level await,
• private attributes and methods in classes,
• method .at(),
• error.cause,
• etc.

4. Article series # 30DaysOfPWA

To learn more about Progressive Web Applications (PWA), be sure to check out the “30 Days of PWA” Blog Series. The series of articles is structured into 4 main categories:

• Basic PWA concepts.
• Advanced PWA options and application examples.
• Developer tools for debugging, testing, etc.
• Best practices and PWA support for individual platforms.

5. News in Google Chrome

You can read the changes as well as the news that came with the new version of Google Chrome in the following articles:

• Deprecations and removals in Chrome 101 - Probably the most important change is the reduction of information in the User-Agent string.
• What's New In DevTools - I was most interested in importing and exporting recorded user steps as a JSON file. It can be of good use when reporting bugs.

6. How to update TypeScript in React 18

Not all changes in the new major version of React 18 are backward compatible. If you are going to update a project to React 18 that uses TypeScript, then first read the instructions: Upgrading to React 18 with TypeScript. You will find information in it that will save you a lot of time when fixing the project.

7.  Software Engineering at Google Book

This book is not directly about programming, but about the engineering approaches they use at Google. You will learn how to maintain even large projects while maintaining their quality. The book is suitable for you if you are interested, as they have e.g. processes used by Google or how people collaborate on projects. The book is available in PDF completely free of charge.

Several articles on accessibility

• The "inert" attribute is finally coming to the web - New inert attribute that allows you to block a certain part of the page. For example, when you open a modal window, we want to lock the content of the page so that other elements cannot be clicked or focused.
• Keyboard button clicks with Space and Enter behave differently - Some elements, such as buttons on a page, can be clicked with the space bar or Enter. But how do these clicks differ?
• Web Accessibility Checklist - Studying the complete WCAG specification is quite exhaustive. Therefore, it is advisable to start with a checklist first, where you will find a summary of how to make the site accessible.

More articles worth reading

• 14 Linting Rules To Help You Write Asynchronous Code in JavaScript - Learn what ESLint rules need to be turned on to check for errors in writing asynchronous code. In addition, you will learn the mistakes we often make and why they are dangerous.
• New to the web platform in April - An overview of the features that got into the stable and beta versions of web browsers during April 2022.
• Understanding Layout Algorithms -If you want to be good at CSS, you need to know how CSS works. In this article, Joshua Comeau explains how layout algorithms work.
• The Front-End Developer's Guide to the Terminal - As a frontend developer, you must also be able to work with the terminal. In this article you will find instructions on how to use it.

Conclusion

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