Trocas assinadas (SXGs)

Uma SXG é um mecanismo de entrega que possibilita a autenticação da origem de um recurso, independentemente de como ele foi entregue.

Katie Hempenius
Katie Hempenius
X
Devin Mullins
Devin Mullins
X GitHub

As trocas assinadas (SXG) são um mecanismo de entrega que permite autenticar a origem de um recurso independentemente de como ele foi entregue. A implementação de SXG pode melhorar a Largest Contentful Paint (LCP) ao ativar a pré-busca de origem cruzada que preserva a privacidade. Além disso, essa separação promove vários casos de uso, como experiências de Internet off-line e veiculação de caches de terceiros.

Este artigo fornece uma visão geral abrangente das SXG: como elas funcionam, casos de uso e ferramentas.

Compatibilidade com navegadores

SXG é compatível com navegadores baseados no Chromium (a partir das versões: Chrome 73, Edge 79 e Opera 64).

Visão geral

Como o principal caso de uso, as SXGs utilizam um cache para pré-buscar e exibir conteúdo que foi assinado criptograficamente pela origem. Isso ajuda a acelerar as navegações de origem cruzada nos sites de referência, além de garantir que as páginas permaneçam inalteradas e atribuídas corretamente à origem. Todas as possíveis informações de identificação ficam ocultas até que o usuário navegue até um site, protegendo sua privacidade. A Pesquisa Google é uma das primeiras a adotar os recursos de pré-busca de SXG. Para sites que recebem uma grande parte do tráfego da Pesquisa Google, as SXG podem ser uma ferramenta importante para fornecer carregamentos de página mais rápidos aos usuários. Com o tempo, esperamos que esse impacto alcance mais indicadores.

Como funciona

Um site assina um par de solicitação/resposta (uma "troca HTTP") de modo a permitir navegador para verificar a origem e a integridade do conteúdo, independentemente como o conteúdo foi distribuído. Como resultado, o navegador pode exibir o URL de o site de origem na barra de endereço, em vez do URL do servidor que exibiu o conteúdo.

Diagrama explicando como as trocas assinadas funcionam. Navegador se comunicando com o cache que se comunica com o site de destino

Historicamente, a única maneira site use um terceiro para distribuir seu conteúdo, mantendo foi o site compartilhar seus certificados SSL com a do Google Cloud. Isso tem desvantagens na segurança. além disso, está muito distante de tornando o conteúdo verdadeiramente portátil.

O formato SXG

As SXGs são encapsuladas em um arquivo codificado em binário (link em inglês) que tem duas componentes principais: uma troca HTTP e um assinatura que abrange a troca. A troca HTTP consiste em um URL de solicitação, conteúdo de negociação e uma resposta HTTP.

Veja um exemplo de um arquivo SXG decodificado.

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>

O parâmetro expires na assinatura indica a data de validade de uma SXG. Um As SXGs podem ser válidas por no máximo sete dias. Encontre mais informações sobre cabeçalho da assinatura em Signed HTTP Exchanges spec.

Suporte para personalização do lado do servidor

As SXGs com um cabeçalho Vary: Cookie vão aparecer apenas para os usuários que não têm cookies para o URL da solicitação assinada. Caso seu site apresente HTMLs diferentes para os usuários conectados, use esse recurso para aproveitar as SXGs sem alterar essa experiência. Confira detalhes sobre a personalização do lado do servidor com Dynamic SXG.

Empacotamento da Web

As SXGs fazem parte do âmbito da Web Família de propostas de especificações de embalagem. Além disso, às SXGs, o outro componente importante da especificação de empacotamento da Web são os Web Bundles. ("trocas HTTP agrupadas"). Web Bundles são uma coleção de recursos HTTP e os metadados necessários para interpretar o pacote.

A relação entre SXGs e pacotes da Web é um ponto comum de confusão. SXG e Web Bundles são duas tecnologias distintas que não dependem umas other: os pacotes da Web podem ser usados com trocas assinadas e não assinadas. Um erro comum entre SXGs e pacotes da Web é a criação de um pacote da Web que permite que sites sejam compartilhados na íntegra para consumo off-line.

Como acelerar o carregamento de páginas com as trocas assinadas

