Scopri alcune delle interessanti funzionalità disponibili nei browser web stabili e beta a maggio 2023.
Release del browser stabile
A maggio 2023, Firefox 113, Chrome 113, Chrome 114 e Safari 16.5 sono diventati stabili. Vediamo cosa comporta tutto ciò per la piattaforma web.
WebGPU
Chrome 113 include WebGPU, il successore delle API grafiche WebGL e WebGL 2 per il web. Offre funzionalità moderne come calcolo GPU, accesso overhead ridotto all'hardware GPU, possibilità di eseguire il rendering su più canvas da un singolo dispositivo grafico e prestazioni migliori e più prevedibili.
Insiemi proprietari
Gli insiemi proprietari (FPS) fanno parte di Privacy Sandbox. Consente alle organizzazioni di dichiarare relazioni tra siti, in modo che i browser possano decidere quando consentire l'accesso limitato ai cookie di terze parti per i siti all'interno di un insieme. FPS ha iniziato un'implementazione graduale in Chrome 113.
Funzionalità multimediali CSS e altro
Per quanto riguarda il CSS, Chrome 113 include le funzionalità multimediali overflow-inline
e overflow-block
.
E la funzionalità multimediale update
.
È inclusa anche la funzione di easing di linear()
, su cui puoi trovare ulteriori informazioni nell'articolo Creare curve di animazione complesse in CSS con la funzione di easing di linear()
.
Supporto dei browser
- 113
- 113
- 112
- 17,2
Funzionalità di Livello di colore 4 CSS
Firefox 113 include le notazioni funzionali color()
, lab()
, lch()
, oklab()
, oklch()
e color-mix()
, insieme alla proprietà forced-color-adjust. Ciò significa che i nuovi spazi colore e le nuove funzioni sono ora supportati in tutti e tre i motori principali. Scopri di più su questi spazi colore e funzioni nella guida ai colori CSS ad alta definizione.
Più controllo sulle selezioni :nth-child()
Firefox 113 aggiunge anche la possibilità di passare un elenco di selettori in :nth-child()
e nth-last-child()
. Scopri di più al riguardo e guarda gli esempi nel post More control over :nth-child() with the of S sintassi.
Supporto dei browser
- 111
- 111
- 113
- 9
API Compressions Streams
Ora supportata in tutti e tre i motori principali grazie all'inclusione in Firefox 113, l'API Compressions Streams consente la compressione e la decompressione dei flussi. Ciò significa che le applicazioni JavaScript non devono più raggruppare una libreria di compressione.
Nidificazione CSS
Safari 16.5 ha risolto principalmente i problemi, ma aggiunge anche il supporto per la nidificazione dei CSS, con il nuovo selettore di nidificazione >
, utilizzato per nidificare le regole di stile correlate, in modo familiare agli sviluppatori che hanno utilizzato i pre-processori:
.nesting {
color: hotpink;
> .is {
color: rebeccapurple;
> .awesome {
color: deeppink;
}
}
}
Trova un equilibrio tra i titoli e text-wrap: balance
A partire dalla versione 114 di Chrome puoi usare la versione text-wrap: balance
. In questo modo puoi bilanciare i titoli, evitando il problema di dover inserire una sola parola nell'ultima riga e ottenendo un risultato più piacevole e leggibile. Per saperne di più, consulta Testo a capo del CSS: saldo.
CHIPS: cookie con stato partizionato indipendente
Nell'ambito del processo di eliminazione graduale dei cookie di terze parti, CHIPS consente di attivare il partizionamento dei cookie di terze parti da parte del sito di primo livello utilizzando il nuovo attributo dei cookie Partitioned
. CHIPS sono disponibili in Chrome 114.
L'API Popover
Sempre in Chrome 114 è disponibile l'API Popover, che semplifica la creazione di elementi di interfaccia utente (UI) temporanei che vengono visualizzati nella parte superiore di tutte le altre UI delle app web.
Questi includono elementi interattivi per l'utente come menu di azioni, suggerimenti per gli elementi dei moduli, selettori di contenuti e UI per l'insegnamento.
Il nuovo attributo popover consente la visualizzazione automatica di qualsiasi elemento nel livello superiore. Ciò significa che non dovrai più preoccuparti di posizionamento, sovrapposizione di elementi, stato attivo o interazioni da tastiera per lo sviluppatore.
Scopri di più nella pagina Introduzione all'API popover.
Release del browser beta
Le versioni beta del browser offrono un'anteprima degli elementi che saranno disponibili nella versione stabile successiva del browser. È un ottimo momento per testare le nuove funzionalità, o le rimozioni, che potrebbero avere un impatto sul tuo sito prima dell'uscita ufficiale. Le nuove versioni beta sono Firefox 114, Chrome 115 e Safari 16.6. Queste release introducono molte fantastiche funzionalità nella piattaforma. Consulta le note di rilascio per tutti i dettagli, ecco alcune delle principali novità.
Chrome 115 include più valori per la proprietà CSS display
. Ciò significa che display: flex
diventa display: block flex
e display: block
diventa display: block flow
. I singoli valori vengono mantenuti come parole chiave precedenti e, una volta in Chrome stabile, i vari valori diventano disponibili in tutti i motori.
Sempre in Chrome 115 sono presenti le estensioni ScrollTimeline
e ViewTimeline
della specifica delle animazioni web. Queste consentono di attivare le animazioni con scorrimento tramite CSS e JavaScript.
Firefox 114 include l'API WebTransport, un aggiornamento moderno di WebSocket che supporta flussi multipli, flussi unidirezionali e distribuzione fuori ordine.
Parte della Nuova serie web