Novità sulla piattaforma web a maggio

Scopri alcune delle funzionalità interessanti che sono state implementate nei browser web stabili e beta durante il mese di maggio 2023.

A maggio 2023, Firefox 113, Chrome 113, Chrome 114 e Safari 16.5 sono diventati stabili. Vediamo cosa significa 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 calcolo GPU, un accesso con un overhead inferiore all'hardware GPU, la possibilità di eseguire il rendering su 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 i 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à dei contenuti multimediali CSS e altro

Per 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(), di cui 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 di colore CSS 4

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 di colore e le nuove funzioni sono ora supportati in tutti e tre i principali motori. 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 aggiunge anche la possibilità di passare un elenco di selettori a :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

Equilibrare i titoli con text-wrap: balance

Da Chrome 114 puoi utilizzare 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 è presente anche l'API Popover, che semplifica la creazione di elementi dell'interfaccia utente (UI) temporanei che vengono visualizzati sopra tutte le altre UI delle 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'ottima occasione per testare nuove funzionalità o rimozioni che potrebbero influire sul tuo sito prima che la release venga resa disponibile a livello globale. 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 in Chrome Stable, i valori multipli diventano disponibili 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 di WebSocket che fornisce il supporto di più stream, stream unidirezionali e invio fuori sequenza.

Componente della serie Novità sul web