Qu’est-ce qu’un navigateur WEB et comment ça marche ?

Vous utilisez tous les jours un navigateur WEB comme Google Chrome, Mozilla Firefox, Opera, Brave ou encore Microsoft Edge.
Mais savez-vous comment cela fonctionne ?
Vous vous demandez comment les sites WEB peuvent s’afficher sur votre écran.

Ce tutoriel complet vous explique comment fonctionnement les navigateurs internet.

Qu’est-ce qu’un navigateur WEB ?

Un navigateur WEB est donc une application qui s’installe sur un appareil comme un PC ou un Smartphone.
La fonction première d’un navigateur WEB est d’afficher une page WEB présentée par un serveur WEB, souvent via internet.
Toutefois, avec le temps et la complexité des pages WEB, les navigateurs WEB ont étendu leurs fonctionnalités.
Ainsi, ils sont sont maintenant capable de lire un document PDF, une image, un contenu Audio (au format MP3 par exemple) mais aussi une vidéo.

En résumé, ils sont devenus de véritables applications multimédias.

Les éditeur se livrent une guerre de marchés depuis plusieurs années, j’en parle dans cet article :

Les navigateurs WEB : comment ça marche ?

Les composants des navigateurs internet

On peut décomposer un navigateur WEB en cinq grandes parties :

1. d’une interface graphique ou interface utilisateur, c’est que l’utilisateur final voit de l’application. De manière générale, tous les navigateurs WEB actuels ont :
   1. Une barre d’adresse avec l’URL du site visité.
   2. Des boutons avance et retour ainsi que des boutons de rafraîchissement.
   3. Une bibliothèque de favoris pour y placer ses sites préférés.
   4. Une gestion des onglets pour charger plusieurs sites en même temps.
   5. Une page de démarrage.
2. Le moteur du navigateur WEB qui fait la jonction entre le moteur de rendu et l’interface utilisateur.
3. d’un moteur de rendu qui est en charge d’interpréter le code HTML, CSS, images, XML ou PDF reçu depuis le serveur WEB et de créer le visuel graphique de la page WEB. Chaque navigateur WEB a son propre moteur de rendu.
4. Réseau : en charge des requêtes HTTP et la connexion avec l’interface réseau du système d’exploitation.
5. Interface Utilisateur d’arrière-plan :utilisé pour dessiner les fenêtres et les menus déroulants. Cette interface UI backend.
6. L’interpréteur JavaScript : interprète et exécute le code JavaScript.
7. Stockage des données ou persistance des données: Le navigateur WEB a besoin de stocker des fichiers sur le disque dur, via le système d’exploitation, notamment les cookies ou le cache internet. Un environnement de profil utilisateur est aussi stocké sur le système d’exploitation. Pour se faire, généralement les navigateurs WEB supportent divers formats de base de données comme IndexedDB, SQLite, WebSQL etc

Comment les sites WEB s’affichent dans le navigateur internet

Quelque soit le navigateur WEB, le fonctionnement et l’affiche des sites internet est le même.
Le WEB fonctionne sous l’architecture client/serveur.

• Le serveur WEB stocke les pages WEB sous la forme de code et les expose sur internet
• Le client sous la forme d’un navigateur WEB se connecte au serveur WEB. Il récupère et interprète le code informatique pour construire la page WEB afin de l’afficher à l’écran de l’appareil

La communication entre les deux parties se fait avec le protocole HTTP (Hypertext Transfer Protocol).
C’est un protocole applicatif qui utilise le protocole de communication TCP/IP.
Pour cela, il existe des méthodes de communication comme GET, POST, etc.
Lorsqu’un navigateur WEB demande une ressource, comme une page WEB ou une image, il peut utiliser la méthode GET.
Le serveur WEB retourne alors le contenu.

Le protocole HTTP étant standardisé, lorsque la connexion à un site WEB échoue, cela affiche un code erreur.
Par exemple une erreur 404, 403, 504, etc
Plus d’informations : Erreur HTTP et problème de connexion à un site Web.

Les moteurs du navigateur WEB et moteur de rendu

Un navigateur WEB est donc une application avec ses fonctionnalités.
Mais chaque navigateur WEB possède son moteur de rendu ou moteur d’affichage, c’est à dire la partie de l’application qui gère et traite le rendu des pages WEB.

