Signed Exchange (SXG)

Un SXG è un meccanismo di importazione che consente di autenticare l'origine di una risorsa indipendentemente dal modo in cui è stata importata.

Katie Hempenius
Katie Hempenius
Devin Mullins
Devin Mullins

Gli scambi firmati (SXG) sono un meccanismo di pubblicazione che consente di autenticare l'origine di una risorsa indipendentemente dal modo in cui è stata pubblicata. L'implementazione di SXG può migliorare il Largest Contentful Paint (LCP) attivando il precaricamento cross-origin che garantisce la tutela della privacy. Inoltre, questo disaccoppiamento consente di migliorare una serie di casi d'uso, come le esperienze di internet offline e la pubblicazione da cache di terze parti.

Questo articolo fornisce una panoramica completa di SXG: come funziona, casi d'uso e strumenti.

Compatibilità del browser

SXG è supportato dai browser basati su Chromium (a partire dalle versioni Chrome 73, Edge 79 e Opera 64).

Panoramica

Come caso d'uso principale, SXG utilizza una cache per precaricare e pubblicare contenuti firmati criptograficamente dall'origine. In questo modo, è possibile velocizzare le navigazioni tra origini dai siti di referrer, garantendo al contempo che le pagine rimangano inalterate e attribuite correttamente alla loro origine. Tutte le informazioni potenzialmente identificative rimangono nascoste fino a quando l'utente non accede a un sito proteggendo così la sua privacy. La Ricerca Google è tra i primi utenti ad adottare le funzionalità di precaricamento SXG e, per i siti che ricevono una gran parte del traffico dalla Ricerca Google, SXG può essere uno strumento importante per velocizzare il caricamento delle pagine agli utenti. Nel tempo, ci auguriamo che questo impatto si estenda ad altri referrer.

Come funziona

Un sito firma una coppia di richiesta/risposta ("scambio HTTP") in modo da consentire al browser di verificare l'origine e l'integrità dei contenuti indipendentemente da come sono stati distribuiti. Di conseguenza, il browser può visualizzare l'URL del sito di origine nella barra degli indirizzi anziché l'URL del server che ha pubblicato i contenuti.

Diagramma che spiega il funzionamento di Signed Exchanges. Browser che comunica con la cache che comunica con il sito di destinazione

In passato, l'unico modo per un sito di utilizzare una terza parte per distribuire i suoi contenuti mantenendo l'attribuzione era condividere i suoi certificati SSL con il distributore. Questo presenta svantaggi in termini di sicurezza; inoltre, è molto lontano dal rendere i contenuti veramente portatili.

Il formato SXG

Un SXG è incapsulato in un file codificato in binario che ha due componenti principali: uno scambio HTTP e una firma che copre lo scambio. Lo scambio HTTP è costituito da un URL richiesta, informazioni sulla negoziazione dei contenuti e una risposta HTTP.

Ecco un esempio di file SXG decodificato.

format version: 1b3
request:
  method: GET
  uri: https://example.org/
  headers:
response:
  status: 200
  headers:
    Cache-Control: max-age=604800
    Digest: mi-sha256-03=kcwVP6aOwYmA/j9JbUU0GbuiZdnjaBVB/1ag6miNUMY=
    Expires: Mon, 24 Aug 2020 16:08:24 GMT
    Content-Type: text/html; charset=UTF-8
    Content-Encoding: mi-sha256-03
    Date: Mon, 17 Aug 2020 16:08:24 GMT
    Vary: Accept-Encoding
signature:
    label;cert-sha256=<em>ViFgi0WfQ+NotPJf8PBo2T5dEuZ13NdZefPybXq/HhE=</em>;
    cert-url=&quot;https://test.web.app/ViFgi0WfQ-NotPJf8PBo2T5dEuZ13NdZefPybXq_HhE&quot;;
    date=1597680503;expires=1598285303;integrity=&quot;digest/mi-sha256-03&quot;;sig=<em>MEUCIQD5VqojZ1ujXXQaBt1CPKgJxuJTvFlIGLgkyNkC6d7LdAIgQUQ8lC4eaoxBjcVNKLrbS9kRMoCHKG67MweqNXy6wJg=</em>;
    validity-url=&quot;https://example.org/webpkg/validity&quot;
