Applis web mobiles instantanées
Restez organisé à l'aide des collections
Enregistrez et classez les contenus selon vos préférences.
Le chemin d'affichage critique fait référence à tout élément (JavaScript, HTML, CSS, images) dont le navigateur a besoin pour commencer à peindre la page. Vous devez impérativement prioriser la diffusion des assets sur le chemin critique du rendu, en particulier pour les utilisateurs sur les appareils limités au réseau, comme les smartphones sur les réseaux mobiles. Bryan nous a expliqué comment l'équipe Google s'est chargée d'identifier et de hiérarchiser les ressources pour le site Web PageSpeed Insights : le temps de chargement est passé de 20 secondes à un peu plus d'une seconde.
Slides
- Supprimez les codes JavaScript et CSS qui bloquent l'affichage.
- Donnez la priorité au contenu visible.
- Chargez les scripts de manière asynchrone.
- Affichez la vue initiale côté serveur en HTML et ajoutez du code JavaScript.
- Minimisez le code CSS qui bloque l'affichage. Ne diffusez que les styles nécessaires pour afficher la fenêtre d'affichage initiale, puis diffusez le reste.
- Les URI de données volumineux intégrés au code CSS qui bloque l'affichage nuisent aux performances d'affichage, car ils bloquent les ressources où les URL d'images ne sont pas bloquantes.
Sauf indication contraire, le contenu de cette page est régi par une licence Creative Commons Attribution 4.0, et les échantillons de code sont régis par une licence Apache 2.0. Pour en savoir plus, consultez les Règles du site Google Developers. Java est une marque déposée d'Oracle et/ou de ses sociétés affiliées.
Dernière mise à jour le 2025/07/25 (UTC).
[[["Facile à comprendre","easyToUnderstand","thumb-up"],["J'ai pu résoudre mon problème","solvedMyProblem","thumb-up"],["Autre","otherUp","thumb-up"]],[["Il n'y a pas l'information dont j'ai besoin","missingTheInformationINeed","thumb-down"],["Trop compliqué/Trop d'étapes","tooComplicatedTooManySteps","thumb-down"],["Obsolète","outOfDate","thumb-down"],["Problème de traduction","translationIssue","thumb-down"],["Mauvais exemple/Erreur de code","samplesCodeIssue","thumb-down"],["Autre","otherDown","thumb-down"]],["Dernière mise à jour le 2025/07/25 (UTC)."],[],["The core content discusses optimizing the Critical Rendering Path (CRP) for faster page load times. Key actions include eliminating render-blocking JavaScript and CSS, prioritizing visible content, loading scripts asynchronously, and rendering the initial view server-side as HTML. Minimizing render-blocking CSS by delivering only initial viewport styles is crucial. Large data URIs inlined within blocking CSS negatively impacts performance, unlike image URLs. These steps were used to significantly improve the PageSpeed Insights website's load time.\n"]]
