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.
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.