Vi un artículo que escribió el año pasado sobre Perfection Kills. Era muy detallado sobre la optimización de HTML. Lo registraré por ahora, aunque algunas de las cosas que contiene no se pueden aplicar en el entorno actual. Bajo la tendencia actual de que las aplicaciones WEB se conviertan gradualmente en front-end, la optimización del lado del cliente ha atraído cada vez más atención. Cómo reducir el código, cómo mostrar rápidamente las aplicaciones a los usuarios, cómo reducir el tiempo de espera de los usuarios, etc., como Yahoo . 34 reglas de oro de la optimización Se propone un plan de optimización detallado.
La parte más básica de la optimización de una página web debe ser la optimización de HTML. Específicamente, la primera es la limpieza del marcado, que no solo puede reducir el tamaño del documento, sino que también hace que el documento sea más fácil de mantener y mejora la visibilidad de los motores de búsqueda. marcado significa mejor accesibilidad), mantenimiento más fácil y buena visibilidad en los motores de búsqueda), pero incluso para aquellas páginas web que se dice que están altamente optimizadas, si observa detenidamente el código, aún puede encontrar muchos usos de etiquetas que se pueden eliminar o están desactualizados:
1.Comentar personajes en el guión.
A menos que un navegador casi extinto como 95 Netscape 1.0 requiera dicho procesamiento, en la mayoría de los navegadores convencionales, agregar comentarios HTML a los bloques de script es completamente innecesario.
2.
// ...
//]]>
Esta es otra medida de prevención de errores que a menudo se agrega en los bloques de código js. Es para evitar que el código analice un símbolo < como comienzo de una etiqueta cuando se trata de documentos XHTML reales (tipo de contenido "aplicación/xhtml+xml"). Todo el contenido de CDATA será tratado como texto. Pero la situación real es que el tipo de contenido de casi todas las páginas web en la actualidad es texto/html, lo que significa que no son documentos xml en sentido estricto, sino solo texto, por lo que esta medida de prevención de errores es completamente innecesaria. Si está seguro de admitir documentos xml, debe utilizar CDATA de forma adecuada según la situación.
3.onclick=”…”, onmouseover=””y así sucesivamente.
Es una práctica muy imprudente escribir atributos de eventos en etiquetas HTML, lo que reduce la capacidad de mantenimiento del código y contamina las etiquetas. Si los atributos de eventos se agregan dinámicamente a través de JS, no solo se puede controlar de manera flexible, sino que también el cliente JS puede hacerlo. ser utilizado La ventaja del almacenamiento en caché es que estos atributos de eventos no tienen que seguir a cada solicitud de documento.
4.onclick=”javascript:…”
Este es un lío interesante de JavaScript. Los pseudoprotocolos y los controladores de eventos intrínsecos pueden crear hasta 100.000 combinaciones redundantes. El hecho es que el contenido dentro del atributo de evento se convierte en una fucución del cuerpo después del análisis. , por lo que javascript: se convierte aquí en una etiqueta redundante e inútil.
5.href="javascript:vacío(0)"
Continuando con el pseudoprotocolo javascript:, uno de los más notorios es javascript:void(0), que se utiliza para evitar la acción de anclaje predeterminada. Hará que JS no pueda analizar normalmente o cometa errores (deshabilitado/no disponible/). errores). El punto de anclaje no está disponible en absoluto. La solución ideal es completar la URL correcta en href y luego usar JS para reescribirla dinámicamente, de modo que el punto de anclaje no deje de estar disponible incluso si no se ejecuta JS. HREF="#" es una alternativa optimizada y más rápida.
6. estilo = "..."
No hay ningún error esencial, pero es problemático mantenerlo más adelante. Además, moverlo a un archivo CSS externo se puede almacenar en caché para mejorar la eficiencia de ejecución de la página.
7.
Otro atributo fácilmente malentendido de la etiqueta script, charset, se describe en HTML4.01: tenga en cuenta que el atributo charset se refiere a la codificación del script especificada por el atributo src del carácter y no involucra el contenido del elemento script. (Tenga en cuenta que el atributo charset se refiere a la codificación de caracteres del script designado por el atributo src; no se refiere al contenido del elemento SCRIPT), es decir, solo especifica el formato de codificación del archivo de script al delinear el guión. No recomendado.