Optimización de la reducción de CDN y latency

1) Objetivos y tarjeta de retraso

Latency = DNS + TCP/TLS + TTFB (servidor/origin/caché) + entrega de contenido (RTT × volúmenes) + renderizado del cliente.
Optimización = Reduzca la cantidad de RTT, reduzca los bytes y lleve los cálculos/caché más cerca del usuario.

2) Arquitectura CDN

Anycast POPs es un nodo cercano de enrutamiento BGP.
Tiered caching/Origin Shield es una capa intermedia «paraguas» que reduce la tormenta de miss en la origina.
Geo-/Ruta Regional - enlace tenant/jurisdicción (soberanía de datos, licencias).
Failover es un origin/región de respaldo, muestras de salud y un interruptor rápido.

3) Caché: claves, encabezados, estrategias

3. 1 Claves de caché (cache key)

Por defecto: 'scheme + host + path +? query'.
Agregue sólo los parámetros que desee ('? v =', '? lang =', '? tenant ='). El resto están en ignore-params.
'Vary' es mínimo: 'Accept-Encoding', 'Accept-Language' (si la verdad es necesaria), 'Authorization' suele romper la caché.

3. 2 Políticas

Estática pública: 'Cache-Control: public, max-age = 31536000, immutable' + rev (hash en el nombre).
Semidinámica (directorios, reglas, FAQ): 's-maxage = 300, stale-while-revalidate = 600, stale-if-error = 86400'.
API-GET: use ETag/Last-Modified, 'SWR/SIE', active el coalescing (una solicitud de tecla de acceso rápido).
Privado: respuestas personales - en el perímetro a través de edge-compute (ESI/kv) o caché de per-tenant.

3. 3 Anti-tormenta

Request coalescing - capturar consultas de miss simultáneas.
Serve-stale: permite dar un objeto obsoleto cuando un origin falla.
Revalidación de fondo: actualice en el fondo.

4) HTTP/2-3, TCP/TLS y retorno temprano

HTTP/2: multiplex, compresión de encabezados; limite 'max concurrent streams', grandes titulares.
HTTP/3 (QUIC): reducción importante de TTFB en pérdidas móviles/altas; siga los umbrales Inicial y Retry.
TLS 1. 3: 1-RTT handshake; OCSP stapling; HSTS.
0-RTT: solo para los 'GET' idempotentes y si se tienen en cuenta los riesgos de replay.
103 Early Hints: los primeros 'Link: rel = preload' para recursos críticos.
Preconnect / DNS-prefetch: `<link rel="preconnect" href="https://cdn. example">`.

5) Edge-compute y «personalización sutil»

En el borde: censo de encabezados, fijación geo/tenant, etiquetado A/B, fácil personalización sin solicitud de origin.
Regla: no almacenar PII en nodos POP; sólo almacenar en caché los datos agregados/públicos.

6) Optimización de medios y formatos

Imágenes: conversión automática a WebP/AVIF, resize-on-edge, 'srcset/sizes', 'lazyload'.
Compresión: Brotli para textos (HTML/CSS/JS/JSON), gzip fallback.
Vídeo: HLS/DASH, CDN-segment caching, 'preload = metadata', póster.
Fuentes: subset + 'font-display: swap'; hosting con caché larga.
CSS crítico: primera pantalla en línea; el resto es async.

7) Patrones API y almacenamiento en caché

Idempotent GET: almacena en caché las claves de la consulta (incluida la versión de datos).
ETag: fuerte hash de carga útil + 'If-None-Match'.
Surrogate-Control (especificidad CDN) para diferenciarse de 'Cache-Control' del cliente.
URLs señalizadas - para estática privada/medios de comunicación.
GraphQL: normalice la clave de caché por operación/variable; utilice caching parcial/caché de solventes.
WebSockets: para el tiempo real - acortar los mensajes, comprimir (permessage-deflate), colocar las bolas WS más cerca del usuario.

8) Ejemplos de configuraciones

8. 1 NGINX (origin: caché API-GET)

nginx
We give SWR and ETag location/api/v1/catalog/{
proxy_cache api_cache;
proxy_cache_key "$scheme$request_method$host$uri$is_args$args";
proxy_cache_valid 200 5m;
proxy_cache_use_stale updating error timeout http_500 http_502 http_503 http_504;
add_header Cache-Control "public, s-maxage=300, stale-while-revalidate=600, stale-if-error=86400";
add_header ETag $upstream_http_etag;
proxy_ignore_headers Set-Cookie; # do not break the Set-Cookie proxy_hide_header cache;
proxy_pass http://catalog;
}

