New to the web platform in May
Published: 2023-08-20 17:13:20

---
title: New to the web platform in May
published: true
date: 2023-05-31 00:00:00 UTC
tags: 
canonical_url: https://web.dev/web-platform-05-2023/
---

## Stable browser releases [#](https://web.dev/web-platform-05-2023/#stable-browser-releases)

In May 2023, [Firefox 113](https://developer.mozilla.org/docs/Mozilla/Firefox/Releases/113), [Chrome 113](https://developer.chrome.com/blog/new-in-chrome-113/), [Chrome 114](https://developer.chrome.com/blog/new-in-chrome-114/), and [Safari 16.5](https://developer.apple.com/documentation/safari-release-notes/safari-16_5-release-notes) became stable. Let's take a look at what this means for the web platform.

<aside><p><span><svg width="24" height="24" viewbox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Error sign"> <path fill-rule="evenodd" clip-rule="evenodd" d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-1 15v-2h2v2h-2zm0-10v6h2V7h-2z"></path> </svg></span><strong>Caution</strong></p>
<div> We include browser compatibility data pulled from MDN in these posts which may not have been updated yet for very recent browser releases. The post will show the correct information as soon as it appears in the <a href="https://github.com/mdn/browser-compat-data/releases">browser-compat-data release</a>. </div></aside>
### WebGPU [#](https://web.dev/web-platform-05-2023/#webgpu)

Chrome 113 includes [WebGPU](https://developer.chrome.com/blog/webgpu-release/), 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.

Browser support
- Chrome 113, Supported 113 
- Firefox preview, Preview

- Edge 113, Supported113
- Safari, Not supported

[Source](https://developer.mozilla.org/docs/Web/API/GPU#browser_compatibility)

### First-Party Sets [#](https://web.dev/web-platform-05-2023/#first-party-sets)

[First-Party Sets (FPS)](https://developer.chrome.com/docs/privacy-sandbox/first-party-sets/) is part of the [Privacy Sandbox](https://privacysandbox.com/). It is a way for organizations to declare relationships among sites, so that browsers can decide when to allow limited third-party cookie access for sites within a set. FPS began a staged rollout in Chrome 113.

### CSS media features and more [#](https://web.dev/web-platform-05-2023/#css-media-features-and-more)

For CSS, Chrome 113 includes the `overflow-inline` and `overflow-block` media features.

Browser support
- Chrome 113, Supported 113 
- Firefox 66, Supported 66 
- Edge 113, Supported 113 
- Safari, Not supported

[Source](https://developer.mozilla.org/docs/Web/CSS/@media/overflow-inline#browser_compatibility)

And the `update` media feature.

Browser support
- Chrome 113, Supported 113 
- Firefox 102, Supported 102 
- Edge 113, Supported 113 
- Safari, Not supported

[Source](https://developer.mozilla.org/docs/Web/CSS/@media/update-frequency#browser_compatibility)

Also included is the `linear()` easing function, which you can learn more about in the article [Create complex animation curves in CSS with the `linear()` easing function](https://developer.chrome.com/articles/css-linear-easing-function/).

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

### CSS Color Level 4 features [#](https://web.dev/web-platform-05-2023/#css-color-level-4-features)

Firefox 113 includes the `color()`, `lab()`, `lch()`, `oklab()`, `oklch()`, and `color-mix()` functional notations, along with the forced-color-adjust property. This means that the new color spaces and functions are now supported across all three major engines. You can learn more about these color spaces and functions in the [High definition CSS color guide](https://web.dev/articles/high-definition-css-color-guide/).

Browser support
- Chrome 111, Supported 111 
- Firefox 113, Supported 113 
- Edge 111, Supported 111 
- Safari 16.2, Supported 16.2 
[Source](https://developer.mozilla.org/docs/Web/CSS/color_value/color-mix#browser_compatibility)

### More control over `:nth-child()` selections [#](https://web.dev/web-platform-05-2023/#more-control-over-nth-child-selections)

Firefox 113 also adds the ability to pass a selector list into `:nth-child()` and `nth-last-child()`. Learn more about this, and see examples in the post [More control over :nth-child() selections with the of S syntax](https://developer.chrome.com/articles/css-nth-child-of-s/).

Browser support
- Chrome 111, Supported 111 
- Firefox 113, Supported 113 
- Edge 111, Supported 111 
- Safari 9, Supported 9 

### Compressions Streams API [#](https://web.dev/web-platform-05-2023/#compressions-streams-api)

Now supported in all three major engines due to inclusion in Firefox 113, the Compressions Streams API enables the compression and decompression of streams. This means that JavaScript applications no longer need to bundle a compression library.

Browser support
- Chrome 80, Supported 80 
- Firefox 113, Supported 113 
- Edge 80, Supported 80 
- Safari 16.4, Supported 16.4 
[Source](https://developer.mozilla.org/docs/Web/API/CompressionStream#browser_compatibility)

### CSS nesting [#](https://web.dev/web-platform-05-2023/#css-nesting)

Safari 16.5 mostly resolved issues, but also adds support for [CSS Nesting](https://developer.chrome.com/articles/css-nesting/), with the 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, Supported112
- Safari 16.5, Supported16.5

[Source](https://developer.mozilla.org/docs/Web/CSS/Nesting_selectors#browser_compatibility)

### Balancing headlines with `text-wrap: balance` [#](https://web.dev/web-platform-05-2023/#balancing-headlines-with-text-wrap-balance)

From Chrome 114 you can use `text-wrap: balance`. This allows you to balance headlines, avoiding the issue of having a single word on the final line, providing a more pleasing and readable result. You can find out more in [CSS text-wrap: balance](https://developer.chrome.com/blog/css-text-wrap-balance/).

Browser support
- Chrome 114, Supported 114 
- Firefox, Not supported

- Edge 114, Supported114
- Safari, Not supported

[Source](https://developer.mozilla.org/docs/Web/CSS/text-wrap#browser_compatibility)

### CHIPS: Cookies Having Independent Partitioned State [#](https://web.dev/web-platform-05-2023/#chips-cookies-having-independent-partitioned-state)

As part of the work to [phase out third-party cookies](https://developer.chrome.com/docs/privacy-sandbox/third-party-cookie-phase-out/), [CHIPS](https://developer.chrome.com/docs/privacy-sandbox/chips/) enables opting-in to third-party cookies being partitioned by top-level site using the new cookie attribute `Partitioned`. CHIPS is available in Chrome 114.

### The Popover API [#](https://web.dev/web-platform-05-2023/#the-popover-api)

Also in Chrome 114 is the [Popover API](https://developer.mozilla.org/docs/Web/API/Popover_API) making it easier to build transient user interface (UI) elements that are displayed on top of all other web app UI.

These include user-interactive elements like action menus, form element suggestions, content pickers, and teaching UI.

The new popover attribute enables any element to be displayed in the [top layer](https://developer.chrome.com/blog/top-layer-devtools/) automatically. This means no more worrying about positioning, stacking elements, focus or keyboard interactions for the developer.

Learn more in [Introducing the popover API](https://developer.chrome.com/blog/introducing-popover-api/).

Browser support
- Chrome 114, Supported 114 
- Firefox 114, Behind a flag

- Edge 114, Supported114
- Safari 17, Supported17

[Source](https://developer.mozilla.org/docs/Web/API/ToggleEvent#browser_compatibility)

## Beta browser releases [#](https://web.dev/web-platform-05-2023/#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 114](https://developer.mozilla.org/docs/Mozilla/Firefox/Releases/114), [Chrome 115](https://developer.chrome.com/blog/chrome-115-beta/), and [Safari 16.6](https://developer.apple.com/documentation/safari-release-notes/safari-16_6-release-notes). 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.

Chrome 115 includes multiple values for the CSS `display` property. This means that `display: flex` becomes `display: block flex` and `display: block` becomes `display: block flow`. The single values are maintained as legacy keywords, and once in Chrome Stable this makes the multiple values available accross all engines.

Also in Chrome 115 are the `ScrollTimeline` and `ViewTimeline` extensions to the Web Animations specification. These enable [scroll-driven animations](https://developer.chrome.com/articles/scroll-driven-animations/) via CSS and JavaScript.

Firefox 114 includes the [WebTransport API](https://developer.mozilla.org/docs/Web/API/WebTransport_API), a modern update to WebSockets providing support for multiple streams, unidirectional streams, and out-of-order delivery.

_Photo by [Photoz ace](https://unsplash.com/@photozace)._