Ativar as trocas assinadas pode ajudar a acelerar o desempenho da página da Web e, assim, afetar as Core Web Vitals do seu site em uma determinada Largest Contentful Paint (LCP). Como usuário inicial, a Pesquisa Google usa as SXG para fornecer aos usuários uma experiência de carregamento de página mais rápida para páginas carregadas a partir da página de resultados da pesquisa.

A Pesquisa Google rastreia e armazena em cache as SXGs quando disponíveis e faz a pré-busca das SXGs que o usuário provavelmente vai acessar. Por exemplo, a página correspondente ao primeiro resultado da pesquisa.

As SXGs funcionam melhor em conjunto com outras otimizações de desempenho, como o uso de CDNs e redução de sub-recursos bloqueadores de renderização. Após a implementação, siga estas recomendações para maximizar o benefício da LCP da pré-busca de SXGs. Em muitos casos, essa otimização pode resultar em carregamentos de página quase instantâneos provenientes da Pesquisa Google:

Impacto das trocas assinadas

Nos experimentos anteriores, observamos uma redução média de 300 ms a 400 ms na LCP de pré-buscas ativadas com SXG. Isso ajuda os sites a causar uma melhor primeira impressão nos usuários e geralmente tem um impacto positivo nas métricas de negócios.

Várias marcas e sites globais já se beneficiam das trocas assinadas. Como estudo de caso, vamos conferir como a implementação das trocas assinadas ajudou a RebelMouse, um importante sistema de gerenciamento de conteúdo (CMS), a melhorar desempenho e métricas de negócios:

  • A Narcity melhorou a LCP em 41%
  • A Paper Magazine notou um aumento de 27% nas sessões por usuário
  • O blog da MLT diminuiu o tempo de carregamento da página em 21%

A Cloudflare descobriu que a SXG melhorou o TTFB para 98% dos sites que testou e melhorou a LCP para 85% dos sites, com uma melhoria mediana de mais de 20% nos carregamentos de página qualificados para SXG.

Indexação

As representações SXG e não SXG de uma página não são classificadas nem indexadas de acordo com a Pesquisa Google. As SXGs são, em última instância, um mecanismo de entrega — elas não alterar o conteúdo subjacente.

AMP

O conteúdo AMP pode ser enviado usando SXG. As SXGs permitem a pré-busca do conteúdo AMP e exibidos usando o URL canônico dele em vez do URL da AMP.A tecnologia AMP tem ferramentas para gerar SXGs.Saiba como veicular AMP usando trocas assinadas em amp.dev.

Como depurar SXGs com o Chrome DevTools

Para conferir uma SXG em primeira mão, use um navegador Chromium, abra o DevTools, abra o painel "Rede" e acesse esta página de pesquisa de exemplo. Para identificar as trocas assinadas, procure signed-exchange na coluna Tipo.

Captura de tela mostrando uma solicitação de SXG em &quot;Network&quot; no DevTools
O painel Network no DevTools

A guia Visualização oferece mais informações sobre o conteúdo de uma SXG.

Captura de tela da &quot;Visualização&quot; guia para uma SXG
A guia Visualização no DevTools

Ferramentas

A implementação de SXGs consiste em gerar as SXGs correspondentes a um determinado URL e, em seguida, veicular essas SXG aos solicitantes (geralmente rastreadores).

Certificados

Para gerar uma SXG, você precisará de um certificado que possa assinar SXGs, embora algumas ferramentas as adquiram automaticamente. Esta página lista as autoridades de certificação que podem emitir esse tipo de certificado. Os certificados podem ser recebidos automaticamente da autoridade certificadora do Google usando qualquer cliente ACME. O Web Packager Server tem um cliente ACME integrado e o sxg-rs terá em breve.

Ferramentas de SXG específicas da plataforma

Essas ferramentas oferecem suporte a pilhas de tecnologia específicas. Se você já usa um compatível com uma dessas ferramentas, pode ser mais fácil configurar do que uma ferramenta de uso geral.

Ferramentas de SXG de uso geral

Servidor HTTP sxg-rs

O sxg-rs http_server atua como um proxy reverso para SXGs. Para solicitações de rastreadores de SXG, http_server assinará o respostas do back-end e responder com SXG. Para instalação instruções, consulte o LEIA-ME.

Servidor de empacotador da Web

O empacotador da Web Servidor, webpkgserver é uma alternativa ao http_server sxg-rs, escrito em Go. Para instruções sobre como configurar o servidor do Web Packager, consulte Como configurar o servidor para trocas usando o Web Packager.

