Novità sulla piattaforma web ad aprile

Scopri alcune delle funzionalità interessanti introdotte nei browser web stabili e beta durante il mese di aprile 2023.

Ad aprile 2023, Firefox 112 e Chrome 112 sono diventati stabili. Vediamo cosa significa per la piattaforma web.

Attributo inert

Firefox 112 include l'attributo globale inert. Questo attributo indica al browser di ignorare l'elemento, segnalando i contenuti che non devono essere interattivi. Il GDPR:

  • Impedisce l'attivazione degli eventi click.
  • Impedisce all'elemento di acquisire lo stato attivo.
  • Esclude l'elemento e i relativi contenuti dall'albero di accessibilità.

Questo attributo è ora interoperabile in tutti e tre i motori.

Supporto dei browser

  • Chrome: 102.
  • Edge: 102.
  • Firefox: 112.
  • Safari: 15.5.

Origine

La funzione di attenuazione linear()

La funzione di easing linear() consente l'interpolazione lineare tra una serie di punti. In questo modo, puoi creare animazioni più complesse, come effetti elastici e di rimbalzo. Questa funzione è disponibile in Firefox 112.

Supporto dei browser

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

Nidificazione CSS

Chrome 112 aggiunge il supporto per il nidificazione CSS, una funzionalità molto attesa da molti sviluppatori. Viene introdotto un 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

CSS animation-composition

Chrome 112 include anche il supporto di animation-composition. Scopri come funziona questa proprietà in Specificare la modalità di composizione di più effetti di animazione con animation-composition.

Supporto dei browser

  • Chrome: 112.
  • Edge: 112.
  • Firefox: 115.
  • Safari: 16.

Origine

Nuova modalità headless

Se utilizzi la modalità headless di Chrome, ad esempio con Puppeteer, la versione 112 introduce una modalità headless completamente nuova. Scopri di più nella pagina La modalità headless di Chrome riceve un upgrade.

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 versioni beta sono Firefox 113 e Chrome 113, mentre la versione beta di Safari 16.5 è ancora in corso. Queste release offrono alla piattaforma molte funzionalità interessanti. Consulta le note di rilascio per tutti i dettagli. Ecco alcune delle novità principali.

Firefox 113 include le funzioni color(), lab(), lch(), oklab() e oklch(). Sono incluse anche la funzione color-mix() di CSS Color 5 e la proprietà forced-color-adjust.

Firefox include anche la sintassi nth-child of <selector>, che offre un controllo più preciso sugli elementi da selezionare. Scopri di più nella sezione Maggiore controllo sulle selezioni :nth-child() con la sintassi of S.

Per il CSS, Chrome 113 include le funzionalità multimediali overflow-inline, overflow-block e update. Sono inclusi anche nella funzione di easing linear() e nel tipo image-set() senza prefisso.

Chrome 113 include anche 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 in più canvas da un singolo dispositivo grafico e prestazioni migliori e più prevedibili.

Componente della serie Novità sul web