Novità di Chrome 62

Pete LePage

E ce n'è molto altro.

Mi chiamo Pete LePage. Scopriamo le novità di Chrome 62 per gli sviluppatori.

Vuoi l'elenco completo delle modifiche? Consulta l'elenco delle modifiche al repository di origine di Chromium.

Indicatore di qualità della rete

L'API Network Information è disponibile in Chrome da un po' di tempo, ma fornisce solo velocità di rete teoriche in base alla connessione dell'utente. Immagina di utilizzare il Wi-Fi, ma di essere connesso a un hotspot cellulare con velocità solo 2G. L'API segnalerà la rete Wi-Fi.

console.log(navigator.connection.type);
> wifi

In Chrome 62, l'API è stata ampliata per fornire metriche effettive sul rendimento della rete dal client. Utilizzando questi indicatori della qualità della rete, puoi personalizzare i contenuti in base alla rete. Ad esempio, su connessioni molto lente, puoi migliorare le prestazioni di caricamento della pagina pubblicando una versione ridotta.

Per semplificare la logica dell'applicazione, l'API restituisce il rendimento della rete misurato in termini di confronto con una connessione di rete mobile. Ad esempio, se è collegata a una connessione in fibra super veloce, l'API segnalerà 4G.

console.log(navigator.connection.effectiveType);
> 4G

Questi indicatori saranno disponibili anche come intestazioni delle richieste HTTP e verranno attivati tramite Client Hints. Per approfondire, consulta il sample e le specifiche.

Caratteri variabili OpenType

In genere, un carattere conteneva una sola istanza di una famiglia di caratteri, ad esempio uno spessore o un allungamento. Se volessi caratteri normali, in grassetto e in corsivo, dovresti includere tre caratteri separati, aumentando il peso della pagina.

Un carattere variabile OpenType è l'equivalente di più caratteri singoli che possono essere pacchettizzati in modo compatto in un unico file del carattere. Regolando la proprietà CSS font-variation-settings è possibile modificare facilmente allungamento, stile, spessore e altro ancora, offrendo un numero infinito di varianti stilistiche. Ora questi tre caratteri possono essere combinati in un unico file compatto.

.heading {
  font-family: "Avenir Next Variable";
  font-size: 48px;
  font-variation-settings: 'wght' 700, 'wdth' 75;
}
.content {
  font-family: "Avenir Next Variable";
  font-size: 24px;
  font-variation-settings: 'wght' 400;
}

I caratteri variabili OpenType ci offrono un nuovo potente strumento per creare caratteri adattabili e ridurre il peso della pagina. Per ulteriori dettagli, consulta Introduzione ai caratteri OpenType variabili di John Hudson.

Acquisizione di contenuti multimediali da elementi DOM

Ora puoi acquisire contenuti in tempo reale in un MediaStream direttamente da HTMLMediaElements, come audio e video, con l'API Media Capture dall'API DOM Elements.

Dopo aver invocato captureStream() su un elemento multimediale HTML, i contenuti in streaming possono essere manipolati, elaborati, inviati da remoto o registrati. Immagina di usare l'audio web per creare il tuo equalizzatore o vocoder. In alternativa, puoi trasmettere i contenuti su un sito remoto utilizzando WebRTC. Le possibilità sono quasi infinite.

Etichette Non sicura per alcune pagine HTTP

Come annunciato in precedenza, a partire da Chrome 62, quando un utente inserisce dati in una pagina HTTP, Chrome contrassegnerà la pagina come "Non sicura" con un'etichetta nella barra degli indirizzi. Questa etichetta verrà mostrata anche in modalità di navigazione in incognito per tutte le pagine HTTP.

E tanto altro.

Queste sono solo alcune delle modifiche di Chrome 62 per gli sviluppatori, ovviamente e ce ne sono molte altre.

Poi iscriviti al nostro canale YouTube e riceverai una notifica via email ogni volta che lanceremo un nuovo video.

Sono Pete LePage e, non appena verrà rilasciato Chrome 63, sarò qui per raccontarti le novità di Chrome.