Discover some of the interesting features that have landed in stable and beta web browsers during January 2024.
Stable browser releases
In January 2024 Firefox 122, Chrome 121, and Safari 17.3 became stable. This post looks at the new features added to the web platform.
<hr>
in <select>
Firefox 122 adds <hr>
elements as an allowable child of <select>
elements.
This helps with readability of select lists with a lot of options.
All main browser engines now support this feature. However,
it is worth noting that no browser currently exposes the <hr>
to the
accessibility tree.
Browser Support
HTMLSelectElement.showPicker
Also for <select>
elements in Firefox is the
showPicker()
method for
HTMLSelectElement
. This is the same picker that would normally be displayed
when the element is selected,
but can be triggered from a button press or other user interaction.
Largest Contentful Paint (LCP) API
Firefox 122 also supports the LCP API. This performance API provides timing information about the largest image or text paint before users interact with a web page. Learn more about LCP in the LCP documentation.
CSS scrollbar properties
Chrome 121 adds support for the scrollbar properties scrollbar-color
and
scrollbar-width
. Learn more about this in the article
Scrollbar styling.
CSS font-palette
animation
The font-palette
property lets you select a specific palette to render a color font.
This property now supports animation,
so switching between palettes becomes a smooth transition between the two selected palettes.
The transfer()
and transferToFixedLength()
methods of ArrayBuffer
Firefox includes the JavaScript transfer()
and transferToFixedLength()
methods of ArrayBuffer
.
The transfer()
method creates a new ArrayBuffer
with the same byte contents as the current ArrayBuffer
,
then detaches the original ArrayBuffer
. The transferToFixedLength()
method
works in the same way, but creates a fixed size ArrayBuffer
.
Updates to the Speculation Rules API
Sites use the Speculation Rules API, to programmatically tell Chrome which pages to prerender, creating a better user experience by reducing page navigation time.
Chrome 121 includes support for document rules: they are an extension to the speculation rules syntax that lets the browser obtain the list of URLs for speculative loading from elements in a page. Document rules may include criteria for which of these links can be used. This, coupled with a new "eagerness" field lets you automatically prefetch or prerender links on pages immediately, on hover or on mouse down.
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 123, Chrome 122, and Safari 17.4. 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 123 beta includes the Declarative Shadow DOM.
Also in Firefox 123 is support for the 103 Early Hints
HTTP
information response
status code for
preloading resources
that the page may need while the server prepares the full response.
There's a lot of good stuff in the Safari 17.4 beta. For CSS there is support
for @scope
,
align-content
on block containers and table cells,
and for the ::grammar-error
and ::spelling-error
pseudo-elements, plus
much more.
In forms, support for vertical writing mode in form controls,
the showPicker()
method for <input type="date">
,
and support for <hr>
inside <select>
on iOS.
JavaScript also gets some new features with support for the detached()
,
transfer()
and transferToFixedLength()
methods of ArrayBuffer
among other things.
Chrome 122 beta includes an unsanitized
option in the read()
method of
the Async Clipboard API
to retrieve unsanitized HTML format.
For JavaScript there are new iterator helpers,
and new methods for the built-in Set
class.
Also in Chrome 122 is the Storage Buckets API which aims to make persistent storage eviction under heavy memory pressure more predictable.