juin 8, 2023

“Découvrez tout sur le fonctionnement des navigateurs web en un tweet : structure, rôle et utilité expliqués !”

Vous voulez que le SEO de votre site rentre dans l'âge adulte?

Contactez moi et voyons ça! ;)

Partager



Sous le capot des navigateurs web : décryptage avec Anthony Le Goas, directeur de Zenika Brest

Le navigateur web, c’est quoi exactement ?

Anthony Le Goas, directeur du cabinet de conseil en informatique Zenika à Brest, a tenu une conférence sur les navigateurs web lors du Web2day. Pour lui, un navigateur web est un logiciel conçu pour consulter et afficher le World Wild Web. Il permet donc d’aller chercher des ressources web et d’afficher le contenu pour proposer un rendu à l’utilisateur.

Qui sont les principaux acteurs du marché ?

Selon les données de StatCounter, Chrome, le navigateur web de Google, reste en tête avec 66,22 % de parts de marché en avril 2023. Il devance Safari (11,89 %) et Edge (10,95 %), celui de Microsoft. En France, c’est Firefox qui prend la 2e place (14,13 %) devant Edge (12,33 %).

La structure des navigateurs web

Un navigateur web est composé de différentes briques, dont certaines sont reliées entre elles au sein de sa structure globale. On retrouve notamment l’UI Browser, le moteur browser, le moteur de rendu, l’UI Backend et la persistance des données.

Focus sur le moteur de rendu

Le moteur de rendu est essentiel car il va permettre d’afficher le code HTML et les feuilles de style pour « dessiner » la ressource demandée aux utilisateurs. Il se base sur des règles de syntaxe et un vocabulaire qui vont constituer la grammaire du langage. Après l’opération de parsing, le render tree représente la représentation visuelle du document, suivi du processus de « dessin » qui comprend le layout, le paint et le composite.

Les bonnes pratiques à adopter

Pour éviter les problèmes de performances, il est recommandé d’utiliser des sélecteurs CSS simples, d’appliquer du CSS avec un identifiant ou des class CSS plutôt qu’en passant par des sélecteurs. Il est également conseillé d’utiliser la propriété « visibility » du CSS plutôt que « display: none » pour cacher les éléments. Enfin, il est important d’optimiser les animations CSS lors de l’étape du composite pour éviter les lenteurs.

Par votre serviteur dévoué, SAM SESSINOU HOUNKPE-DUFFAY, le roi des Ninja et du Scroll; donc fan numéro 1 du manga légendaire NINJA SCROLL! 😉

+ loin dans la Matrice

Rejoins la force.

“Être deuxième, c’est être le premier des perdants” – Ayrton Senna