Le moteur du navigateur WEB gère donc divers langages WEB : HTML, CSS, JavaScript, XML, XHTML, RSS etc
Parfois des langages spécifiques aux moteurs qui peut-être utilisés par les serveurs WEB.
Par exemple Firefox gère XUL.

Le moteur de rendu reçoit le code fournit par le serveur WEB et s’occupe de la traduction en affichage de la page WEB sur l’écran du navigateur WEB.

Les “grands” navigateurs WEB Firefox, Google et Internet Explorer ont leur propre moteur de rendu développés par chaque éditeur.
Des navigateurs WEB externes moins connus peuvent s’appuyer sur ces moteurs de rendus. Cela permet de ne pas avoir à en développer un et ainsi gagner du temps.
Chaque moteur de rendu peut avoir ses spécificités : rapidité générale, ou sur certains composants, meilleur gestion de mémoire, respect des standards W3C, etc.
C’est aussi pour cela, qu’il pouvait arriver (c’est moins le cas, mais ça peut encore l’être) que d’un navigateur WEB à l’autre, le rendu d’une page WEB soit différent.

Enfin si des moteurs de rendu sont encore actifs, certains sont morts, par exemple, le navigateur WEB Opera a pu utiliser plusieurs moteurs de rendu, développé au départ par lui-même comme Elektra à Presto et Blink, puis des moteurs de rendu Google WebKit, puis de facto Blink 15.

Gecko

Gecko a été créé en 1998, lorsque Netscape passa en logiciel libre.
C’est donc le moteur d’affichage de Mozilla Firefox.
Gecko est sous la forme d’un composant logiciel XPCOM, une technologie portable proche de Microsoft COM.

Gecko supporte le langage XUL (XML-based User interface Language). Il s’agit d’un langage dérivé de XML qui permet de créer des boutons, listes etc. C’est le langage utilisée par les extensions Firefox.
XUL est abandonné en 2015 au profit de WebExtensions.

Les applications suivantes utilisent (ou ont pu) le moteur Gecko : Netscape Navigator, Mozilla Suite, SeaMonkey8, Galeon, Sunbird, Thunderbird, NVU et Fennec.

Trident et EdgeHTML

Trident est le moteur d’affichage de Microsoft et donc utilisé par Internet Explorer, apparu en 1997.
Par dérivé des bibliothèques utilisées, on peut appeler ce moteur MSHTML.

Les navigateurs WEB suivant utilisent (ou ont pu) Trident : AOL Explorer, un navigateur web, Avant Browser, Lunascape, Maxthon.
Des applications comme Skype, Winamp peuvent utiliser le moteur Trident.

EdgeHTML est le successeur de Trident au sein du navigateur WEB Microsoft Edge.
Ses débuts ont lieu en 2015 avec la parution de Windows 10.
EdgeHTML est un fork du moteur Trident d’Internet Explorer.
Il est conçu comme un composant permettant aux développeurs d’ajouter facilement des fonctionnalités de navigation Web à d’autres applications.
En 2018, EdgeHTML est abandonné au sein de Microsoft Edge qui utilise ensuite le moteur de rendu de Chromium.
Toutefois, Microsoft continue d’utiliser EdgeHTML pour les applications UWP.

WebKit

WebKit est un moteur de rendu libre utilisé au départ par Apple avec Safari.
Par la suite, ce moteur de rendu a été ensuite porté pour Windows & Linux.
WebKit est basé sur le moteur de rendu HTML du projet KDE utilisé notamment dans le navigateur Konqueror.

De nombreuses applications MacOSX utilisent WebKit, mais aussi des applications KDE ou Gnome, comme iWeb , Epiphany, le Dashboard de Gnome etc.
Le navigateur WEB Maxthon utilise aussi WebKit.

Blink

Blink est le moteur de rendu de Google utilisé par les navigateurs WEB Google Chrome et Chromium (à partir de la version 28).
Blink est basé sur le moteur de rendu libre WebKit et donc en licence libre.
Initialement Google et Opera utilisaient WebKit mais ils ont basculé vers Blink.
Ainsi, Opera utilise Blink depuis la version 15.

Ce dernier s’impose à travers Chromium puisque beaucoup de navigateur se base sur ce dernier.
Donc tous les navigateurs WEB comme Brave, Microsoft Edge utilisent ce dernier.

