Chrome 108 beta

Nuove unità area visibile CSS, API Federated Credential Management, caratteri COLRv1 variabili e altro ancora.

Se non diversamente indicato, le modifiche descritte di seguito si applicano alla release più recente del canale beta di Chrome per Android, ChromeOS, Linux, macOS e Windows. Scopri di più sulle funzionalità elencate qui tramite i link forniti o nell'elenco su ChromeStatus.com. Chrome 108 è in versione beta a partire dal 27 ottobre 2022. Puoi scaricare la versione più recente su Google.com per computer o dal Google Play Store su Android.

CSS

Chrome 108 include una serie di nuove funzionalità CSS.

Overflow CSS per gli elementi sostituiti

Chrome inizierà a implementare una modifica che consente agli sviluppatori di usare la proprietà overflow esistente con elementi sostituiti che vengono visualizzati all'esterno della casella dei contenuti. Associato a object-view-box, può essere utilizzato per creare un'immagine con un bagliore o un'ombra personalizzati applicati, con un comportamento corretto di overflow inchiostro come avrebbe un'ombra CSS.

Questa è una potenziale modifica che provoca un errore. Per saperne di più, consulta Una modifica relativa all'overflow degli elementi sostituiti.

Unità aree visibili piccole, grandi, dinamiche e logiche

Viene aggiunto il supporto per le unità piccole (svw, svh, svi, svb, svmin, svmax), grandi (lvw, lvh, lvi, lvb, lvmin, lvmax), dinamiche (dvw, dvh, dvi, dvb, dvmin, dvmax) e logiche (vi, vb).

Supporto di break-after, break-before e break-inside per i CSS

Supporto del valore "evitabile" per le proprietà di frammentazione CSS break-before, break-after e break-inside durante la stampa. Questo valore indica al browser di evitare interruzioni prima, dopo o all'interno dell'elemento a cui viene applicato. Ad esempio, il seguente CSS evita che un'immagine venga interrotta durante un'interruzione di pagina.

figure {
    break-inside: avoid;
}

Questa funzionalità è stata aggiunta perché la versione 108 di Chrome ha aggiunto il supporto per la stampa LayoutNG.

Ultimo allineamento elemento di riferimento

Questa funzionalità consente agli sviluppatori di allineare gli elementi all'interno del layout flessibile o a griglia in base all'ultima base di riferimento, anziché alla prima. A questo scopo, devono utilizzare le seguenti proprietà:

  • align-items: last baseline;
  • justify-items: last baseline;
  • align-self: last baseline;
  • justify-self: last baseline;

ContentVisibilityAutoStateChanged evento

Un evento che si attiva su un elemento con content-visibility: auto quando lo stato di rendering dell'elemento cambia a causa di uno qualsiasi degli attributi che rendono l'elemento pertinente per l'utente.

Il caso d'uso è consentire agli sviluppatori di avere un maggiore controllo su quando interrompere o avviare il rendering in risposta all'interruzione o all'avvio del rendering dello user agent del sottoalbero della visibilità dei contenuti. Ad esempio, lo sviluppatore potrebbe voler interrompere gli aggiornamenti delle reazioni in un sottoalbero che non viene visualizzato dallo user agent. Analogamente, potrebbe essere opportuno interrompere qualsiasi altro aggiornamento dello script (ad esempio gli aggiornamenti del canvas) quando lo user agent non sta eseguendo il rendering dell'elemento.

API web

Gestione delle credenziali federate (precedentemente WebID)

L'API Federated Credential Management consente agli utenti di utilizzare la propria identità federata per accedere ai siti web in modo compatibile con i miglioramenti alla privacy del browser.

Media Source Extensions nei worker

Abilita l'utilizzo dell'API Media Source Extensions (MSE) dai contesti DedicatedWorker per migliorare le prestazioni del buffering dei contenuti multimediali per la riproduzione da parte di HTMLMediaElement nel contesto della finestra principale. Creando un oggetto MediaSource in un contesto DedicatedWorker, un'applicazione potrebbe quindi ottenere un MediaSourceHandle e trasferirlo al thread principale per utilizzarlo per il collegamento a un HTMLMediaElement. Il contesto che ha creato l'oggetto MediaSource può quindi utilizzarlo per il buffering dei contenuti multimediali.

Intestazione dei client hint per le funzionalità multimediali relative a Sec-CH-Prefers-Reduced-Motion preferenza utente

