Intercambios firmados (SXG)

Una SXG es un mecanismo de entrega que permite autenticar la de un recurso independientemente de cómo se entregó.

Katie Hempenius
Katie Hempenius
X
Devin Mullins
Devin Mullins
X GitHub

Los intercambios firmados (SXG) son un mecanismo de entrega que permite autenticar el origen de un recurso independientemente de cómo se entregó. La implementación de SXG puede mejorar Largest Contentful Paint (LCP) mediante la habilitación de la carga previa de origen cruzado que preserva la privacidad. Además, esta separación presenta avances en diversos casos de uso, como las experiencias de Internet sin conexión y la publicación desde cachés de terceros.

En este artículo, se proporciona una descripción general completa de SXG: cómo funciona, sus casos de uso y sus herramientas.

Compatibilidad del navegador

SXG es compatible con los navegadores basados en Chromium. (a partir de las versiones Chrome 73, Edge 79 y Opera 64).

Descripción general

Como caso de uso principal, SXG usa un caché para cargar previamente y entregar contenido firmado de forma criptográfica por el origen. Esto ayuda a acelerar las navegaciones de origen cruzado desde los sitios de referencia y, al mismo tiempo, garantiza que las páginas permanezcan inalteradas y se atribuyan correctamente a su origen. Cualquier información que pueda identificarte se oculta hasta que el usuario navega a un sitio, lo que protege su privacidad. La Búsqueda de Google es un usuario pionero de las capacidades de carga previa de SXG y, en el caso de los sitios que reciben una gran parte de su tráfico de la Búsqueda de Google, SXG puede ser una herramienta importante para permitir que los usuarios carguen sus páginas más rápido. Con el tiempo, esperamos que este impacto se extienda a más referentes.

Cómo funciona

Un sitio firma un par de solicitud/respuesta (un “intercambio HTTP”) de manera que sea posible el navegador para verificar el origen y la integridad del contenido, independientemente de cómo se distribuyó el contenido. Como resultado, el navegador puede mostrar la URL de el sitio de origen en la barra de direcciones, en lugar de la URL del servidor que publicó el contenido.

Diagrama que explica cómo funcionan los intercambios firmados. El navegador se comunica con la caché que se comunica con el sitio de destino

Históricamente, la única forma de utilizar un tercero para distribuir su contenido y, al mismo tiempo, mantener la atribución ha sido que el sitio comparta sus certificados SSL con el distribuidor. Esto tiene desventajas de seguridad. Además, se encuentra muy lejos del lo que hace que el contenido sea realmente portátil.

El formato SXG

Un SXG se encapsula en un archivo de codificación binaria que tiene dos componentes principales: un intercambio HTTP y un firma que cubre el intercambio. El intercambio HTTP consiste en una solicitud URL, contenido información de negociación y una respuesta HTTP.

Este es un ejemplo de un archivo 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>

El parámetro expires en la firma indica la fecha de vencimiento de un SXG. R El SXG puede ser válido durante un máximo de 7 días. Obtén más información sobre el encabezado de la firma en los intercambios HTTP firmados spec.

Compatibilidad con la personalización del servidor

Un SXG que contenga un encabezado Vary: Cookie se mostrará solo a los usuarios que no lo hagan tienen cookies para la URL de la solicitud firmada. Si tu sitio presenta distintos tipos de HTML para los usuarios que accedieron a sus cuentas, puedes usar esta función para aprovechar los SXG sin alterar esa experiencia. Ver información detallada sobre la personalización del servidor con Dynamic SXG.

Web Packaging

SXG es parte de una iniciativa más amplia de Web Packaging en la familia de propuestas de especificaciones. Además, a SXG, el otro componente importante de la especificación de Web Packaging son los paquetes web. ("intercambios HTTP agrupados"). Los paquetes web son una colección de recursos HTTP y necesarios para interpretar el paquete.

La relación entre los paquetes web y SXG es un punto común de confusión. SXG y los paquetes web son dos tecnologías distintas que no dependen de cada una. Otros: Los paquetes web se pueden usar con intercambios firmados y sin firmar. Un problema común de los paquetes web y de SXG es la creación de un "paquete web" que permite compartir los sitios en su totalidad para consumirlos sin conexión.

Cómo acelerar la carga de páginas con intercambios firmados

