Novità sulla piattaforma web a giugno

Scopri alcune delle funzionalità interessanti che sono state implementate nei browser web stabili e beta nel corso di giugno 2024.

Rachel Andrew

Release stabili del browser

A giugno 2024, Firefox 127 e Chrome 126 sono diventati stabili. Questo post esamina le nuove funzionalità aggiunte alla piattaforma web.

Metodi Set di JavaScript

Gli insiemi sono una struttura di dati essenziale in qualsiasi linguaggio di programmazione. Ora puoi utilizzare i metodi integrati di JavaScript per eseguire operazioni sugli insiemi. I seguenti metodi di impostazione sono ora disponibili in Firefox 127 e sono diventati parte della funzionalità di base appena disponibile:

• intersection()
• union()
• difference()
• symmetricDifference()
• isSubsetOf()
• isSupersetOf()
• isDisjointFrom()

Per scoprire di più, leggi l'articolo I metodi Set di JavaScript ora fanno parte di Baseline.

API Async Clipboard

L'API Clipboard è ora completamente supportata da Firefox 127. Firefox ora supporta l'interfaccia ClipboardItem, oltre ai metodi read() e write() dell'interfaccia Appunti. Scopri di più sull'API Clipboard in Sbloccare l'accesso alla clipboard.

Interpolazione dei colori nei gradienti CSS

I gradienti CSS sono specificati per accettare un <color-interpolation-method>, ora supportato in Firefox, rendendoli interoperabili su tutti i principali motori. Ora, ad esempio, puoi specificare un linear-gradient() utilizzando il sistema di colori hsl e un'interpolazione più lunga.

.longer {
  background: linear-gradient(90deg in hsl longer hue, red, blue);
}

Transizioni tra visualizzazioni di documenti

In precedenza, per utilizzare l'API View Transitions era necessario ristrutturare il sito web in un'applicazione SPA. Questo non avviene più; A partire da Chrome 126, le transizioni di visualizzazione sono ora attivate per impostazione predefinita per le navigazioni nello stesso dominio. Puoi creare una transizione di visualizzazione tra due documenti dello stesso origine diversi.

Per attivare una transizione tra le visualizzazioni dei documenti, è necessario che entrambe le parti la attivino. Per farlo, utilizza la regola at @view-transition e imposta il descrittore di navigazione su auto.

@view-transition {
  navigation: auto;
}

Scopri di più nella documentazione relativa alle transizioni tra visualizzazioni di documenti diversi.

L'estensione trigger-rumble dell'API Gamepad

Chrome 126 estende l'interfaccia GamepadHapticActuator per esporre la funzionalità trigger-rumble sul web per i gamepad compatibili. Questa estensione consentirà alle applicazioni web che sfruttano l'API Gamepad di far vibrare anche i trigger dei dispositivi gamepad dotati di questa funzionalità.

Release beta del browser

Le versioni beta del browser ti offrono un'anteprima delle funzionalità che saranno disponibili nella successiva versione stabile del browser. È un'ottima occasione per testare nuove funzionalità o rimuovere elementi che potrebbero influire sul tuo sito prima che la release venga resa disponibile a livello mondiale. Le nuove beta sono Firefox 128, Chrome 127, Safari 18 e Safari 17.6. Queste release offrono alla piattaforma molte funzionalità interessanti. Consulta le note di rilascio per tutti i dettagli. Ecco alcuni punti salienti.

Safari 17.6 è una release di correzioni alle funzionalità esistenti. Safari 18 offre una serie di nuove funzionalità interessanti, tra cui query sui contenitori di stili, l'API di transizione della visualizzazione per le app a pagina singola e il supporto della parola chiave safe nelle proprietà flexbox.

Chrome 127 include la proprietà CSS font-size-adjust, la possibilità di specificare il testo alternativo per i contenuti generati come un numero arbitrario di elementi e la possibilità di aggiungere informazioni sui singoli capitoli in MediaMetaData.

Firefox 128 include proprietà e valori CSS, pertanto questa funzionalità è stata contrassegnata come Nuovamente disponibile come base di riferimento. Utilizza @property per definire un type e impostare un valore alternativo per le proprietà personalizzate CSS.