Le intestazioni dei client hint per le funzionalità multimediali preferite dell'utente definiscono un insieme di intestazioni dei client hint HTTP relative alle funzionalità multimediali delle preferenze dell'utente, come definito dal livello 5 delle query supporti. Se utilizzate come Critical Client Hints, queste intestazioni consentono ai server di fare scelte intelligenti riguardo, ad esempio, all'incorporamento CSS. Sec-CH-Prefers-Reduced-Motion riflette la preferenza prefers-reduced-motion dell'utente.

Lettori BYOB di WebTransport

Supporta i lettori BYOB(bring-your-own-buffer) per WebTransport per consentire la lettura in un buffer fornito dallo sviluppatore. I lettori BYOB possono ridurre al minimo le copie del buffer e le allocazioni di memoria.

Caratteri jolly nelle origini dei criteri relativi alle autorizzazioni

La specifica dei criteri relativi alle autorizzazioni definisce un meccanismo che consente agli sviluppatori di attivare e disattivare in modo selettivo l'utilizzo di varie funzionalità e API del browser. Una funzionalità di questo meccanismo consente di abilitare le funzionalità solo su origini esplicitamente enumerate (ad esempio, https://foo.com/). Questo meccanismo non è sufficientemente flessibile per la progettazione di alcune reti CDN, che forniscono contenuti tramite un'origine che potrebbe essere ospitata su una delle diverse centinaia di sottodomini possibili.

Di conseguenza, questa funzionalità aggiunge il supporto per i caratteri jolly nei criteri relativi alle autorizzazioni strutturati come SCHEME://*.HOST:PORT (ad esempio https://*.foo.com/), in cui è possibile creare un'origine valida da SCHEME://HOST:PORT (ad esempio, https://foo.com/). Ciò richiede che HOST sia un dominio registrabile. Ciò significa che https://*.bar.foo.com/ funziona, ma https://*.com/ no (se vuoi consentire a tutti i domini di utilizzare la funzionalità, devi semplicemente delegare a *).

Metodi di sincronizzazione per AccessHandle nell'API File System Access

Aggiorna i metodi asincroni flush(), getSize() e truncate() in FileSystemSyncAccessHandle nell'API File System Access ai metodi sincroni. Attualmente FileSystemSyncAccessHandle presenta un mix di metodi di sincronizzazione e asincrono, che ne ostacolano le prestazioni e l'usabilità, in particolare per le applicazioni che eseguono la porta C/C++ a Wasm. Questo aggiornamento fornirà coerenza nell'utilizzo dell'API e migliorerà le prestazioni per le librerie basate su Wasm.

Questa è una potenziale modifica che provoca un errore. Per saperne di più, leggi la sezione Interruzione della modifica: metodi di sincronizzazione per AccessHandles.

UI condizionale WebAuthn

L'interfaccia utente condizionale per WebAuthn è supportata su Windows 22H2 o versioni successive, macOS e Android P o versioni successive. Anche l'interfaccia utente di WebAuthn sulle piattaforme desktop è stata aggiornata.

Caratteri COLRv1 variabili e rilevamento delle funzionalità dei caratteri

Supporto dei caratteri variabili COLRv1

I caratteri vettoriali di colore COLRv1 sono supportati da Chrome 98, ma questa versione iniziale supportava solo la funzionalità statica della tabella COLRv1. La specifica COLRv1 definisce l'integrazione con le variazioni OpenType che consentono di modificare le proprietà dei caratteri dei gradienti e delle trasformazioni mediante la modifica dei parametri degli assi variabili. Questo secondo passaggio supporta queste varianti in COLRv1.

Estensioni di condizione font-tech() e font-format() a CSS @supports

L'utilizzo di font-tech() e font-format() insieme a @supports CSS consente di rilevare la tecnologia dei caratteri e il supporto dei formati, nonché il miglioramento progressivo dei contenuti. Il seguente esempio verifica il supporto dei caratteri COLRv1.

@supports font-tech(color-COLRv1) {

}

Supporto delle funzioni tech() nel descrittore @font-face src:

I caratteri CSS di livello 4 offrono ulteriori mezzi per selezionare o filtrare le risorse dei caratteri. È stata introdotta la funzione tech(), che consente di passare un elenco di tecnologie di caratteri richieste da questo rispettivo blob di caratteri per il funzionamento. Sulla base di ciò, lo user agent selezionerà la prima risorsa adatta.

Chrome su Android

Il sistema operativo Android ora ridimensiona l'area visibile per impostazione predefinita

La tastiera sullo schermo di Android ridimensiona l'area visibile per impostazione predefinita anziché il blocco contenitore iniziale. Gli autori possono disattivare questa funzionalità utilizzando la nuova chiave della meta-viewport interactive-widget.

Prove dell'origine

Questa release di Chrome ha due nuove prove dell'origine.

Identità del commerciante nell'evento canmakepayment

