New to the web platform in April

Stable browser releases #
In April 2023, Firefox 112, and Chrome 112 became stable. Let’s take a look at what this means for the web platform.
Caution We include browser compatibility data pulled from MDN in these posts which may not have updated f…


This content originally appeared on web.dev and was authored by Rachel Andrew

Stable browser releases #

In April 2023, Firefox 112, and Chrome 112 became stable. Let's take a look at what this means for the web platform.

The inert attribute #

Firefox 112 includes the inert global attribute. This attribute tells the browser to ignore the element, indicating content that should not be interactive. It:

  • Prevents click events being fired.
  • Prevents the element from gaining focus.
  • Excludes the element and its contents from the accessibility tree.

This attribute is now interoperable in all three engines.

Browser support
  • Chrome 102, Supported 102
  • Firefox 112, Supported 112
  • Edge 102, Supported 102
  • Safari 15.5, Supported 15.5
Source

The linear() easing function #

The linear() easing function enables linear interpolation between a number of points. This enables more complex animations such as bounce and elastic effects. This function is in Firefox 112.

Browser support
  • Chrome 113, Supported 113
  • Firefox 112, Supported 112
  • Edge 113, Supported 113
  • Safari, Not supported

CSS nesting #

Chrome 112 adds support for CSS Nesting, a feature that is highly anticipated by many developers. This introduces a new nesting selector >, used to nest related style rules, in a way that will be familiar to developers who have used pre-processors:

.nesting {
color: hotpink;

> .is {
color: rebeccapurple;

> .awesome {
color: deeppink;
}
}
}
Browser support
  • Chrome 112, Supported 112
  • Firefox, Not supported

  • Edge 112, Supported 112
  • Safari preview, Preview

Source

CSS animation-composition #

Chrome 112 also includes support for animation-composition. Learn how this property works in Specify how multiple animation effects should composite with animation-composition.

Browser support
  • Chrome 112, Supported 112
  • Firefox 104, Behind a flag

  • Edge 112, Supported 112
  • Safari 16, Supported 16
Source

New headless mode #

If you use Chrome's Headless mode, for example with Puppeteer, then 112 brings an all new Headless mode. Learn about it in Chrome's Headless mode gets an upgrade.

Beta browser releases #

Beta browser versions give you a preview of things that will be in the next stable version of the browser. It's a great time to test new features, or removals, that could impact your site before the world gets that release. New betas are Firefox 113 and Chrome 113, with the Safari 16.5 beta still ongoing. These releases bring many great features to the platform. Check out the release notes for all of the details, here are just a few highlights.

Firefox 113 includes the color(), lab(), lch(), oklab(), and oklch() functions. Also included is the color-mix() function from CSS Color 5, and the forced-color-adjust property.

Firefox also includes the nth-child of <selector> syntax, giving finer control of which elements you want to select. Read more in More control over :nth-child() selections with the of S syntax.

For CSS, Chrome 113 includes the overflow-inline, overflow-block, and update media features. Also included in the linear() easing function, and the unprefixed image-set() type.

Chrome 113 also includes WebGPU, the successor to the WebGL and WebGL 2 graphics APIs for the Web. It provides modern features such as GPU compute, lower overhead access to GPU hardware, the ability to render to multiple canvases from a single graphics device, and better, more predictable performance.

Photo by Karen Ciocca.


This content originally appeared on web.dev and was authored by Rachel Andrew


Print Share Comment Cite Upload Translate Updates
APA

Rachel Andrew | Sciencx (2023-04-28T00:00:00+00:00) New to the web platform in April. Retrieved from https://www.scien.cx/2023/04/28/new-to-the-web-platform-in-april-2/

MLA
" » New to the web platform in April." Rachel Andrew | Sciencx - Friday April 28, 2023, https://www.scien.cx/2023/04/28/new-to-the-web-platform-in-april-2/
HARVARD
Rachel Andrew | Sciencx Friday April 28, 2023 » New to the web platform in April., viewed ,<https://www.scien.cx/2023/04/28/new-to-the-web-platform-in-april-2/>
VANCOUVER
Rachel Andrew | Sciencx - » New to the web platform in April. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2023/04/28/new-to-the-web-platform-in-april-2/
CHICAGO
" » New to the web platform in April." Rachel Andrew | Sciencx - Accessed . https://www.scien.cx/2023/04/28/new-to-the-web-platform-in-april-2/
IEEE
" » New to the web platform in April." Rachel Andrew | Sciencx [Online]. Available: https://www.scien.cx/2023/04/28/new-to-the-web-platform-in-april-2/. [Accessed: ]
rf:citation
» New to the web platform in April | Rachel Andrew | Sciencx | https://www.scien.cx/2023/04/28/new-to-the-web-platform-in-april-2/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.