Scopri alcune delle funzionalità interessanti che sono state implementate nei browser web stabili e beta nel corso di settembre 2024.
Release stabili del browser
A settembre 2024, Firefox 130, Safari 18 e Chrome 129 è diventato stabile. Questo post esamina le nuove funzionalità aggiunte alla piattaforma web.
Accordi esclusivi con l'attributo name
per <details>
Firefox 130 supporta l'attributo name
dell'elemento <details>
. Questo raggruppa gli elementi<details>
, in cui è possibile aprire un solo elemento alla volta all'interno di un gruppo. In questo modo puoi creare una sezione a scomparsa esclusiva senza utilizzare JavaScript.
Supporto dei browser
Animazione automatica (e altro ancora)
Chrome 129 aggiunge la proprietà CSS interpolate-size
e la funzione calc-size()
.
La proprietà CSS interpolate-size
consente a una pagina di attivare le animazioni e le transizioni delle parole chiave di dimensionamento intrinseco CSS come auto
, min-content
e fit-content
, nei casi in cui queste parole chiave possono essere animate.
La funzione CSS calc-size()
è una funzione CSS simile a calc()
, tuttavia
supporta anche le operazioni su una sola parola chiave di dimensionamento supportata.
Le parole chiave per le dimensioni supportate sono auto
, min-content
, max-content
e
fit-content
.
Scopri di più su Animate to height: auto; (e altre parole chiave di dimensionamento intrinseco) in CSS.
Durate del formato in JavaScript
Sempre in Chrome 129 è disponibile Intl.DurationFormat
, che fornisce un metodo di formattazione
diverse, ad esempio "1 h 40 min 30 sec", che supporta più impostazioni internazionali.
API WebCodecs
L'API Web Codecs è ora supportata su computer in Firefox 130, offrendo agli sviluppatori web l'accesso a basso livello ai singoli frame di uno stream video e ai chunk di audio. Le nuove interfacce includono: VideoEncoder
, VideoDecoder
,
EncodedVideoChunk
, VideoFrame
e VideoColorSpace
. Questa API non
rendere disponibile Baseline Newly in quanto non ancora supportata in Firefox Android,
ma c'è il supporto per Firefox Nightly.
Query di stile CSS per le proprietà personalizzate
Safari 18 supporta diverse nuove funzionalità, tra cui le query CSS Style. Le query sugli stili consentono di creare stili riutilizzabili e di applicarli come gruppo. Ad esempio, quando hai un componente riutilizzabile con più varianti.
Scopri di più sulle query sullo stile CSS.
Transizioni di visualizzazione stesso documento
Safari 18 supporta anche le transizioni tra visualizzazioni dello stesso documento per le SPA, consentendoti di creare transizioni visive tra stati diversi di un'app.
Scopri di più sulle transizioni tra le visualizzazioni dello stesso documento
Versioni del browser beta
Le versioni beta del browser ti offrono un'anteprima delle funzionalità che saranno disponibili nella successiva versione stabile del browser. È un ottimo momento per testare nuove funzionalità delle rimozioni, che potrebbero avere un impatto sul tuo sito prima che il resto del mondo lo riceva. Le nuove beta sono Firefox 131, Chrome 130 e Safari 18.1. Queste release integrano molte funzionalità straordinarie sulla piattaforma. Per tutti i dettagli, consulta le note di rilascio. Eccone solo alcuni.
Firefox 131 include nuovi helper di iteratore JavaScript e L'opzione Cookie con stato partizionato indipendente (CHIPS) è ora abilitata.
Chrome 130 include il supporto per box-decoration-break: clone
sia per la frammentazione in linea (layout riga) sia per la frammentazione dei blocchi (frammenti creati per la stampa e il multicol). Inoltre, in IndexedDB sono disponibili segnalazioni di errori migliori e un nuovo attributo connected
per l'interfaccia Web Serial SerialPort
.
Safari 18.1 è una release di correzioni di bug alle funzionalità esistenti.