L'evento del service worker di canmakepayment consente al commerciante di sapere se l'utente ha una carta registrata in un'app di pagamento installata. Passa automaticamente l'origine del commerciante e i dati arbitrari a un service worker dall'origine dell'app di pagamento. Questa comunicazione multiorigine avviene sulla costruzione di PaymentRequest in JavaScript, non richiede un gesto dell'utente e non mostra alcuna interfaccia utente. La prova dello sviluppatore per rimuovere i campi dell'identità da "canmakepayment" dell'evento può essere attivato tramite: chrome://flags/#clear-identity-in-can-make-payment. Se attivi questo flag, i campi relativi all'identità nella sezione "canmakepayment" verranno vuoti. (e l'intent IS_READY_TO_PAY di Android).

Per saperne di più, consulta l'articolo Aggiornamento del comportamento degli eventi CanMakePayment dell'API Payment Gestori.

API NotRipristinadReason Cache back/forward

L'API NotRipristinadReason segnalerà l'elenco dei motivi per cui una pagina non viene fornita da BFcache in una struttura ad albero di frame, tramite l'API Performance BrowsingTiming.

Le pagine possono essere bloccate dalla BFcache per diversi motivi, ad esempio per motivi richiesti dalla specifica e per motivi specifici dell'implementazione del browser. Gli sviluppatori possono raccogliere la percentuale di hit di BFCache sul proprio sito utilizzando il parametro persistente del gestore pageshow e PerformanceNavigationTiming.type(back-forward). Questa API consente ai siti di raccogliere informazioni sul motivo per cui BFCache non viene utilizzata in una navigazione della cronologia, in modo da poter intraprendere azioni per ogni motivo e rendere la propria pagina compatibile con BFCache.

Rimozioni e rimozioni

Questa versione di Chrome introduce i ritiri e le rimozioni elencati di seguito. Visita il sito ChromeStatus.com per consultare gli elenchi di ritiri pianificati, ritiri attuali e rimozioni precedenti.

Deprecazioni

In questa versione di Chrome viene ritirata una funzionalità.

Ritira e rimuovi window.defaultStatus e window.defaultstatus

Si tratta di API non standard che non sono implementate da tutti i browser e non hanno alcun effetto sul comportamento del browser. In questo modo vengono ripuliti e viene rimosso un potenziale segnale di fingerprinting.

In origine, erano utilizzati per modificare/controllare la "barra di stato" testo nella parte inferiore delle finestre del browser. Tuttavia, non hanno mai avuto alcun effetto effettivo sulla barra di stato di Chrome e non sono attributi standardizzati. Gecko non supporta questi attributi dalla versione 23; WebKit supporta ancora questi attributi. L'attributo window.status correlato è standardizzato, ma non deve mai avere alcun impatto sulla barra di stato della finestra.

Rimozioni

In questa versione di Chrome sono state rimosse quattro funzionalità.

Rimuovi ImageDecoderInit.premultiplyAlpha

La funzionalità non ha effetti osservabili nei casi d'uso principali, ma potrebbe limitare le implementazioni in modi non ottimali. Per una descrizione più dettagliata, consulta questo problema. Per consenso degli editor delle specifiche WebCodecs e mancato utilizzo (0,000000339% - 0,00000687% dei caricamenti di pagina per contatore di utilizzo in M106).

Rimuovi navigateEvent.restoreScroll()

restoreScroll() sta per essere sostituito da navigateEvent.scroll(). scroll() funziona in modo identico, ma consente allo sviluppatore di controllare i tempi di scorrimento per le navigazioni diverse (scroll() funziona quando lo scorrimento non è un ripristino, quindi il nome cambia insieme alla modifica del comportamento).

Rimuovi navigateEvent.transitionWhile()

transitionWhile() sta per essere sostituito da navigateEvent.intercept() a causa di difetti di progettazione segnalati dagli sviluppatori. intercetta() si comporta quasi allo stesso modo di transizioniDurante(), ma invece di utilizzare un parametro Promise obbligatorio, utilizza una funzione gestore facoltativa che restituisce una funzione Promise. Ciò consente al browser di controllare quando viene eseguito il gestore, metodo che è più avanti e più intuitivo rispetto a transitionWhile().

Rimuovi googIPv6 di WebRTC mediaConstraint

Puoi utilizzare "googIPv6: false" per disattivare il supporto IPv6 in WebRTC, come nell'esempio seguente.

new RTCPeerConnection({}, {mandatory:{googIPv6:false}});

IPv6 è abilitato per impostazione predefinita da molti anni e non dovremmo essere in grado di disattivarlo. Si tratta di un'API legacy che non esiste nelle specifiche.