8. 2 Fastly VCL (SWR, coalescing, ignore cookies)

vcl sub vcl_recv {
set req. hash_ignore_busy = true;   # coalescing if (req. url. qs ~ "^(?!.(lang    v)=)") { remove req. url. qs; }
if (req. http. Cookie) { remove req. http. Cookie; }
}

sub vcl_backend_response {
set beresp. ttl = 300s;
set beresp. stale_if_error = 86400s;
set beresp. stale_while_revalidate = 600s;
if (beresp. http. Set-Cookie) { unset beresp. http. Set-Cookie; }
}

8. 3 Cloudflare (Transform Rules, Cache Rules, Early Hints — псевдо)

json
{
"cache_rule": {
"if": "http. request. uri. path matches \"/assets/.\"",
"action": {"cache": {"eligibility":"eligible", "ttl": 31536000}}
},
"transform_rule": {
"set_headers": [{"name":"Cache-Control","value":"public, s-maxage=300, stale-while-revalidate=600"}]
},
"early_hints": {"enable": true}
}

9) Redes móviles e Internet «insostenible»

Use HTTP/3 de forma agresiva; reduzca el tamaño de la ruta crítica (HTML + critical CSS <14 KB).
Priority H2/H3: priorizar (HTML→CSS→JS→media más adelante).
Política retray con jitter, idempotency para API.
Size-budgets y bandling: código splitting, JS deferred, eliminación de CSS/JS no utilizado.

10) Observabilidad y SLO

RUM: TTFB, LCP, INP, CLS por región/ASN/tenantes; distribuciones p95/p99.
Sintética: ruta de control "/health/cdn' por POP-am.
Métricas de caché: hit-ratio overall y per-key; origin fetch rate; coalescing savings.
Alertas: caída de hit-ratio, crecimiento de origin-egress, degradación de H3-share, 5xx por shield.

11) Especificidad de iGaming/finanzas

Catálogos de juegos/coeficientes: short 's-maxage' + SWR; region-aware ключ (`tenant|region|lang`).
Picos de eventos (partidos, sorteos): calentar el caché (pre-warm), «congelar» las personalizaciones pesadas, fuentes mirror.
Pago/gabinete: no caché privado, pero acelerar a través de H3 + edge-TLS y la región cercana.
Jurisdicciones: dominios separados/rutas por región; control 'Vary: X-Region'.

12) Antipatternas

'Vary:' en todas las seguidas; la clave caché depende de las cookies/encabezados adicionales.
La ausencia de SWR/SIE → «pantallas negras» en fallos cortos de la origina.
Borra la caché «en todo» en lugar de la discapacidad puntual por etiquetas/llaves.
Recursos sin revisión de nombres y con 'max-age = 0'.
Global deny-cache para 'Authorization' incluso donde se da al público.
La ausencia de coalescing → una tormenta en la origina.
Personalización «pesada» prematura en POP.

13) Lista de comprobación prod

• Anycast POP + tiered/shield; chequeos de salud y failover de origen.
• Las claves de caché son mínimas; ignorar las query/cookies superfluas; 'Surrogate-Control'.
• SWR/SIE habilitado, coalescing activo; serve-stale en caso de errores.
• HTTP/3 habilitado; TLS 1. 3; 103 Early Hints está configurado para recursos críticos.
• Imágenes: AVIF/WebP, resize-on-edge; Brotli para textos.
• API-GET с ETag/Last-Modified; idempotencia/retraídas; no almacenar en caché perfiles privados.
• Preconnect a dominios estáticos; CSS crítico en línea.
• Métricas: hit-ratio, origin-egress, TTFB/LCP p95, H3-share, por regiones/tenantes.
• Plan de calentamiento de caché antes de eventos; Discapacidad puntual (etiquetas).
• Documentación Vary/keys/TTL; un playbook de incidentes (caída de hit-ratio).

14) TL; DR

Reduzca al mínimo las caminatas al origin: tiered/shield + cache-keys + SWR/SIE + coalescing correctos. Habilite el HTTP/3/TLS 1. 3, utilice 103 Early Hints y preconnect. Comprimir y convertir medios en el borde, inline CSS crítico. Para la API - ETag, pulcro 'Vary', idempotencia y caché razonable 'GET'. Mide hit-ratio, TTFB/LCP p95, origin egress y calienta la caché en picos de antemano.