Quand est-il utile d'éliminer les CSS bloquant le rendu?
Nous voulions suivre les recommandations CSS de PageSpeed Insights et séparer les CSS critiques et différées. À cette fin, nous avons lu de nombreux articles et recommandations, tels que Optimiser la livraison CSS et Supprimer le rendu du blocage des CSS .
Juste pour tester quelle différence cela fait, nous avons déplacé le paquet vers le bas de la page. Le résultat était que cela ne faisait aucune différence. Nous avons toujours exactement le même score et le même problème "Éliminer le JavaScript et les CSS bloquant le rendu dans le contenu au-dessus du pli" pour cet ensemble (pourquoi lorsqu’il a été chargé la dernière?).
Nous avons également commencé à séparer physiquement les CSS, mais nous sommes rapidement parvenus à la conclusion que si nous le faisions de manière à ce que toutes les pages affichent un contenu correct au-dessus du pli, environ 70% des CSS devraient être en ligne, ce qui ne laisse qu'environ 30%. différé.
Avoir une grande partie du CSS en ligne ne semble pas avoir beaucoup de sens, nous nous demandons donc si nous pouvons ignorer la suggestion de PageSpeed Insights sans trop de pénalité de classement. À l’heure actuelle, en quoi la résolution de ce problème fait-elle vraiment une différence en termes de référencement, et en vaut-il la peine pour un site comportant plusieurs mises en page différentes (chaque catégorie a sa propre mise en page)?
Quel "paquet" as-tu déplacé au bas de la page? Vous ne pouvez le faire qu'avec du javascript.
Vous commencez à insérer au-dessus du pli CSS lorsque cela fait une différence mesurable. Est-ce que l'insertion du CSS rend la page plus rapide à l'affichage qu'un aller-retour pour un fichier CSS? Vous pourriez chercher à savoir pourquoi 70% de votre code CSS est appliqué en haut de votre page.
Là encore, de nombreuses recommandations de Google et d’autres concernent les grands sites contenant des pages volumineuses et des fichiers de mégaoctets; Quelque chose à garder à l'esprit. La documentation ne mentionne pas toujours les exceptions.
Je crois que la déclaration PageSpeed est une déclaration générale. vous pouvez avoir un CSS parfait, mais si votre javascript ralentit le processus, vous obtiendrez la même déclaration. Les fichiers CSS seront toujours bloqués.
La meilleure chose à suivre est les onglets de réseau et de minutage dans les outils de développement de votre navigateur.