Vous êtes ici : Dossiers référencement > Google+

Membre WebRankInfo ?

S'inscrire Aide

L'infrastructure technique de Google+ pour le rendu des pages

Par , Lundi 9 janvier 2012

Mark Knichel, ingénieur dans l'équipe infrastructure de Google+, donne quelques informations sur les technologies utilisées par Google pour concevoir son réseau social. Voici 4 techniques utilisées par Google pour accélérer l'affichage des pages sur son réseau social.

Closure

ClosureGoogle adore Closure et utilise sa bibliothèque, ses templates et son compilateur pour le rendu de n'importe quel élément d'une page sur Google Plus, y compris le Javascript utilisé sur les pages.

Les templates Closure sont utilisés en Java et en Javascript, côté serveur et côté client (navigateur). Le contenu arrive plus rapidement tandis que le Javascript peut être chargé en tâche de fond.

Vous trouverez plus de détails sur Closure sur le site Google Code.

Le bon JavaScript au bon moment

Google découpe son code Javascript en plusieurs modules qui peuvent être chargés indépendamment et de façon asynchrone (pour ne pas ralentir le chargement de la page). Ainsi, l'internaute ne télécharge que le minimum de code Javascript nécessaire. C'est sur la base de ce framework que Google peut faire en sorte le plus possible que l'utilisateur n'ait pas besoin de recharger toute la page.

La navigation sans recharger toute la page

A partir du moment où le JavaScript est chargé, Google effectue le rendu sans recourir à des accès serveur pour éviter de ralentir. Un Event Listener détecte les clics sur les liens : tant que c'est possible, ce clic est géré par une navigation interne à la page, sans la recharger complètement. Si ce n'est pas possible, le clic est géré de façon traditionnelle par le navigateur.

Ce qui est très pratique à l'usage, c'est que malgré tout l'attribut href des liens contient l'URL réelle, si bien qu'on peut faire un copier coller sans récupérer une URL Javascript ou intégrant du tracking. Par exemple, ce n'est pas ce qui est fait dans les SERP et c'est pénible de ne pas pouvoir faire un copier-coller d'une URL figurant dans les résultats...

Utilisation des chunks HTML

Google envoie vers le navigateur des chunks HTML au fur et à mesure qu'ils sont construits, afin de permettre l'affichage du début de la page sans attendre que tout ait été envoyé. Les chunks HTML sont des blocs de code HTML indépendants, valides de façon isolée (par exemple ils n'ont pas besoin d'une balise fermante pour être valides). Ce système permet également à Google de charger dès que possible les CSS, Javascript, images et autres ressources.

Utilisation d'iframe pour charger le Javascript

Pour charger le Javascript en parallèle, il est situé dans une iframe au tout début du body. Ceci complique les choses pour le reste du code mais Google a estimé que la vitesse ainsi gagnée était vraiment intéressante.

Vos avis et réactions ?

N'étant pas développeur web, j'ai pu laisser de côté certains aspects importants ou mal expliquer certains d'entre eux. N'hésitez pas à donner votre avis !

Source

A propos de l'auteur : Olivier Duffez Olivier Duffez sur Google+ Olivier Duffez sur Twitter Olivier Duffez sur Facebook Olivier Duffez sur Pinterest Olivier Duffez sur LinkedIn

Consultant en référencement, Olivier Duffez a travaillé pour les plus grands sites (Doctissimo, FNAC, RueDuCommerce...). Il édite le site WebRankInfo qu'il a créé en 2002, devenu la + grande communauté francophone sur le référencement (270.000 membres, 1,4 million de posts). Il a également créé la société Ranking Metrics, leader des formations emarketing en France (SEO, AdWords, Analytics, réseaux sociaux).

Vous avez aimé cet article ? Partagez-le !

Vous aimez WebRankInfo ? Suivez-nous !

Si vous souhaitez publier un extrait de cet article sur votre site, assurez-vous de respecter les conditions générales d'utilisation de WebRankInfo.

6 commentaires

  1. Nicolas a dit le

    Je n'ai pas bien compris la partie Chunk HTML ? Est ce la même chose que :
    http://developer.yahoo.com/performance/rules.html#flush
    à savoir envoyer le plus tôt possible la partie entêtes du fichier HTML sans attendre la fin de la génération de la page ?

  2. SmartCenter a dit le

    Non c'est un dispositif normalisé du protocole HTTP qui permet de saucissonner dynamiquement le corps en morceaux de taille paramétrée et de vérifier la réception par le client.

  3. flagos a dit le

    Interessant cette histoire de flush. J'ai un certain de ressources a aller loader dans le header. Ca serait interessant que les navigateurs commencent a aller les choper avant qu'ils s'attaquent au reste du contenu statique.

  4. Nicolas a dit le

    Comment peut-on gérer les chunks à l'aide de PHP ? Difficile de trouver d ela doc sur le sujet...

  5. Tyma a dit le

    Voici des informations très intéressantes, merci beaucoup !

  6. Hotel La Clayette a dit le

    Google toujours là pour innover en matière de rapidité de chargement ! Des exemples souvent à suivre, rappelez vous les sprite, aujourd'hui les Chunk HTML...

Postez un commentaire !

Les champs marqués du signe * sont obligatoires. L'adresse email ne sera pas affichée.

En postant un commentaire, vous acceptez les CGU du site WebRankInfo.

Cherchez dans tous les dossiers

Cherchez par mots-clés dans ~2000 articles :

Catégories des dossiers

Consultez les dossiers par thématiques :

Formation référencement et webmarketing

Venez chez Ranking Metrics vous former au référencement, à Google AdWords et Analytics ainsi qu'aux réseaux sociaux ! Plus de 4000 entreprises sont déjà venues (Dossier possible OPCA, DIF...).

Préparés et animés par Olivier Duffez (WebRankInfo) et Fabien Faceries (AgentWebRanking), 2 professionnels reconnus dans le domaine, nos modules sur le référencement naturel sont très complets tout en laissant une grande place à l'interactivité pour répondre à toutes les questions des participants.

Pour connaître le plan détaillé de chaque module, le prix, les dates et les lieux, consultez le site de Ranking Metrics (organisme de formation).

Hébergement web

Hébergement web mutualisé et dédié

Pour un bon référencement, il faut un bon hébergeur. Testez Sivit by Nerim, l'hébergeur choisi par Olivier Duffez pour son site WebRankInfo.

A partir de 3€ HT/mois.