Interoperabilità 2024

Dopo il successo di Interop 2022 e Interop 2023, siamo entusiasti dell'opportunità di collaborare ancora una volta con tutti i principali fornitori di browser e con altri stakeholder interessati. Il nostro obiettivo comune è migliorare l'interoperabilità tra le piattaforme web, semplificando il lavoro degli sviluppatori e arricchendo l'esperienza complessiva per gli utenti di internet.

L'interoperabilità è essenzialmente una serie completa di test e benchmark studiati per valutare la conformità dei singoli browser sulla base del nostro impegno congiunto agli standard web. In ultima analisi, Interop cerca di eliminare le incoerenze tra i browser e promuovere una visione unificata all'interno del settore.

Per Interop 2024, era prevista una procedura di proposta pubblica per reperire l'elenco iniziale delle funzionalità. Partendo da questo elenco, tutte le parti hanno collaborato per creare l'elenco delle aree di interesse per il 2024. Il seguente elenco include le aree in cui speriamo di vedere superato il 100% dei test selezionati entro la fine dell'anno.

Tutte le aree di interesse per il 2024

Interop 2024 include 12 nuove aree di interesse, più 5 riportate dal 2023 con alcune correzioni ancora da apportare. Le aree sono:

  • Accessibilità
  • Nidificazione CSS
  • Proprietà personalizzate
  • DOM shadow dichiarativo
  • font-size-adjust
  • URL HTTPS per WebSocket
  • IndexedDB
  • Layout
  • Eventi puntatore e mouse
  • Popover
  • Sintassi dei colori relativa
  • requestVideoFrameCallback
  • Stile barra di scorrimento
  • @starting-style e transizione-comportamento
  • Direzionalità del testo
  • text-wrap: "equilibrio"
  • URL

Per visualizzare i dettagli di tutte le aree di interesse, visita la dashboard di Interop 2024, dove sono mostrati i dettagli delle funzionalità e il lavoro necessario, insieme ai punteggi attuali per ogni browser. Nel resto di questo articolo, puoi scoprire alcune delle aree in cui Chrome deve lavorare di più per raggiungere il 100%.

Annidamento

Il modulo di nidificazione CSS definisce una sintassi per la nidificazione dei selettori, consentendo la possibilità di nidificare una regola di stile all'interno di un'altra, con il selettore della regola figlio relativa al selettore della regola padre.

La nidificazione di CSS è diversa dai preprocessori CSS come Sass in quanto viene analizzato dal browser anziché essere precompilato da un preprocessore CSS.

La nidificazione CSS favorisce la leggibilità, la modularità e la gestibilità dei fogli di stile CSS. Inoltre, potenzialmente consente di ridurre le dimensioni dei file CSS, diminuendo quindi la quantità di dati scaricati dagli utenti.

Sebbene tutti i browser supportino la nidificazione di CSS, ci sono alcune differenze nelle implementazioni dovute a modifiche alla specifica. Durante l'interoperabilità 2024, l'obiettivo è garantire che tutti i browser seguano le specifiche correnti.

Scopri di più sulla nidificazione di CSS e scopri un aggiornamento chiave alla specifica che attiva la nidificazione dei nomi dei tag degli elementi semplici.

text-wrap: "equilibrio"

Il valore del saldo della proprietà text-wrap CSS indica al browser che vuoi che bilancia le righe di testo. È generalmente utilizzato nei titoli o in altre brevi sezioni di testo per evitare la presenza di vedove tipografiche.

Un titolo a capo su due righe, con due parole nella seconda riga.
Un titolo non bilanciato
Un titolo a capo su due righe, ognuna con le stesse caratteristiche.
Un titolo bilanciato

I browser supportano diverse versioni di questa proprietà sia nel formato lungo che in quello abbreviato. Nel corso di Interop 2024, puntiamo a rendere questi sistemi interoperabili.

Il bilanciamento di titoli e altre sezioni di testo breve è una funzionalità richiesta di frequente dagli sviluppatori. Scopri di più in merito in CSS text-wrap: balance, il post Un fine alle vedove tipografiche sul web o CSS Text Balancing with text-wrap: balance.

URL HTTP(s) per WebSocket

Il costruttore WebSocket richiedeva originariamente gli URL ws: e wss:, impedendo l'uso di URL relativi e il codice alternativo risultante.

La specifica è stata aggiornata per consentire gli schemi http(s) e quindi gli URL relativi. Questi sono normalizzati in ws: e wss:. Durante l'interoperabilità 2024, aggiorneremo la nostra implementazione per supportare gli schemi http(s).

Sintassi dei colori relativa

La sintassi dei colori relativa è definita nella specifica CSS Color 5 e offre un modo per manipolare i colori in CSS. Ad esempio, scurire, schiarire o desaturare un colore.

La sintassi dei colori relativa è sostanzialmente interoperabile, ma i browser non hanno implementato la parola chiave currentcolor. Questi test sono inclusi in Interop 2024.

Scopri tutto quello che puoi fare con questa funzionalità nella sintassi dei colori relativi dei CSS.

Dashboard di Interop 2024

Come negli anni precedenti, i punteggi correnti per le release sperimentali e stabili del browser verranno pubblicati nella dashboard, in modo da permetterti di monitorare l'andamento dei punteggi.

Screenshot della dashboard con i punteggi - Interoperabilità: 65, Indagini: 0, Chrome Canary: 83, Edge Dev: 82, Firefox Nightly: 80, Safari Technology Preview: 79.
I punteggi delle versioni sperimentali del browser aggiornati al 1° febbraio 2024.

Siamo davvero entusiasti di vedere quanti miglioramenti sarà possibile per tutte le aree di interesse quest'anno.

Scopri di più su Interop 2024