J'ai vu un article qu'il a écrit l'année dernière sur Perfection kills. Il était très détaillé sur l'optimisation HTML, je vais l'enregistrer pour le moment, bien que certaines des choses qu'il contient ne puissent pas être appliquées dans l'environnement actuel. Dans le cadre de la tendance actuelle des applications WEB à devenir progressivement front-end, l'optimisation côté client a attiré de plus en plus d'attention. Comment réduire le code, comment afficher rapidement les applications aux utilisateurs, comment réduire le temps d'attente des utilisateurs, etc., comme celui de Yahoo . 34 règles d'or de l'optimisation Un plan d'optimisation détaillé est proposé.
La partie la plus fondamentale de l'optimisation des pages Web doit être l'optimisation HTML. Plus précisément, le premier est le nettoyage du balisage. Le nettoyage du balisage peut non seulement réduire la taille du document, mais également faciliter la maintenance du document et améliorer la visibilité des moteurs de recherche (Nettoyer). le balisage signifie une meilleure accessibilité), une maintenance plus facile et une bonne visibilité sur les moteurs de recherche), mais même pour les pages Web réputées hautement optimisées, si vous regardez attentivement le code, vous pouvez toujours trouver de nombreuses utilisations de balises qui peuvent être supprimées ou sont obsolètes :
1.Commenter les caractères dans le script
<langage SCRIPT=javascript>
<!-- Commencer
alert("daimaren.cn");
// Fin -->
</script>
À moins qu'un navigateur presque disparu comme 95 Netscape 1.0 ne nécessite un tel traitement, dans la plupart des navigateurs traditionnels, l'ajout de commentaires HTML aux blocs de script est totalement inutile.
2.<![CDATA[ … ]>
<script type="text/javascript">
//<![CDONNEES[
...
//]]>
</script>
Il s'agit d'une autre mesure de prévention des erreurs qui est souvent ajoutée dans les blocs de code js. Elle vise à empêcher le code d'analyser un symbole < comme début d'une balise lorsqu'il s'agit de documents XHTML réels (type de contenu "application/xhtml+xml"). . Tout le contenu contenu dans CDATA sera traité comme du texte. Mais la situation réelle est que le type de contenu de presque toutes les pages Web à l'heure actuelle est texte/html, ce qui signifie qu'il ne s'agit pas de documents XML au sens strict, mais simplement de texte, cette mesure de prévention des erreurs est donc totalement inutile. si vous êtes sûr de prendre en charge les documents XML, vous devez utiliser CDATA de manière appropriée en fonction de la situation.
3.onclick=”…”, onmouseover=””et ainsi de suite.
C'est une pratique très imprudente d'écrire des attributs d'événement dans des balises HTML, ce qui réduit la maintenabilité du code et pollue les balises. Si les attributs d'événement sont ajoutés dynamiquement via JS, non seulement ils peuvent être contrôlés de manière flexible, mais le client JS peut également le faire. être utilisé L'avantage de la mise en cache est que ces attributs d'événement ne doivent pas nécessairement suivre chaque demande de document.
4.onclick="javascript :..."
Il s'agit d'un gâchis javascript intéressant. Les pseudo-protocoles et les gestionnaires d'événements intrinsèques peuvent créer jusqu'à 100 000 combinaisons redondantes. Le fait est que le contenu de l'attribut d'événement devient une fonction du corps après analyse. . , donc javascript: devient ici une balise redondante inutile.
5.href="javascript:void(0)"
En continuant avec le pseudo-protocole javascript:, l'un des plus notoires est javascript:void(0), qui est utilisé pour éviter l'action d'ancrage par défaut. Cela empêchera JS d'analyser normalement ou fera des erreurs (désactivé/non disponible/). erreurs). Le point d'ancrage est complètement indisponible. La solution idéale est de renseigner l'URL correcte dans le href, puis d'utiliser JS pour la réécrire dynamiquement, afin que le point d'ancrage ne soit pas indisponible même si le JS n'est pas exécuté. HREF="#" est une alternative simplifiée et plus rapide.
6.style=”…”
Il n'y a pas d'erreur essentielle, mais il est difficile de la maintenir plus tard. De plus, le déplacer vers un fichier CSS externe peut être mis en cache pour améliorer l'efficacité de l'exécution de la page.
7. <langage de script="Javascript" … >
L'un des attributs les plus mal compris, pensant qu'il s'agit du « langage » du script, est si ancien qu'il a été obsolète en 1999.
8. <script charset="…" …>
<script type="text/javascript" charset="UTF-8">
...
</script>
Un autre attribut facilement mal compris de la balise script, charset, est décrit dans HTML4.01 : Veuillez noter que l'attribut charset fait référence à l'encodage de script spécifié par l'attribut src du caractère, et qu'il n'implique pas le contenu de l'élément script. (Notez que l'attribut charset fait référence à l'encodage des caractères du script désigné par l'attribut src ; cela ne concerne pas le contenu de l'élément SCRIPT.), c'est-à-dire qu'il précise uniquement le format d'encodage du fichier de script lors du tracé le scénario. Non recommandé.