CDN:Optimización de rendimiento

Alibaba Cloud CDN ofrece un conjunto de funciones de optimización de rendimiento que reducen los tiempos de carga de la página y el uso del ancho de banda, sin necesidad de modificar su servidor de origen.

CDN proporciona funciones de optimización que disminuyen los tiempos de carga de la página y el consumo de ancho de banda en dos niveles:

• Compresión: Reduce el tamaño de archivos de texto e imágenes durante su transferencia entre los nodos perimetrales y los navegadores.

• Optimización de páginas: Elimina código redundante de HTML, CSS y JavaScript antes de entregar los archivos a los navegadores.

Utilice estas funciones de forma independiente o combinada, según su tipo de contenido y sus objetivos de rendimiento.

Funcionamiento de la compresión

Cuando un navegador solicita un recurso, envía un encabezado de solicitud HTTP Accept-Encoding que lista los algoritmos de compresión compatibles (por ejemplo, br, gzip). CDN lee este encabezado y entrega la versión más pequeña del archivo que el navegador pueda descomprimir.

El flujo de la solicitud funciona de la siguiente manera:

1. El navegador envía una solicitud al nodo perimetral de CDN con Accept-Encoding: br, gzip.

2. El nodo perimetral comprueba si ya existe una versión comprimida del archivo en la caché.

3. Si no la encuentra, el nodo perimetral obtiene el archivo de su servidor de origen.

4. El nodo perimetral comprime el archivo y almacena el resultado en la caché.

5. El nodo perimetral devuelve el archivo comprimido al navegador.

Funciones de compresión

Alibaba Cloud CDN admite las siguientes funciones de compresión.

Compresión inteligente

La compresión inteligente comprime archivos mediante Gzip o Brotli antes de entregarlos a los navegadores. CDN selecciona el algoritmo según el encabezado Accept-Encoding que envía el navegador.

Condiciones de compresión:

• Tamaño del archivo: de 1 KB a 10 MB

• Tipos de archivo compatibles: archivos de texto como HTML, CSS, JavaScript, XML y JSON

Casos en los que CDN no aplica compresión:

• El navegador no incluye un encabezado Accept-Encoding, o bien el encabezado no lista gzip ni br.

• El archivo ya está comprimido (por ejemplo, archivos JPEG, PNG, MP4 o ZIP). Comprimir archivos que ya están comprimidos aumenta su tamaño.

• El archivo tiene un tamaño menor a 1 KB o mayor a 10 MB.

Brotli frente a Gzip:

Cuando el navegador admite ambos formatos, CDN prefiere Brotli para obtener mejores tasas de compresión.

Compresión automática

La compresión automática reduce el tamaño de los archivos de imagen al eliminar metadatos y ajustar la configuración de calidad, sin modificar el formato ni las dimensiones. Esta función se aplica a las imágenes almacenadas en su servidor de origen y opera de forma independiente a la compresión inteligente, diseñada para archivos de texto.

Funciones de optimización de páginas

La optimización de páginas elimina caracteres redundantes —como espacios en blanco, comentarios y formato innecesario— de los archivos de origen. Los archivos más pequeños cargan más rápido y reducen la cantidad de datos transferidos a los navegadores.

Alibaba Cloud CDN admite la optimización para tres tipos de archivo:

Optimización de HTML

La optimización de HTML elimina comentarios, espacios en blanco redundantes y líneas vacías de los archivos HTML antes de que lleguen al navegador. Esto reduce el tamaño del archivo sin alterar la forma en que se renderiza o comporta la página.

Habilitar la optimización de HTML mejora las siguientes métricas de rendimiento en páginas con grandes volúmenes de HTML:

• Time to First Byte (TTFB): Los archivos más pequeños se transfieren más rápido.

• First Contentful Paint (FCP): El navegador puede analizar y renderizar el contenido antes.

• Largest Contentful Paint (LCP): La reducción del tamaño de HTML acorta el proceso general de renderizado.

Optimización de CSS

La optimización de CSS elimina comentarios, espacios en blanco y caracteres innecesarios de los archivos CSS. El archivo resultante es funcionalmente idéntico al original, pero de menor tamaño.

Optimización de JavaScript

La optimización de JavaScript elimina comentarios y espacios en blanco de los archivos JavaScript. Esto reduce la cantidad de JavaScript que el navegador debe descargar y analizar antes de que la página sea interactiva.

Precarga de URL

La precarga de URL le permite enviar contenido a los nodos perimetrales de CDN antes de que los usuarios lo soliciten. En lugar de esperar a que el primer usuario active una solicitud al origen, envíe una lista de URL para que CDN obtenga y almacene proactivamente esos recursos en la caché.

Utilice la precarga de URL cuando:

• Publique contenido nuevo (artículos, páginas de productos, archivos multimedia) y desee que esté disponible de inmediato en los nodos perimetrales.

• Anticipe un pico de tráfico y quiera preparar la caché con antelación.

• Acabe de purgar contenido de la caché y desee repoblar los nodos perimetrales sin esperar al tráfico de usuarios.

Funcionamiento de la precarga de URL:

1. Envíe una lista de URL a través de la consola de CDN o la API.

2. CDN obtiene cada URL de su servidor de origen.

3. CDN almacena el contenido obtenido en los nodos perimetrales.

4. Las solicitudes posteriores de los usuarios se atienden desde la caché perimetral, sin necesidad de consultar al origen.

Condiciones para la precarga de URL:

• El recurso en cada URL debe ser accesible públicamente desde el nodo perimetral de CDN.

• La URL debe pertenecer a un nombre de dominio acelerado configurado en Alibaba Cloud CDN.

• Las cuotas de precarga se aplican por cuenta. Consulte la consola de CDN para verificar su cuota actual y su uso.

Selección de las funciones adecuadas

Habilite las funciones individualmente y supervise el impacto en su tasa de aciertos de caché y en las métricas de ancho de banda antes de habilitar funciones adicionales.

Notas de uso

• No habilite la compresión inteligente si su servidor de origen ya comprime las respuestas. Si el servidor de origen devuelve un archivo codificado con Gzip y CDN intenta comprimirlo nuevamente, el archivo resultante podría dañarse o ser más grande que el original.

• Pruebe primero la optimización de páginas en un entorno de pruebas. La minificación solo elimina espacios en blanco y comentarios, pero algunos archivos antiguos de JavaScript contienen sintaxis que falla al quitar los espacios en blanco (por ejemplo, sentencias sin punto y coma que dependen de la inserción automática de punto y coma).

• La compresión inteligente y la compresión automática son funciones independientes. Habilitar una no activa la otra. Los archivos de texto pasan por la compresión inteligente; las imágenes, por la compresión automática.

• La precarga de URL consume ancho de banda del origen. Cada solicitud de precarga activa una obtención desde el origen. Programe la precarga de grandes volúmenes de contenido fuera de las horas pico para evitar sobrecargar su servidor de origen.