style - title tag html5
Minificación HTML? (8)
Aquí hay una breve respuesta a su pregunta: debe minimizar su HTML, CSS, JS . Hay una herramienta fácil de usar que se llama grunt . Te permite automatizar muchas tareas. Entre ellos JS , CSS , minificación de HTML , concatenación de archivos y muchos otros .
Las respuestas escritas aquí son extremadamente obsoletas o incluso a veces no tienen sentido. Muchas cosas cambiaron desde el 2009 anterior, así que intentaré responder esto correctamente.
Respuesta corta: definitivamente debes minificar HTML . Es trivial hoy y da aproximadamente un 5% de aceleración . Para una respuesta más larga, lea la respuesta completa.
En el pasado, la gente estaba minimizando manualmente css / js (ejecutándolo a través de alguna herramienta específica para minimizarlo). Fue un poco difícil automatizar el proceso y definitivamente se requieren algunas habilidades. Sabiendo que muchos sitios de alto nivel, incluso en este momento, no están utilizando gzip (lo cual es trivial), es comprensible que las personas se muestren renuentes a la hora de minimizar html.
Entonces, ¿por qué la gente estaba minimizando js, pero no html ? Cuando minimizas JS, haces lo siguiente:
- eliminar comentarios
- eliminar espacios en blanco (tabulaciones, espacios, nuevas líneas)
- cambiar nombres largos a cortos (
var isUserLoggedIn
avar a
)
Lo que dio mucha mejora incluso en los viejos tiempos. Pero en html no pudiste cambiar los nombres largos para abreviar, tampoco hubo casi nada que comentar durante ese tiempo. Así que lo único que quedó fue eliminar espacios y nuevas líneas. Lo que da solo una pequeña cantidad de mejora.
Un argumento erróneo escrito aquí es que debido a que el contenido se sirve con gzip, la minificación no tiene sentido. Esto es totalmente incorrecto. Sí, tiene sentido que gzip disminuya la mejora de minificación, pero ¿por qué debería gzip comentarios, espacios en blanco si puede recortarlos adecuadamente y gzip solo una parte importante? Es lo mismo que si tuviera una carpeta para archivar que contenga alguna mierda que nunca usará y decide simplemente comprimirla en lugar de limpiarla y comprimirla.
Otro argumento por el que no tiene sentido hacer minificación es que es tedioso. Tal vez esto fue cierto en 2009, pero nuevas herramientas aparecieron después de este tiempo. En este momento no es necesario que minimice manualmente su marca. Con cosas como grunt es trivial instalar HTML (se basa en HTMLMinifier por @kangax) y configurarlo para minimizar su html. Todo lo que necesita es como 2 horas para aprender gruñido y configurar todo, y luego todo se hace automáticamente en menos de un segundo. Parece que 1 segundo (que incluso se puede automatizar para no hacer nada con grunt-contrib-watch ) no es realmente tan malo para aproximadamente el 5% de mejora (incluso con gzip).
Un argumento más es que CSS y JS son estáticos , y el servidor genera HTML, por lo que no puede minimizarlo previamente. Esto también fue cierto en 2009, pero en la actualidad more vez more sitios se ven como una aplicación de una sola página, donde el servidor es delgado y el cliente está haciendo todo el enrutamiento, las plantillas y otras lógicas. Así que el servidor solo le da JSON y el cliente lo procesa. Aquí tienes un montón de html para la página y diferentes plantillas.
Así que para terminar mis pensamientos:
- Google está reduciendo html.
- pageSpeed está pidiendo que minimice el html
- es trivial de hacer
- Da ~ 5% de mejora.
- no es lo mismo que gzip
¿Existe alguna herramienta en línea en la que podamos ingresar el código HTML de una página y que minimice el código?
Haría eso para los archivos aspx ya que no es una buena idea hacer que el servidor web los gzip ...
CodeProject tiene un proyecto de ejemplo publicado ( http://www.codeproject.com/KB/aspnet/AspNetOptimizer.aspx?fid=1528916&df=90&mpp=25&noise=3&sort=Position&view=Quick&select=2794900 ) para manejar algunas de las siguientes situaciones ... .
- Combinación de llamadas ScriptResource.axd en una sola llamada
- Comprima todos los scripts del lado del cliente en función de la capacidad del navegador, incluyendo gzip / deflate
- Un ScriptMinifier para eliminar comentarios, sangrías y saltos de línea.
- Un compresor HTML para comprimir todo el marcado html basado en la capacidad del navegador, incluyendo gzip / deflate.
- Y, lo más importante, un Minifier HTML para escribir html completos en una sola línea y minimizarlo en el nivel posible (en construcción).
Escribí una herramienta web para minificar HTML. http://prettydiff.com/?m=minify&html
Esta herramienta opera usando estas reglas:
style
se supone que es CSS y se minimiza como tal script
es JavaScript, a menos que se proporcione un tipo de medio diferente, y luego se minimice como tal - La minificación de CSS y JavaScript utiliza una forma fuertemente bifurcada de JSMin. Esta bifurcación se amplía para admitir CSS de forma nativa y también admite la sintaxis SCSS. La inserción automática de punto y coma es compatible con la minificación de JavaScript, sin embargo, todavía no se admite la inserción automática de llaves.
Esto funcionó para mí:
http://minify.googlecode.com/git/min/lib/Minify/HTML.php
No es una herramienta en línea ya disponible, pero al ser un PHP simple, es bastante fácil de ejecutar.
Sin embargo, no guardaría archivos comprimidos, haga esto de forma dinámica si realmente tiene que hacerlo, y siempre es una mejor idea habilitar la compresión del servidor Gzip. No sé cuán involucrado está en IIS / .Net, pero en PHP es tan trivial como agregar una línea al archivo de inclusión global
Para la plataforma Microsoft .NET hay una biblioteca llamada WebMarkupMin , que produce la minificación del código HTML.
Además, hay un módulo para integrar esta biblioteca en ASP.NET MVC - WebMarkupMin.Mvc .
Quizás intente HTML Compressor , aquí hay una tabla de antes y después que muestra lo que puede hacer (incluso para el Desbordamiento de pila en sí):
Cuenta con muchas selecciones para optimizar sus páginas hasta e incluyendo la minimización de secuencias de comandos (ompressor, Google Closure Compiler, su propio compresor) donde sería seguro. El conjunto de opciones predeterminado es bastante conservador, por lo que puede comenzar con eso y experimentar con opciones más agresivas.
El proyecto está extremadamente bien documentado y apoyado.
intente http://code.mini-tips.com/html-minifier.html , esto es .NET Libary para Html Minifier
HtmlCompressor es una biblioteca .NET pequeña, rápida y muy fácil de usar que minimiza una fuente HTML o XML determinada mediante la eliminación de espacios en blanco adicionales, comentarios y otros caracteres innecesarios sin romper la estructura del contenido. Como resultado, las páginas se reducen de tamaño y se cargan más rápido. También está disponible una versión de línea de comandos del compresor.
No hagas esto O más bien, si insiste en hacerlo, hágalo después de que se hayan completado las optimizaciones más importantes del sitio. Es muy probable que el costo / beneficio de este esfuerzo sea insignificante, especialmente si planea utilizar manualmente las herramientas en línea para tratar cada página.
Use YSlow o Page Speed para determinar lo que realmente necesita hacer para optimizar sus páginas. Mi conjetura es que la reducción de bytes de HTML no será el mayor problema de su sitio. Es mucho más probable que la compresión, la administración del caché, la optimización de la imagen, etc. hagan una gran diferencia en el rendimiento de su sitio en general. Esas herramientas le mostrarán cuáles son los problemas más grandes: si ha tratado con todos ellos y aún encuentra que la minificación de HTML hace una gran diferencia, hágalo.
(Si está seguro de que quiere hacerlo y usa Apache httpd, puede considerar usar mod_pagespeed y activar algunas de las opciones para reducir los espacios en blanco, etc., pero tenga en cuenta mod_pagespeed ).