Novità sulla piattaforma web a maggio

Scopri alcune delle interessanti funzionalità disponibili nei browser web stabili e beta a maggio 2023.

A maggio 2023, Firefox 113, Chrome 113, Chrome 114 e Safari 16.5 sono diventati stabili. Vediamo cosa significa tutto questo per la piattaforma web.

WebGPU

Chrome 113 include WebGPU, il successore delle API di grafica WebGL e WebGL 2 per il web. Offre funzionalità moderne come il computing GPU, l'accesso a overhead ridotto all'hardware GPU, la possibilità di eseguire il rendering in più canvas da un singolo dispositivo grafico e prestazioni migliori e più prevedibili.

Supporto dei browser

  • Chrome: 113.
  • Edge: 113.
  • Anteprima della tecnologia di Firefox: supportata.
  • Safari Technology Preview: supportato.

Origine

Insiemi proprietari

Gli insiemi proprietari fanno parte di Privacy Sandbox. È un modo per le organizzazioni di dichiarare le relazioni tra siti, in modo che i browser possano decidere quando consentire un 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à dei contenuti multimediali CSS e altro

Per i CSS, Chrome 113 include le funzionalità multimediali overflow-inline e overflow-block.

Supporto dei browser

  • Chrome: 113.
  • Edge: 113.
  • Firefox: 66.
  • Safari: 17.

Origine

e la funzionalità multimediale update.

Supporto dei browser

  • Chrome: 113.
  • Edge: 113.
  • Firefox: 102.
  • Safari: 17.

Origine

È inclusa anche la funzione di easing linear(), che puoi scoprire di più nell'articolo Creare curve di animazione complesse in CSS con la funzione di easing linear().

Supporto dei browser

  • Chrome: 113.
  • Edge: 113.
  • Firefox: 112.
  • Safari: 17.2.

Funzionalità del livello 4 del colore CSS

Firefox 113 include le notazioni funzionali color(), lab(), lch(), oklab(), oklch() e color-mix(), oltre 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. Puoi scoprire di più su questi spazi di colore e su queste funzioni nella guida ai colori CSS ad alta definizione.

Supporto dei browser

  • Chrome: 111.
  • Edge: 111.
  • Firefox: 113.
  • Safari: 16.2.

Origine

Maggiore controllo sulle selezioni :nth-child()

Firefox 113 consente anche di inserire un elenco di selettore in :nth-child() e nth-last-child(). Scopri di più su questo argomento e guarda gli esempi nel post Più controllo sulle selezioni :nth-child() con la sintassi of S.

Supporto dei browser

  • Chrome: 111.
  • Edge: 111.
  • Firefox: 113.
  • Safari: 9.

API Compressions Streams

Ora supportata in tutti e tre i principali motori grazie all'inclusione in Firefox 113, l'API Compressions Streams consente la compressione e la decompressione degli stream. Ciò significa che le applicazioni JavaScript non devono più includere una libreria di compressione.

Supporto dei browser

  • Chrome: 80.
  • Bordo: 80.
  • Firefox: 113.
  • Safari: 16.4.

Origine

Nidificazione CSS

Safari 16.5 ha risolto la maggior parte dei problemi, ma aggiunge anche il supporto per il nidificazione CSS, con il nuovo selettore di nidificazione >, utilizzato per nidificare le regole di stile correlate, in un modo familiare agli sviluppatori che hanno utilizzato i pre-processori:

.nesting {
 
color: hotpink;

 
> .is {
   
color: rebeccapurple;

   
> .awesome {
     
color: deeppink;
   
}
 
}
}

Supporto dei browser

  • Chrome: 120.
  • Bordo: 120.
  • Firefox: 117.
  • Safari: 17.2.

Origine

Trova un equilibrio tra i titoli e text-wrap: balance

A partire da Chrome 114, puoi usare text-wrap: balance. In questo modo puoi bilanciare i titoli, evitando il problema di avere una sola parola nell'ultima riga, e ottenere un risultato più piacevole e leggibile. Scopri di più in CSS text-wrap: balance.

Supporto dei browser

  • Chrome: 114.
  • Edge: 114.
  • Firefox: 121.
  • Safari: 17.4.

Origine

CHIPS: Cookies Having Independent Partitioned State

Nell'ambito del lavoro volto a eliminare i cookie di terze parti, CHIPS consente di attivare la suddivisione dei cookie di terze parti per sito di primo livello utilizzando il nuovo attributo cookie Partitioned. CHIPS è disponibile in Chrome 114.

L'API Popover

In Chrome 114 è disponibile anche l'API Popover, che semplifica la creazione di elementi temporanei dell'interfaccia utente che vengono visualizzati sopra tutte le altre app web.

Sono inclusi elementi interattivi per l'utente, come menu di azioni, suggerimenti di elementi di modulo, selettori di contenuti e interfaccia utente didattica.

Il nuovo attributo popover consente di visualizzare automaticamente qualsiasi elemento nel livello superiore. Ciò significa che lo sviluppatore non deve più preoccuparsi di posizionamento, elementi impilzati, attivazione o interazioni con la tastiera.

Scopri di più nella sezione Introduzione all'API popover.

Supporto dei browser

  • Chrome: 114.
  • Edge: 114.
  • Firefox: 120.
  • Safari: 17.

Origine

Release beta del browser

Le versioni beta del browser ti offrono un'anteprima delle funzionalità che saranno disponibili nella prossima versione stabile del browser. È un ottimo momento per testare nuove funzionalità, o rimozioni, che potrebbero avere un impatto sul tuo sito prima che il mondo venga rilasciato. Le nuove beta sono Firefox 114, Chrome 115 e Safari 16.6. Queste release offrono alla piattaforma molte funzionalità interessanti. Consulta le note di rilascio per tutti i dettagli. Ecco alcune delle novità principali.

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 nella versione stabile di Chrome, vengono resi disponibili più valori in tutti i motori.

In Chrome 115 sono presenti anche le estensioni ScrollTimeline e ViewTimeline alla specifica delle animazioni web. Questi consentono di attivare le animazioni basate sullo scorrimento tramite CSS e JavaScript.

Firefox 114 include l'API WebTransport, un aggiornamento moderno dei WebSocket che fornisce il supporto per più flussi, stream unidirezionali e consegna fuori ordine.

Componente della serie Novità sul web