Habilitar los intercambios firmados puede ayudar a acelerar el rendimiento de la página web y, por lo tanto, afectar las Métricas web esenciales de tu sitio, en particular Largest Contentful Paint (LCP). Como usuario pionero, la Búsqueda de Google utiliza SXG para proporcionarles a los usuarios una experiencia de carga más rápida en las páginas que se cargan desde la página de resultados de búsqueda.

La Búsqueda de Google rastrea y almacena en caché los SXG cuando están disponibles y carga previamente los SXG que es probable que el usuario visite (por ejemplo, la página correspondiente al primer resultado de la búsqueda).

SXG funciona mejor en conjunto con otras optimizaciones de rendimiento, como el uso de CDN y la reducción de subrecursos que bloquean la renderización. Después de la implementación, sigue estas recomendaciones para maximizar el beneficio de LCP de la carga previa de SXG. En muchos casos, esta optimización puede generar cargas de páginas casi instantáneas provenientes de la Búsqueda de Google:

Impacto de los intercambios firmados

En experimentos anteriores, observamos una reducción promedio de 300 ms a 400 ms en el LCP a partir de las cargas previas habilitadas para SXG. Esto ayuda a los sitios a dar una mejor primera impresión a los usuarios y, a menudo, tiene un impacto positivo en las métricas comerciales.

Varias marcas y sitios globales ya se beneficiaron de los intercambios firmados. Como caso de éxito, veamos cómo la implementación de intercambios firmados ayudó a RebelMouse, un sistema de administración de contenido (CMS) destacado a mejorar las capacidades y las métricas empresariales:

  • Narcity mejoró el LCP en un 41%
  • La revista Paper registró un aumento del 27% en las sesiones por usuario.
  • El blog de MLT disminuyó el tiempo de carga de la página en un 21%

Cloudflare descubrió que SXG mejoró el TTFB en el 98% de los sitios que probó y mejoró el LCP en el 85% de los sitios, con una mediana de mejora de más del 20% en las cargas de páginas aptas para SXG.

Indexación

Las representaciones de una página en SXG y no en SXG no se clasifican ni indexan de manera diferente en la Búsqueda de Google. En última instancia, SXG es un mecanismo de entrega, no cambiar el contenido subyacente.

AMP

El contenido de AMP puede publicarse mediante SXG. SXG permite la carga previa del contenido de AMP y se muestra con su URL canónica, en lugar de su URL de AMP.AMP tiene su propia URL separada herramientas para generar SXG.Aprende a publicar AMP con intercambios firmados en amp.dev.

Depuración de SXG con las Herramientas para desarrolladores de Chrome

Para ver un SXG por primera vez, utilice un navegador Chromium, abra Herramientas para desarrolladores, abra el panel Network y visite esta página de búsqueda de ejemplo. Los intercambios firmados se pueden identificar buscando signed-exchange en la columna Tipo.

Captura de pantalla que muestra una solicitud de SXG en la &quot;Red&quot; en Herramientas para desarrolladores
El panel Red de Herramientas para desarrolladores

La pestaña Vista previa proporciona más información sobre el contenido de un SXG.

Captura de pantalla de &quot;Preview&quot; para un SXG
La pestaña Vista previa en Herramientas para desarrolladores

Herramientas

La implementación de SXG consiste en generar el SXG correspondiente a una URL determinada y, luego, entrega el SXG a los solicitantes (por lo general, rastreadores).

Certificados

Para generar un SXG, necesitarás un certificado que pueda firmar SXG, aunque algunas herramientas los adquieren automáticamente. En esta página, se enumeran las autoridades certificadoras que pueden emitir este tipo de certificado. Los certificados se pueden obtener automáticamente de la autoridad certificadora de Google con cualquier cliente de ACME. Web Packager Server tiene un cliente de ACME integrado, y sxg-rs pronto tendrá uno.

Herramientas de SXG específicas de la plataforma

Estas herramientas admiten componentes tecnológicos específicos. Si ya usas un compatible con una de estas herramientas, puede resultarte más fácil de configurar que una herramienta de uso general.

Herramientas SXG de uso general

Servidor HTTP sxg-rs

Los sxg-rs http_server actúa como un proxy inverso de para entregar SXG. Para las solicitudes de los rastreadores de SXG, http_server firmará el del backend y responden con un SXG. Para la instalación consulta el README.

Servidor de empaquetador web

La herramienta Web Packager Servidor, webpkgserver es una alternativa al servidor http_server de sxg-rs, escrito en Go. Para para configurar el servidor de Web Packager, consulta Cómo configurar intercambios con Web Packager.

