WordPress a développé speculative loading, un plugin de performance qui prend en charge l’API de chargement spéculatif, ce qui accélère le chargement des pages web et améliore in fine l’expérience utilisateur.
Chargement spéculatif
Le rendu consiste à construire l’ensemble de la page web de manière à ce qu’elle s’affiche instantanément. Lorsque votre navigateur télécharge le code HTML, les différentes ressources comme les fichiers multimédia et les rassemble dans une page web, c’est le rendu. Le pré-rendu consiste à assembler cette page web (rendu) en arrière-plan.
Ce plugin génère le pré-rendu[https://wordpress.org/plugins/speculation-rules/] de l’intégralité de la page web susceptible d’être visitée par l’utilisateur. Pour ce faire, le plugin anticipe la page du site vers laquelle l’utilisateur peut naviguer selon le survol de la page.
Chrome indique une préférence pour le prérendu uniquement lorsqu’il existe une probabilité d’au moins 80 % que l’utilisateur navigue vers une autre page web. La page officielle d’assistance de Chrome sur le prerendering explique :
« Les pages ne doivent être pré-rendues que lorsqu’il y a une forte probabilité qu’elles soient chargées par l’utilisateur. C’est pourquoi les options de prérendu de la barre d’adresse de Chrome n’interviennent qu’en cas de forte probabilité (plus de 80 % du temps). »
Cette même page destinée aux développeurs contient également une mise en garde indiquant que le pré-rendement peut ne pas se produire en fonction des paramètres de l’utilisateur, de l’utilisation de la mémoire, etc.
L’API Speculative Loading résout un problème que les solutions précédentes ne pouvaient pas résoudre parce que, dans le passé, elles ne faisaient que prélever des ressources telles que JavaScript et CSS, sans réellement pré-rendre la page web entière.
WordPress l’explique comme suit :
L’API Speculation Rules est une nouvelle API web qui résout les problèmes susmentionnés. Elle permet de définir des règles pour prélever et/ou préparer dynamiquement des URL d’une certaine structure en fonction de l’interaction de l’utilisateur, dans la syntaxe JSON ou, en d’autres termes, de précharger spéculativement ces URL avant la navigation. Cette API peut être utilisée, par exemple, pour prérendre tous les liens d’une page lorsque l’utilisateur les survole.
WordPress décrit ainsi son nouveau plugin :
L’API Speculation Rules est une nouvelle API web… Elle définit des règles pour prélever et/ou prérendre dynamiquement des URL d’une certaine structure en fonction de l’interaction de l’utilisateur, en syntaxe JSON, ou en d’autres termes, de précharger spéculativement ces URL avant la navigation.
Cette API peut être utilisée, par exemple, pour prérendre tous les liens d’une page lorsque l’utilisateur les survole. En outre, avec l’API Règles de spéculation, « prérender » signifie en fait prérender l’ensemble de la page, y compris le JavaScript en cours d’exécution. Cela peut conduire à des temps de chargement quasi instantanés lorsque l’utilisateur clique sur le lien, car la page a très probablement déjà été chargée dans son intégralité. Il ne s’agit toutefois que de l’une des configurations possibles.
Le nouveau plugin WordPress prend en charge l’API Speculation Rules. Les pages des développeurs de Mozilla, une excellente ressource pour la compréhension technique du HTML, la décrivent comme suit :
L’API des règles de spéculation est conçue pour améliorer les performances des navigations futures. Elle cible les URL des documents plutôt que des fichiers de ressources spécifiques, et s’applique donc aux applications multipages (MPA) plutôt qu’aux applications monopages (SPA).
L’API Règles de spéculation offre une alternative à la fonctionnalité <link rel= »prefetch »> largement disponible et est conçue pour remplacer la fonctionnalité <link rel= »prerender »>, obsolète et réservée à Chrome. Elle apporte de nombreuses améliorations par rapport à ces technologies, ainsi qu’une syntaxe plus expressive et configurable pour spécifier quels documents doivent être traités en amont ou en aval.
Plugin Performance Lab
Ce nouveau plugin a été développé par l’équipe officielle de performance de WordPress qui met occasionnellement en place de nouveaux plugins pour que les utilisateurs les testent avant de les inclure dans le noyau de WordPress. C’est donc une bonne occasion d’être le premier à essayer les nouvelles technologies de performance.
Le nouveau plugin WordPress est configuré par défaut pour prérendre les « WordPress frontend URLs », c’est-à-dire les pages, les articles et les pages d’archives. Son fonctionnement peut être affiné dans les réglages :
Réglages > Lecture > Chargement spéculatifCompatibilité des navigateurs
L’API spéculative est prise en charge par Chrome 108, mais les règles spécifiques utilisées par le nouveau plugin requièrent Chrome 121 ou une version plus récente. Chrome 121 a été publié au début de l’année 2024.
Les navigateurs qui ne sont pas compatibles ignoreront simplement le plugin et n’auront aucun effet sur l’expérience de l’utilisateur.
Découvrez le nouveau plugin WordPress Speculative Loading développé par l’équipe officielle de performance de WordPress.
Comment Analytics gère le prérendering
Un développeur WordPress a posé une question sur la manière dont Analytics gère le prerendering et quelqu’un d’autre a répondu que c’est au fournisseur Analytics de détecter un prerendering et de ne pas le compter comme un chargement de page ou une visite de site.
Heureusement, Google Analytics et Google Publisher Tags (GPT) sont tous deux capables de gérer les prerenders. La page d’assistance aux développeurs de Chrome contient une note sur la manière dont Analytics gère le pré-rendu :
Google Analytics gère le pré-rendu en retardant l’activation par défaut à partir de septembre 2023, et Google Publisher Tag (GPT) a fait un changement similaire pour retarder le déclenchement des publicités jusqu’à l’activation à partir de novembre 2023.
Conflit possible avec les extensions de bloqueurs de publicité
Outre le fait qu’il s’agit d’une fonctionnalité expérimentale qui nécessite Chrome 121 ou une version plus récente, il faut prendre en compte le fait que cette fonctionnalité peut s’avérer incompatible avec les navigateurs utilisant le bloqueur de publicité uBlock Origin.