header integrity: sha256-Gl9bFHnNvHppKsv+bFEZwlYbbJ4vyf4MnaMMvTitTGQ=</p>

<p>The exchange has a valid signature.
payload [1256 bytes]:</p>
<pre class="prettyprint"><code>&lt;title&gt;SXG example&lt;/title&gt;
&lt;meta charset=&#34;utf-8&#34;&gt;
&lt;meta http-equiv=&#34;Content-type&#34; content=&#34;text/html; charset=utf-8&#34;&gt;
&lt;style type=&#34;text/css&#34;&gt;
body {
    background-color: #f0f0f2;
    margin: 0;
    padding: 0;
}
&lt;/style&gt;
</code></pre>
<div>
    <h1>Hello</h1>
</div>

<p>

Il parametro expires nella firma indica la data di scadenza di un SXG. Un SXG può essere valido per un massimo di 7 giorni. Ulteriori informazioni sull'intestazione della firma sono disponibili nella specifica per le piattaforme di scambio HTTP firmate.

Supporto per la personalizzazione lato server

Uno SXG contenente un'intestazione Vary: Cookie verrà mostrato solo agli utenti che non hanno cookie per l'URL della richiesta firmata. Se il tuo sito presenta HTML diverso per gli utenti che hanno eseguito l'accesso, puoi utilizzare questa funzionalità per sfruttare gli SXG senza alterare l'esperienza. Consulta i dettagli sulla personalizzazione lato server con SXG dinamici.

Pacchettizzazione web

SXG fa parte della più ampia famiglia di proposte di specifiche Web Packaging. Oltre agli SXG, l'altro componente principale delle specifiche di imballaggio web è costituito dai bundle web ("piattaforme di scambio pubblicitario HTTP raggruppate"). I bundle web sono una raccolta di risorse HTTP e dei metadati necessari per interpretare il bundle.

La relazione tra gli SXG e i pacchetti web è un punto di confusione comune. SXG e i pacchetti web sono due tecnologie distinte che non dipendono l'una dall'altra: i pacchetti web possono essere utilizzati sia con le piattaforme di scambio pubblicitario con firma che senza firma. Un obiettivo comune promosso sia dagli SXG che dai Web Bundle è la creazione di un formato di "pacchetto web" che consenta la condivisione completa dei siti per l'utilizzo offline.

Accelerare i caricamenti delle pagine con gli scambi firmati

L'attivazione degli scambi firmati può contribuire ad accelerare il rendimento delle pagine web e quindi influire sui Core Web Vitals del tuo sito, in particolare sulla visualizzazione elemento più grande (LCP). Tra gli early adopter, la Ricerca Google utilizza SXG per offrire agli utenti un'esperienza di caricamento delle pagine più rapida per le pagine caricate dalla pagina dei risultati di ricerca.

La Ricerca Google esegue la scansione e memorizza nella cache gli SXG, se disponibili, e precarica gli SXG che l'utente è probabile che visiti, ad esempio la pagina corrispondente al primo risultato di ricerca.

SXG funziona al meglio insieme ad altre ottimizzazioni delle prestazioni, come l'uso di CDN e la riduzione delle sottorisorse di blocco della visualizzazione. Dopo l'implementazione, segui questi consigli per massimizzare i vantaggi dell'LCP derivanti dal precaricamento degli SXG. In molti casi, questa ottimizzazione può comportare caricamenti di pagine quasi istantanei provenienti dalla Ricerca Google:

Impatto delle piattaforme di scambio pubblicitario con firma

Da esperimenti precedenti abbiamo osservato una riduzione media di 300-400 ms del LCP dai precaricamenti abilitati per SXG. In questo modo, i siti fanno una prima impressione migliore sugli utenti e spesso hanno un impatto positivo sulle metriche aziendali.