Le moteur et interprétateur JavaScript

Le moteur de Javascript interprète le langage JavaScript qui permet de mettre en place des mécanismes complexes dans les pages internet.
Tout comme, le moteur de rendu, chaque navigatgeur WEB possède le sien.
Certains moteurs JavaScript sont morts et plus utilisés depuis le temps.

• V8 Google est le moteur JavaScript de Google. Google Chrome et les nombreux autres navigateurs basés sur Chromium l’utilisent, tout comme les applications construites avec CEF, Electron ou tout autre framework qui intègre Chromium. D’autres utilisations incluent les systèmes d’exécution Node.js et Deno
• SpiderMonkey est développé par Mozilla pour une utilisation dans Firefox. Le shell GNOME l’utilise pour la prise en charge des extensions
• JavaScriptCore est le moteur d’Apple pour son navigateur Safari. D’autres navigateurs basés sur WebKit l’utilisent également. KJS de KDE a été le point de départ de son développement
• Chakra est le moteur du navigateur Internet Explorer. Il a également été bifurqué par Microsoft pour le navigateur Edge d’origine, mais Edge a ensuite été reconstruit en tant que navigateur basé sur Chromium et utilise donc maintenant V8

L’interface utilisateur

L’interface utilisateur du naviateur WEB est donc l’interface graphique qui s’affiche à l’écran et sur lequel l’utilisateur peut interagir.
C’est aussi dans cet espace où les pages WEB s’affichent.

Avec le temps, l’interface utilisateur a tendance à s’harmoniser, ainsi il n’existe que très peu de différences entre la présentation des navigateurs internet.
En général, on trouve :

• En haut la barre d’adresse et la barre d’onglets.
• Puis au milieu, la page WEB
• En haut à droite, le menu pour accéder aux paramètres, extensions, etc.

Le profil du navigateur WEB

Pour fonctionner le navigateur WEB utilise tout un environnement logiciel au sein de l’appareil.
Il s’agit d’une arborescence propre pour stocker différentes données dont les données de navigation.
On appelle cela le profil du navigateur WEB.

Le profil utilisateur se présente sous la forme de fichiers dans l’environnement utilisateur du système d’exploitation.
Il stocke les paramètres de l’utilisateur (thèmes, extensions installées, …) mais aussi les données de navigation avec l’historique de navigation, les cookies et le cache internet.

Il est aussi possible d’avoir un profil utilisateur sur le Cloud, c’est à dire sur un serveur distant. Cela permet d’avoir un profil centralisé sur internet qui peut-être utilisé par plusieurs ordinateurs, ainsi d’un ordinateur à l’autre, vous retrouvez votre environnement.
On parle alors de synchronisation du profil.

• Synchroniser Google Chrome
• Synchroniser Mozilla Firefox

Les extensions et plugins

Enfin, il est possible d’installer des extensions et plugins sur les navigateurs WEB.
Les extensions sont des petites applications qui se greffent sur le navigateur afin d‘apporter de nouvelle fonctionnalité ou modifier le comportement du navigateur WEB.
Elles s’installent directement dans le navigateur WEB dans un espace prévu par ce dernier.

En général, l’éditeur du navigateur WEB fournit une bibliothèque d’extensions pour télécharger et d’installer de nouvelle extensions.

Les plugins sont des applications externes (installées dans Windows ou Linux) qui peuvent interagir avec le navigateur WEB à partir d’une librairie chargée. Sur Windows, c’est sous la forme d’un fichier DLL.
Pour bien comprendre, c’est une application externe que l’on peut installer dans l’OS et qui peut se charger dans le navigateur WEB par l’intermédiaire d’une bibliothèque.

Par exemple, lorsque vous chargez une applet Flash, vous pouvez voir le processus Flash jouer l’applet sur le navigateur WEB.
Puis un site WEB peut alors chargé une applet, qui va charger le programme sur l’ordinateur.
Ainsi cela pose des problèmes de sécurité puisque le programme n’est pas maitrisé par l’éditeur du navigateur WEB.
L’éditeur du logiciel tiers (Adobe, Oracle etc) se charge de la mise à jour.

Naviguer dans la série

<< Historique et guerre des navigateurs WEBListe des meilleurs navigateurs WEB >>