Un serveur dans le navigateur
Architecture classique
La plupart des applications web est construite autour de l'architecture 3-tiers, une architecture logique qui se répartit selon une architecture technique sur différentes machines composées de :
- une base de données (données)
- un serveur applicatif (traitement)
- un client (présentation)
Le hors-ligne
Lorsqu'une application web est utilisée hors-ligne, elle n'a plus accès au serveur.
Cependant l'architecture 3-tiers peut se répartir sur une seule machine physique pour permettre une utilisation hors-ligne.
Dans ce cas, lorsque le client est hors-ligne, l'application est capable de continuer à fonctionner.
Lorsque l'application retrouve l'accès aux serveurs, elle peut alors se mettre à jour :
- envoyer les données locales aux serveurs
- récupérer les données distantes depuis les serveurs
Les technologies du navigateur
Différentes technologies permettent d'augmenter la fiabilité réseau des applications Web, que l'utilisateur soit complètement déconnecté du réseau ou qu'il soit derrière une connexion peu fiable.
La documentation de Google https://web.dev/reliable/ 🇬🇧 contient quelques articles autour de ces technologies et des besoins qu'elles couvrent :
- Service Worker qui peut servir de proxy local (https://web.dev/service-worker-mindset/ 🇬🇧)
- Cache API qui permet de stocker des ensembles requête-réponse (https://web.dev/cache-api-quick-guide/ 🇬🇧)
- Network Information API qui permet de réagir en fonction de l'état de la connexion (https://web.dev/adaptive-serving-based-on-network-quality/ 🇬🇧)
- Periodic Background Sync API qui permet d'anticiper les besoins des données distantes (https://web.dev/periodic-background-sync/ 🇬🇧)
- Background Sync API qui permet de renvoyer une requête quand la connexion est disponible (https://developers.google.com/web/updates/2015/12/background-sync 🇬🇧)
- Workbox qui permet d'implémenter simplement des comportements pour le Service Worker (https://web.dev/workbox/ 🇬🇧)
- HTTP Cache Control Header qui permet d'indiquer au navigateur la péremption des données (https://web.dev/http-cache/ 🇬🇧)
- IndexedDB API qui permet de créer une base de données noSQL dans le navigateur (https://web.dev/storage-for-the-web/ 🇬🇧)