Diversi brand e siti globali hanno già usufruito di Signed Exchange. Come case study, vediamo come l'implementazione di Signed Exchange ha aiutato RebelMouse, un importante sistema di gestione dei contenuti (CMS), a migliorare il rendimento e le metriche aziendali dei clienti:

  • Narcity ha migliorato l'LCP del 41%
  • Paper Magazine ha registrato un aumento del 27% delle sessioni per utente
  • Il blog MLT ha ridotto il tempo di caricamento della pagina del 21%

Cloudflare ha rilevato che SXG ha migliorato il TTFB per il 98% dei siti testati e l'LCP per l'85% dei siti, con un miglioramento medio di oltre il 20% nei caricamenti di pagine idonei per SXG.

Indicizzazione

Le rappresentazioni SXG e non SXG di una pagina non vengono classificate o indicizzate in modo diverso dalla Ricerca Google. SXG è in definitiva un meccanismo di pubblicazione, non modifica i contenuti sottostanti.

AMP

I contenuti AMP possono essere pubblicati utilizzando SXG. SXG consente di precaricare e visualizzare i contenuti AMP utilizzando il proprio URL canonico, anziché l'URL AMP.AMP dispone di propri strumenti separati per la generazione di SXG.Scopri come pubblicare AMP utilizzando piattaforme di scambio firmate su amp.dev.

Debug di SXG con Chrome DevTools

Per visualizzare un SXG in prima persona, usa un browser Chromium, apri DevTools, apri il riquadro Rete e visita questa pagina di ricerca di esempio. Le piattaforme di scambio pubblicitario con firma possono essere identificate cercando signed-exchange nella colonna Tipo.

Screenshot che mostra una richiesta SXG nel riquadro &quot;Rete&quot; in DevTools
Riquadro Rete in DevTools

La scheda Anteprima fornisce ulteriori informazioni sui contenuti di un SXG.

Screenshot della scheda &quot;Anteprima&quot; per un file SXG
La scheda Anteprima in DevTools

Utensili

L'implementazione di SXG consiste nel generare l'SXG corrispondente a un determinato URL e nel fornire tale SXG ai richiedenti (di solito i crawler).

Certificati

Per generare un SXG, devi disporre di un certificato che possa firmare gli SXG, anche se alcuni strumenti li acquisiscono automaticamente. Questa pagina elenca le autorità di certificazione che possono emettere questo tipo di certificato. I certificati possono essere ottenuti automaticamente dall'autorità di certificazione di Google utilizzando qualsiasi client ACME. Web Packager Server ha un client ACME integrato e presto lo avrà anche sxg-rs.

Strumenti SXG specifici della piattaforma

Questi strumenti supportano stack tecnologici specifici. Se utilizzi già una piattaforma supportata da uno di questi strumenti, potrebbe essere più semplice configurarla rispetto a uno strumento per uso generico.

Strumenti SXG per uso generico

Server HTTP sxg-rs

sxg-rs http_server funge da proxy inverso per la pubblicazione di SXG. Per le richieste dei crawler SXG, http_server firmerà le risposte del backend e risponderà con uno SXG. Per le istruzioni di installazione, consulta il file README.

Server Web Packager

Il server Web Packager,webpkgserver, è un'alternativa a http_server di sxg-rs, scritto in Go. Per istruzioni sulla configurazione del server Web Packager, consulta l'articolo Come configurare gli scambi firmati utilizzando Web Packager.

Interfaccia a riga di comando Web Packager

La CLI Web Packager genera un file SXG corrispondente a un determinato URL.

webpackager \
    --private\_key=private.key \
    --cert\_url=https://example.com/certificate.cbor \
    --url=https://example.com

Una volta generato il file SXG, caricalo sul tuo server e pubblicalo con il tipo MIME application/signed-exchange;v=b3. Inoltre, dovrai pubblicare il certificato SXG come application/cert-chain+cbor.

Librerie SXG

