Tieni presente quanto segue:
WebTransport
è una nuova opzione per l'invio di messaggi in tempo reale tra il client e il server.- Puoi utilizzare il rilevamento delle funzionalità per vedere quali tipi di script sono supportati da un browser.
- La ricerca di array dalla fine diventa un po' più semplice.
- E ce ne sono molte altre.
Buon anno! Mi chiamo Pete LePage. Analizziamo in dettaglio le novità per gli sviluppatori di Chrome 97.
Trasporto web
Se utilizzi Web Socket o l'API WebRTC Data Channel per inviare messaggi tra il tuo server e la pagina, hai a disposizione una nuova opzione. WebTransport
è una nuova API che offre messaggistica client-server a bassa latenza e bidirezionale.
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 appositamente per la messaggistica client-server.
Supporta l'invio di dati in modo affidabile con le sue API Stream e in modo inaffidabile con le sue API datagram. È supportato nei web worker. Espone un'interfaccia conforme a Streams, quindi supporta le ottimizzazioni in caso di contropressione.
Per utilizzarlo, è necessario un server che supporti HTTP/3, che in genere è più semplice rispetto all'impostazione e alla gestione di un server WebRTC. Apri una nuova istanza 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 Esperimenti con WebTransport su web.dev.
Rilevamento delle funzionalità del tipo di script
Oggi possiamo utilizzare l'attributo nomodule
per rilevare il supporto
per i moduli JavaScript nel browser. Tuttavia, nella pipeline sono presenti diverse proposte di nuove funzionalità, come l'importazione di mappe, regole di speculazione e il precaricamento dei bundle. 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 in pratica le stesse di find()
e
findIndex()
, ma eseguono la ricerca dalla fine di un array
anziché dall'inizio.
Ad esempio, per trovare l'ultimo numero in un array maggiore di dieci, chiama findLast()
con una funzione di test che verifichi se il valore è maggiore di dieci e il gioco è fatto.
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
Emula 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 chiamato #force-major-version-to-100
che modificherà il numero di versione corrente in 100, in modo che tu possa assicurarti che tutto funzioni come previsto.
E tanto altro.
Ovviamente c'è molto altro.
Le nuove righe nelle voci dei moduli ora sono normalizzate allo stesso modo di Gecko e WebKit, migliorando l'interoperabilità tra i browser.
Stiamo standardizzando i nomi dei suggerimenti client aggiungendo il prefisso sec-ch
.
Ad esempio, dpr
diventa sec-ch-dpr
. Continueremo a supportare le versioni esistenti di questi suggerimenti, ma ti consigliamo di prevederne il ritiro e la rimozione finali.
Gli elementi <details>
chiusi sono ora disponibili per la ricerca e possono essere collegati. Questi elementi nascosti si espanderanno automaticamente quando viene utilizzata la funzionalità Trova nella pagina, ScrollToTextFragment
e la navigazione dei frammenti di elementi.
Per approfondire
Vengono trattati solo alcuni dei punti salienti. Controlla i link riportati di seguito per ulteriori modifiche in Chrome 97.
- Novità di Chrome DevTools (97)
- Deprecazioni e rimozioni di Chrome 97
- Aggiornamenti di ChromeStatus.com per Chrome 97
- Novità di JavaScript in Chrome 97
- Elenco delle modifiche al repository di codice sorgente di Chromium
- Calendario delle release di Chrome
Abbonati
Per non perderti nessun aggiornamento, iscriviti al canale YouTube degli sviluppatori di Chrome e riceverai una notifica via email ogni volta che verrà lanciato un nuovo video.
Mi chiamo Pete LePage e non appena verrà rilasciata la versione 98 di Chrome, sarò qui per farti conoscere le novità di Chrome.