English
Español
Desarrollo Web6 min lectura
WPO y Seguridad: velocidad y defensa no son opuestos.
Por qué la velocidad es también seguridad
Un sitio web lento no solo frustra a los usuarios: también es más vulnerable. Las bibliotecas JavaScript desactualizadas acumuladas en busca de "funcionalidad" crean una superficie de ataque mayor. La falta de HTTPS/2 por compatibilidad con IE11 expone a ataques MITM. Y los recursos de terceros sin control son vectores de ataques de supply chain.
Optimizar el rendimiento web — eliminando dependencias innecesarias, aplicando Content Security Policy (CSP) y gestionando correctamente la caché — tiene el doble efecto de mejorar la experiencia de usuario Y reducir la superficie de ataque.
Core Web Vitals: las métricas que Google mide
LCP
Largest Contentful Paint
Mide cuándo el elemento visual más grande de la página es visible. Objetivo: < 2.5 segundos. Mejora: imágenes WebP, preload de fuentes, CDN.
INP
Interaction to Next Paint
Sustituyó a FID en 2024. Mide la latencia de toda interacción del usuario, no solo la primera. Objetivo: < 200ms. Mejora: reducir JS bloqueante.
CLS
Cumulative Layout Shift
Mide la estabilidad visual — cuánto se mueven los elementos al cargar. Objetivo: < 0.1. Causa común: imágenes sin dimensiones definidas o ads que empujan contenido.
TTFB
Time to First Byte
Tiempo del servidor en responder. Objetivo: < 800ms. Mejora: caché de servidor (Redis/Varnish), optimización de consultas DB, CDN edge.
Configuración .htaccess: caché, compresión y
cabeceras de seguridad
Esta configuración combina optimización de rendimiento con hardening de seguridad. Ambos objetivos no solo son compatibles, se refuerzan mutuamente.
# .htaccess — Cache + Compresión + SeguridadAddOutputFilterByType DEFLATE text/html text/css AddOutputFilterByType DEFLATE application/javascript application/json AddOutputFilterByType DEFLATE image/svg+xml font/woff2 # Assets inmutables (con hash en filename) Header set Cache-Control "public, max-age=31536000, immutable" # HTML sin cacheHeader set Cache-Control "no-cache, must-revalidate" # Seguridad Header always set X-Content-Type-Options "nosniff" Header always set Referrer-Policy "strict-origin-when-cross-origin" Header always set Permissions-Policy "camera=(), microphone=(), geolocation=()"
"Un sitio web rápido no es solo una ventaja competitiva. Es una señal de que el equipo de desarrollo sabe lo que hace."
Zenith — Primitive Labs
Hoja de ruta WPO
- 01
Auditoría inicial — PageSpeed Insights + WebPageTest + GTmetrix. Identificar los Quick Wins con mayor impacto.
- 02
Imágenes y fuentes — Convertir a WebP/AVIF. Lazy loading. Subsetting de fuentes. Preload de recursos críticos.
- 03
JavaScript — Code splitting, tree shaking, defer/async. Eliminar polyfills para navegadores modernos.
- 04
Servidor y red — HTTP/2 o HTTP/3, CDN, edge caching, Brotli compression, HSTS preload.
- 05
Monitorización continua — Real User Monitoring (RUM) con alertas de regresión de rendimiento en cada deploy.
Etiquetas :