CLI do Web Packager

A CLI do Web Packager gera uma SXG. correspondentes a um determinado URL.

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

Assim que o arquivo SXG tiver sido gerado, envie-o para seu servidor e veicule-o com o tipo MIME application/signed-exchange;v=b3. Além disso, você precisará exibir o certificado de SXG como application/cert-chain+cbor.

Bibliotecas SXG

Essas bibliotecas podem ser usadas para criar seu próprio gerador de SXG:

  • O sxg_rs é uma biblioteca do Rust para para gerar SXGs. É a biblioteca SXG mais completa e é usada como base para as ferramentas cloudflare_worker e fastly_compute.

  • libsxg é uma biblioteca C mínima para para gerar SXGs. Ele é usado como base para o módulo SXG do NGINX e para o Filtro SXG do Envoy.

  • go/signed-exchange é uma biblioteca Go mínima fornecida pela especificação webpackage como uma referência implementação de para gerar SXGs. Ele é usado como a base para a ferramenta CLI de referência, gen-signedexchange e as ferramentas mais completas do Web Packager.

Negociação de conteúdo

Os servidores devem veicular SXG quando o cabeçalho Accept indicar que o valor q para aplicativo/troca assinada é maior ou igual ao valor q para texto/html. Na prática, isso significa que um servidor de origem exibirá SXG para os rastreadores, mas não para os navegadores. Muitas das ferramentas acima fazem isso por padrão, mas, para outras, a seguinte expressão regular pode ser usada para corresponder ao cabeçalho Accept de solicitações que precisam ser veiculadas como SXG: http Accept: /(^|,)\s\*application\/signed-exchange\s\*;\s\*v=[[:alnum:]\_-]+\s\*(,|$)/

Esta recomendação inclui exemplos para Apache e nginx.

API Update cache

O cache de SXG do Google tem uma API que os proprietários de sites podem usar para remover SXGs do cache antes que expirem devido a Cache-Control: max-age. Consulte a referência da API Update Cache para ver detalhes.

Vinculando às SXG

Qualquer site pode armazenar em cache, exibir e pré-buscar SXGs das páginas vinculadas a ele, quando disponíveis, usando as tags e : html <a href="https://example.com/article.html.sxg"> <link rel="prefetch" as="document" href="https://example.com/article.html.sxg"> Este artigo ilustra como usar o nginx para distribuir SXGs.

Vantagens exclusivas

SXG é uma das muitas tecnologias possíveis para permitir a pré-busca de origem cruzada. Ao decidir qual tecnologia usar, talvez você precise escolher entre otimizar diferentes aspectos. As seções a seguir ilustram alguns dos valores exclusivos que as SXG oferecem no espaço de possíveis soluções. Esses fatores podem mudar com o tempo, à medida que o espaço de soluções disponíveis evolui.

Menos solicitações para veicular

Com a pré-busca entre sites, seu servidor pode precisar atender a solicitações adicionais. Isso corresponde a casos em que uma página foi pré-buscada, mas o usuário não a visitou ou os bytes pré-buscados não foram exibidos para o usuário. Para SXG, essas solicitações adicionais não usadas podem ser significativamente reduzidas:

  • As SXGs são armazenadas em cache e podem ser enviadas aos usuários até que expirem. Portanto, muitas pré-buscas podem ser processadas exclusivamente pelo servidor de cache.
  • As SXGs podem ser mostradas aos usuários com e sem cookies no seu site. Assim, há menos vezes em que a página precisará ser buscada novamente após a navegação.

Melhoria da velocidade da página

Talvez você note uma melhoria adicional na velocidade da página devido às plataformas e recursos de pré-busca com suporte atualmente:

  • As SXGs podem ser mostradas aos usuários com cookies para seu site.
  • A SXG também faz a pré-busca de sub-recursos para suas páginas, como JavaScript, CSS, fontes e imagens, quando especificadas usando um cabeçalho Link.
  • Em breve, a pré-busca de SXG na Pesquisa Google vai estar disponível em mais tipos de resultados da pesquisa.

Conclusão

As trocas assinadas são um mecanismo de entrega que permite verificar origem e validade de um recurso, independentemente de como ele foi entregues. Como resultado, as SXGs podem ser distribuídas por terceiros enquanto e manter a plena atribuição do editor.

Leitura adicional