Uncover among the attention-grabbing options which have landed in secure and beta
internet browsers throughout September 2024.
Steady browser releases
In September 2024, Firefox
130,
Safari 18, and
Chrome 129 grew to become secure. This
put up seems on the new options added to the online platform.
Unique accordions with the identify
attribute for
Firefox 130 helps the identify
attribute of the
components, the place just one aspect inside a bunch will be open at atime. This allows you to create an unique accordion with out utilizing JavaScript.
Animate to auto (and extra)
Chrome 129 provides the CSS interpolate-size
property and calc-size()
perform.
The CSS interpolate-size
property lets a web page choose into animations and
transitions of CSS intrinsic sizing key phrases corresponding to auto
, min-content
, and
fit-content
, within the instances the place these key phrases will be animated.
The CSS calc-size()
perform is a CSS perform much like calc()
, nonetheless it
additionally helps operations on precisely one supported sizing key phrase.
Supported sizing key phrases are auto
, min-content
, max-content
, and
fit-content
.
Be taught extra in
Animate to height: auto; (and other intrinsic sizing keywords) in CSS.
Format durations in JavaScript
Additionally in Chrome 129 is Intl.DurationFormat
, offering a way of formatting
durations, for instance “1 hr 40 min 30 sec”, that helps a number of locales.
WebCodecs API
The
Web Codecs API
is now supported on desktop in Firefox 130, giving internet
builders low-level entry to the person frames of a video stream and
chunks of audio. The brand new interfaces embrace: VideoEncoder
, VideoDecoder
,
EncodedVideoChunk
, VideoFrame
, and VideoColorSpace
. This API would not fairly
make Baseline Newly obtainable as it isn’t but supported in Firefox Android,
nonetheless there may be Firefox Nightly assist for Android.
CSS type queries for customized properties
Safari 18 brings assist for a number of new options together with CSS Type Queries.
Type queries present a strategy to create reusable types, and apply them as a
group. For instance when you’ve a reusable part with a number of variations.
Be taught extra about
CSS style queries.
Similar doc view transitions
Safari 18 additionally helps identical doc view transitions for SPAs,
letting you create visible transitions between totally different states of an app.
Be taught extra about
same document view transitions
Beta browser releases
Beta browser variations offer you a preview of issues that can be within the subsequent
secure model of the browser. It is a good time to check new options, or
removals, that might influence your website earlier than the world will get that launch. New
betas are Firefox 131,
Chrome 130,
and Safari 18.1.
These releases carry many nice options to the platform.
Take a look at the discharge notes for the entire particulars. Listed below are just some
highlights.
Firefox 131 consists of new JavaScript iterator helpers
and
Cookies Having Independent Partitioned State (CHIPS) is now enabled.
Chrome 130 consists of assist for box-decoration-break: clone
each for inline
fragmentation (line structure) and block fragmentation (fragments created for
printing and multicol). There’s additionally higher error reporting in IndexedDB,
and a brand new linked
attribute for the Internet Serial SerialPort
interface.
Safari 18.1 is a launch of bugfixes to present options.