Queste librerie potrebbero essere utilizzate per creare il tuo generatore di SXG:

  • sxg_rs è una libreria Rust per la generazione di SXG. È la libreria SXG più ricca di funzionalità ed è utilizzata come base per gli strumenti cloudflare_worker e fastly_compute.

  • libsxg è una libreria C minima per la generazione di SXG. Viene utilizzato come base per il modulo NGINX SXG e per il filtro Envoy SXG.

  • go/signed-exchange è una libreria Go minima fornita dalla specifica del pacchetto web come implementazione di riferimento per la generazione di SXG. Viene utilizzato come base per il suo strumento dell'interfaccia a riga di comando di riferimento gen-signedexchange e per gli strumenti Web Packager, più ricchi di funzionalità.

Negoziazione dei contenuti

I server devono pubblicare gli SXG quando l'intestazione Accept indica che il valore q per application/signed-exchange è maggiore o uguale al valore q per text/html. In pratica, ciò significa che un server di origine pubblicherà gli SXG per i crawler, ma non per i browser. Molti degli strumenti sopra indicati eseguono questa operazione per impostazione predefinita, ma per altri strumenti è possibile utilizzare la seguente espressione regolare per trovare una corrispondenza con l'intestazione Accept delle richieste da servire come SXG: http Accept: /(^|,)\s\*application\/signed-exchange\s\*;\s\*v=[[:alnum:]\_-]+\s\*(,|$)/

Questo suggerimento include esempi per Apache e nginx.

Aggiorna API cache

La cache SXG di Google ha un'API che i proprietari di siti possono utilizzare per rimuovere gli SXG dalla cache prima della scadenza a causa di Cache-Control: max-age. Per informazioni dettagliate, consulta il riferimento per l'API Update Cache.

Collegamento a SXG

Qualsiasi sito può memorizzare nella cache, pubblicare e precaricare gli SXG delle pagine a cui rimanda, se disponibili, utilizzando i tag e : html <a href="https://example.com/article.html.sxg"> <link rel="prefetch" as="document" href="https://example.com/article.html.sxg"> Questo articolo illustra come utilizzare nginx per distribuire gli SXG.

Vantaggi unici

SXG è una delle tante possibili tecnologie per abilitare il precaricamento cross-origin. Quando decidi quale tecnologia utilizzare, potresti dover fare un compromesso tra l'ottimizzazione di aspetti diversi. Le seguenti sezioni illustrano alcuni dei valori univoci che SXG fornisce nell'ambito delle possibili soluzioni. Questi fattori possono cambiare nel tempo man mano che lo spazio delle soluzioni disponibili si evolve.

Meno richieste da pubblicare

Con il precaricamento tra siti, il server potrebbe dover soddisfare richieste aggiuntive. Corrisponde ai casi in cui una pagina è stata prelevata, ma l'utente non l'ha visitata o i byte prelevati non sono stati mostrati all'utente. Per SXG, queste richieste aggiuntive inutilizzate possono essere ridotte in modo significativo:

  • Gli SXG vengono memorizzati nella cache e possono essere inviati agli utenti fino alla loro scadenza. Pertanto, molti precaricamenti possono essere gestiti esclusivamente dal server di cache.
  • Gli SXG possono essere mostrati agli utenti sia con che senza cookie sul tuo sito. Di conseguenza, la pagina dovrà essere recuperata di nuovo meno volte dopo la navigazione.

Miglioramento della velocità di caricamento delle pagine

Potresti notare un ulteriore miglioramento della velocità delle pagine grazie alle piattaforme e alle funzionalità di precaricamento attualmente supportate:

  • Gli scambi SXG possono essere mostrati agli utenti con cookie per il tuo sito.
  • Inoltre, SXG precarica le sottorisorse per le pagine, come JavaScript, CSS, caratteri e immagini, se specificate mediante un'intestazione Link.
  • Nel prossimo futuro, il precaricamento SXG dalla Ricerca Google sarà disponibile per più tipi di risultati di ricerca.

Conclusione

Gli scambi firmati sono un meccanismo di pubblicazione che consente di verificare l'origine e la validità di una risorsa indipendentemente dal modo in cui è stata pubblicata. Di conseguenza, gli SXG possono essere distribuiti da terze parti mantenendo al contempo l'attribuzione completa dell'editore.

Per approfondire