Prueba de minificación CSS y JS
Respuesta breve
Comprueba si CSS, JavaScript y HTML están correctamente minificados.
Qué hace
Analiza los bloques `<style>` inline, los bloques `<script>` inline y el marcado HTML sin procesar de la página en busca de espacios en blanco y comentarios adicionales, y estima cuánto más pequeño sería cada uno si se minificara. Devuelve un ahorro de bytes estimado para HTML, CSS y JS por separado.
Por qué importa
El código sin minificar es más grande de lo necesario: el navegador descarga las mismas instrucciones más los espacios y los comentarios. Los bloques `<style>` y `<script>` inline que añade un CMS o un creador de páginas son fáciles de pasar por alto porque nunca pasan por un proceso de compilación. Un CSS bloqueante más pequeño puede ayudar a que la página empiece a renderizarse antes.
Cómo funciona
-
Introduce la URL de una página o pega su HTML
-
Analizamos los bloques `<style>` y `<script>` inline de la página
-
Analizamos la densidad de espacios en blanco y comentarios a nivel de byte en cada bloque
-
Devolvemos el estado de aprobado/no aprobado para HTML, CSS y JS con un ahorro estimado en KB
Ejemplo de entrada y salida
url: https://rankproof.eu
HTML: minificado reducción del 98% OK CSS: minificado reducción del 94% OK JS: minificado reducción del 91% OK tamaño total: 42.1 KB → 6.8 KB (84% menos) OK etiquetas <link>/<script> externas: 4 — comentarios eliminados: sí OK
Quién lo usa
-
Ingeniero/a de rendimiento
Antes de un gran día de ventas, comprueba el código inline de las páginas clave; cada kilobyte cuenta en conexiones móviles lentas.
-
Desarrollador/a frontend
Confirma que cualquier `<style>` o `<script>` inline que inyecte tu creador de páginas está realmente minificado; detecta el día en que una exportación del CMS empieza a enviar bloques sin minificar.
-
Ingeniero/a de DevOps
Vuelve a comprobar la página después de cada despliegue; detecta el día en que una actualización del CMS vuelve a enviar bloques inline sin minificar.
Preguntas frecuentes
¿Cuál es una reducción de tamaño típica?
Depende de cómo se escribió el código. La minificación elimina espacios en blanco y comentarios; la compresión con gzip o Brotli, que suele gestionar tu servidor web, ahorra más por encima de eso. Minifica primero y deja que el servidor comprima.
¿Afecta la minificación al SEO?
Indirectamente. Los archivos más pequeños pueden hacer que la página se renderice antes, lo que ayuda a las Core Web Vitals. Las Core Web Vitals son una de las muchas señales que usa Google, no una mejora garantizada del posicionamiento.
¿Qué pasa con los mapas de origen (source maps)?
Los navegadores solo descargan los mapas de origen cuando alguien abre las herramientas de desarrollador, así que no ralentizan la página. Publicarlos hace que cualquiera pueda leer tu código fuente original, así que decide si eso es aceptable.
¿Qué pasa con los scripts de terceros que no controlo?
No puedes minificarlos, pero puedes alojar tú mismo la última versión minificada, usar `defer` o eliminar los terceros que no sean esenciales.
¿Debería minificar también el HTML?
Ayuda un poco. El HTML se comprime bien, así que el ahorro tras la compresión suele ser pequeño, pero no cuesta nada si tu CMS o proceso de compilación lo admite.