CLI de Web Packager

La CLI de Web Packager genera un archivo SXG. correspondiente a una URL determinada.

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

Una vez generado el archivo SXG, súbelo a tu servidor y publícalo con el tipo de MIME application/signed-exchange;v=b3 Además, deberás entregar el certificado SXG como application/cert-chain+cbor.

Bibliotecas de SXG

Estas bibliotecas se pueden usar para compilar tu propio generador SXG:

  • sxg_rs es una biblioteca de Rust para generar SXG. Es la biblioteca de SXG más destacada y se usa como para las herramientas cloudflare_worker y fastly_compute.

  • libsxg es una biblioteca C mínima para generar SXG. Se usa como base para el módulo NGINX SXG y la Filtro Envoy SXG.

  • go/signed-exchange es una biblioteca mínima de Go que proporciona la especificación webpackage como una referencia implementación de generar SXG. Se usa como base para su herramienta de CLI de referencia, gen-signedexchange y las herramientas más funcionales de Web Packager.

Negociación de contenido

Los servidores deben entregar SXG cuando el encabezado Accept indica que el valor q de application/signed-exchange es mayor o igual que el valor q de text/html. En la práctica, esto significa que un servidor de origen entregará SXG a los rastreadores, pero no a los navegadores. Muchas de las herramientas anteriores hacen esto de forma predeterminada, pero para otras herramientas, se puede usar la siguiente expresión regular para hacer coincidir el encabezado Accept de solicitudes que deben entregarse como SXG: http Accept: /(^|,)\s\*application\/signed-exchange\s\*;\s\*v=[[:alnum:]\_-]+\s\*(,|$)/

Esta recomendación incluye ejemplos para Apache y nginx.

API de Update Cache

La caché de SXG de Google tiene una API que los propietarios de sitios pueden usar para quitar SXG de la caché antes de que venzan debido a Cache-Control: max-age. Consulta la referencia de la API de actualización de caché para obtener más detalles.

Vincula con SXG

Cualquier sitio puede almacenar en caché, entregar y cargar previamente los SXG de las páginas a las que está vinculado, cuando estén disponibles, con las etiquetas y : html <a href="https://example.com/article.html.sxg"> <link rel="prefetch" as="document" href="https://example.com/article.html.sxg"> En este artículo, se ilustra cómo usar nginx para distribuir SXG.

Ventajas únicas

SXG es una de las muchas tecnologías posibles para habilitar la carga previa de origen cruzado. A la hora de decidir qué tecnología usar, es posible que debas sacrificar la optimización de distintos aspectos. En las siguientes secciones, se ilustran algunos de los valores únicos que proporciona SXG en el espacio de posibles soluciones. Estos factores pueden cambiar con el tiempo a medida que evoluciona el espacio de soluciones disponibles.

Menos solicitudes para publicar

Con la carga previa entre sitios, es posible que tu servidor deba entregar solicitudes adicionales. Esto corresponde a casos en los que una página se cargó previamente, pero el usuario no la visitó o no se pudieron mostrar los bytes cargados previamente. En el caso de SXG, estas solicitudes adicionales sin usar se pueden reducir de forma significativa:

  • Los SXG se almacenan en caché y se pueden enviar a los usuarios hasta que venzan. Por lo tanto, solo el servidor de caché puede manejar muchas cargas previas.
  • Las SXG se pueden mostrar a los usuarios con y sin cookies en tu sitio. Por lo tanto, habrá menos veces en las que sea necesario recuperar la página nuevamente después de la navegación.

Mejora en la velocidad de la página

Es posible que observes una mejora adicional en la velocidad de la página debido a las plataformas de carga previa y a las capacidades que admite actualmente:

  • Las SXG se pueden mostrar a los usuarios con cookies para tu sitio.
  • SXG también realiza una carga previa de los subrecursos para tus páginas, como JavaScript, CSS, imágenes y fuentes, cuando se especifica con un encabezado Link.
  • Próximamente, la carga previa de SXG desde la Búsqueda de Google estará disponible en más tipos de resultados de búsqueda.

Conclusión

Los intercambios firmados son un mecanismo de entrega que permite verificar la el origen y la validez de un recurso independientemente de cómo se haya entregado. Como resultado, los SXG se pueden distribuir por terceros, mientras que manteniendo la atribución completa del publicador.

Lecturas adicionales