Novità di Chrome 97

Pete LePage

Tieni presente quanto segue:

Buon anno! Sono Pete LePage. Diamo un'occhiata alle novità per gli sviluppatori in Chrome 97.

Web Transport

Se utilizzi Web Sockets o l'API WebRTC Data Channel per inviare messaggi tra il server e la pagina, è disponibile una nuova opzione. WebTransport è una nuova API che offre messaggistica client-server bidirezionale a bassa latenza.

Ha una latenza inferiore rispetto a WebSocket e, a differenza dell'API RTC Data Channel, progettata per la messaggistica peer-to-peer, l'API Web Transport è progettata specificamente per la messaggistica client-server.

Supporta l'invio di dati in modo affidabile con le API stream e in modo inaffidabile con le API datagram. È supportato nei worker web. Inoltre, poiché espone un'interfaccia conforme a Streams, supporta le ottimizzazioni relative alla backpressure.

Per utilizzarlo, devi disporre di un server che supporti HTTP/3, che in genere è più semplice rispetto alla configurazione e alla gestione di un server WebRTC. Apri una nuova istanza di WebTransport, attendi che si connetta e potrai iniziare a inviare i dati.

const url = 'https://example.com:4999/foo/bar';
const transport = new WebTransport(url);
await transport.ready;

const writer = transport.datagrams.writable.getWriter();
const data1 = new Uint8Array([65, 66, 67]);
writer.write(data1);

Per informazioni dettagliate, consulta l'articolo Eseguire esperimenti con WebTransport su web.dev.

Rilevamento di funzionalità di tipo di script

Attualmente, possiamo utilizzare l'attributo nomodule per rilevare il supporto per i moduli JavaScript nel browser. Tuttavia, sono in programma diverse proposte di nuove funzionalità, come le mappe di importazione, le regole di speculazione e il precaricamento dei set. Abbiamo bisogno di un modo per sapere cosa supporta un browser.

Inserisci HTMLScriptElement.supports(). Puoi utilizzarlo per determinare quali tipi di script puoi utilizzare e inviare al browser l'opzione migliore.

if (HTMLScriptElement.supports('importmap')) {
  // Use <script type="importmap" ...>
} else if (HTMLScriptElement.supports('module')) {
  // Use <script type="module" ...>
} else {
  // Use classic method...
}

Nuovi prototipi di array

Mi piace quando JavaScript diventa più semplice. Array e TypedArray ora supportano i metodi statici findLast() e findLastIndex().

Queste funzioni sono sostanzialmente le stesse di find() e findIndex(), ma cercano dalla fine di un array instead of dall'inizio.

Ad esempio, per trovare l'ultimo numero di un array maggiore di dieci, chiama findLast() con una funzione di test che controlla se il valore è maggiore di dieci.

const array1 = [5, 12, 8, 130, 44, 3, 6];

function greaterThanTen(val) {
  return val > 10;
}

const last = array1.findLast(greaterThanTen);
// 44

const lIdx = array1.findLastIndex(greaterThanTen);
// 4

Emulare Chrome 100 nella stringa UA

Tra pochi mesi arriveremo a Chrome 100, un numero di versione a tre cifre. Qualsiasi codice che controlla i numeri di versione o analizza la stringa UA deve essere controllato per assicurarsi che gestisca tre cifre.

Esiste un flag denominato #force-major-version-to-100 che consente di impostare il numero di versione corrente su 100, in modo da assicurarti che tutto funzioni come previsto.

Pagina dei flag di Chrome che mette in evidenza la nuova opzione #force-major-version-to-100

E tanto altro.

Naturalmente c'è molto altro.

Le nuove righe nelle voci dei moduli sono ora normalizzate come in Gecko e WebKit, migliorando l'interoperabilità tra i browser.

Stiamo standardizzando i nomi degli indicatori dei clienti anteponendo il prefisso sec-ch. Ad esempio, dpr diventa sec-ch-dpr. Continueremo a supportare le versioni esistenti di questi suggerimenti, ma ti consigliamo di prevedere la loro eventuale ritiro e rimozione.

Gli elementi chiusi <details> ora sono disponibili per la ricerca e possono essere collegati. Questi elementi nascosti vengono espansi automaticamente quando vengono utilizzati Trova nella paginaScrollToTextFragment e la navigazione tra i frammenti di elementi.

Per approfondire

Descrive solo alcuni dei punti salienti. Controlla i link qui sotto per ulteriori modifiche in Chrome 97.

Iscriviti

Per non perderti gli aggiornamenti, iscriviti al canale YouTube degli sviluppatori di Chrome: riceverai una notifica via email ogni volta che verrà lanciato un nuovo video.

Sono Pete LePage e, non appena verrà rilasciato Chrome 98, sarò qui per dirti quali sono le novità di Chrome.