Qu'est-ce qu'IndexedDB et quand les sites web l'utilisent-ils ?

IndexedDB est un système de stockage avancé du navigateur pour les données volumineuses et structurées. Son fonctionnement et quand un site en a besoin.

Brouillon

IndexedDB est le système de stockage intégré au navigateur pour les données volumineuses et structurées. Découvrez ce que c'est, comment il fonctionne et quand les sites web l'utilisent à la place du stockage local ou du stockage de session.

Avez-vous déjà utilisé une application web qui continuait à fonctionner même quand votre connexion internet coupait ? Ou une application aussi rapide qu'une application native installée sur votre téléphone, avec de gros volumes de données qui s'affichent instantanément ? Derrière ces expériences, il y a en général quelque chose de bien plus puissant que les outils de stockage de base du navigateur vus jusqu'ici. Ce quelque chose, c'est IndexedDB.

IndexedDB est le type de stockage de navigateur le plus puissant qui existe, et il se situe un cran au-dessus de ce que le stockage local et le stockage de session sont conçus pour gérer. La plupart des propriétaires de sites d'entreprise n'y toucheront jamais directement, mais le comprendre vous donne une image complète de ce que les navigateurs sont capables de stocker.

Qu'est-ce qu'IndexedDB ?

IndexedDB est une base de données de bas niveau intégrée au navigateur. Contrairement au stockage local et au stockage de session, qui conservent de simples paires clé-valeur de texte, IndexedDB peut stocker des données structurées : objets, tableaux, fichiers et données binaires. On peut y faire des recherches, l'indexer, et elle peut stocker bien plus de données que les autres types de stockage du navigateur.

Son nom donne un indice sur son fonctionnement. Elle utilise des index, une sorte de tables de correspondance, pour retrouver rapidement les enregistrements stockés sans tout parcourir. C'est ce qui la rend pratique pour stocker et récupérer de grandes quantités d'informations structurées dans le navigateur lui-même.

En quoi IndexedDB diffère-t-il des autres stockages du navigateur ?

Le stockage local conserve de petites valeurs de texte, sans limite de durée. Le stockage de session fait de même, mais seulement pour la session de l'onglet en cours. Les deux sont simples et limités. IndexedDB est fondamentalement différent par sa portée et ses capacités.

La capacité de stockage est l'une des principales différences. Le stockage local est en général plafonné à 5 à 10 mégaoctets, alors qu'IndexedDB peut stocker des centaines de mégaoctets ou plus selon le navigateur et l'appareil. Il stocke aussi directement des structures de données complexes, pas seulement du texte brut. Et il prend en charge les requêtes : le site peut rechercher et filtrer les enregistrements stockés, au lieu de simplement récupérer une valeur par sa clé exacte.

À quoi les sites web utilisent-ils IndexedDB ?

Le fonctionnement hors ligne

Les applications web qui doivent fonctionner sans connexion internet utilisent IndexedDB pour stocker des données en local sur l'appareil. Une application de prise de notes, un outil de gestion de projet ou un client de messagerie peut enregistrer des données dans IndexedDB pour que le visiteur puisse toujours lire, créer et modifier du contenu hors ligne. Les modifications se synchronisent avec le serveur dès que la connexion revient.

Les grands jeux de données dans le navigateur

Les applications qui manipulent de gros volumes de données, comme des cartes, des filtres complexes ou de grands catalogues de produits, peuvent utiliser IndexedDB pour mettre ces données en cache en local. L'application doit alors moins souvent aller chercher des données sur le serveur, ce qui rend l'expérience nettement plus rapide pour l'utilisateur.

Le stockage de fichiers

IndexedDB peut stocker des fichiers directement dans le navigateur. C'est utile pour les applications où les utilisateurs importent ou génèrent du contenu qui doit rester accessible d'une session à l'autre avant d'être envoyé au serveur.

La plupart des sites web utilisent-ils IndexedDB ?

Non. IndexedDB est utilisé par des applications web complexes, pas par les sites d'entreprise classiques. Un site vitrine, un site de services, une boutique en ligne et la plupart des sites de contenu n'en ont pas besoin. Leurs besoins de stockage sont bien couverts par les cookies, le stockage local et le stockage de session.

Pour votre propre site, la plateforme sur laquelle vous le créez gère toutes les décisions de stockage. Le créateur de site web de WEMASY utilise automatiquement le bon type de stockage pour chaque fonction. Pour une vue comparée de tous les types de stockage du navigateur et de leur articulation, lisez l'article sur les types de stockage du navigateur.

Questions fréquentes

IndexedDB est-il une vraie base de données ?

C'est une base de données au sens où il stocke des données structurées, prend en charge l'indexation et permet des requêtes. Mais il est très différent d'une base de données côté serveur. Il fonctionne entièrement dans le navigateur, sur l'appareil du visiteur, et non sur un serveur distant. Il est conçu pour le stockage côté client, pas pour la gestion de données partagées entre plusieurs utilisateurs que font les bases de données de serveur. Avec le créateur de site web de WEMASY, vous pouvez mettre cela en place directement sur votre site.

Combien de données IndexedDB peut-il stocker ?

Bien plus que le stockage local ou de session. La plupart des navigateurs autorisent IndexedDB à utiliser une part importante de l'espace disque disponible, souvent des centaines de mégaoctets ou plus. Le navigateur peut demander l'autorisation de l'utilisateur si un site tente de stocker un très gros volume. La limite exacte varie selon le navigateur et peut aussi dépendre de l'espace libre sur l'appareil.

Les données IndexedDB restent-elles après la fermeture du navigateur ?

Oui. Les données IndexedDB sont persistantes par défaut, comme le stockage local. Elles restent dans le navigateur jusqu'à ce que l'utilisateur efface ses données de navigation ou que le site les supprime. Cette persistance rend IndexedDB adapté aux applications capables de fonctionner hors ligne, où les données doivent survivre d'une session à l'autre.

IndexedDB est-il sécurisé ?

IndexedDB est isolé par site : un site ne peut pas accéder aux données d'un autre. Mais comme les autres types de stockage du navigateur, il est accessible aux scripts qui s'exécutent sur la page. Les données sensibles, comme les mots de passe, les données de paiement et les informations personnelles, ne doivent jamais être stockées dans IndexedDB. Il convient bien aux données d'application et aux contenus volumineux, mais ne doit pas remplacer un stockage sécurisé côté serveur.

Les visiteurs peuvent-ils effacer leurs données IndexedDB ?

Oui. Effacer les données de navigation dans les réglages du navigateur supprime IndexedDB, avec les cookies, le stockage local et le cache. Les visiteurs peuvent aussi l'effacer via les outils de développement. Les applications qui dépendent d'IndexedDB pour des données importantes doivent en tenir compte en synchronisant les données avec un serveur quand une connexion est disponible, pour que les données locales ne soient jamais la seule copie.

Dois-je connaître IndexedDB pour créer un site web ?

Non. IndexedDB est un outil pour les développeurs qui créent des applications web complexes. En tant que propriétaire de site utilisant une plateforme, vous n'y toucherez jamais directement. Votre créateur de site web gère en arrière-plan les décisions de stockage du navigateur. Comprendre IndexedDB est utile pour se faire une image complète du fonctionnement des navigateurs, mais cela n'a aucune incidence pratique sur la façon dont vous gérez votre site au quotidien.

Mettez-le en pratique
sur votre propre site.

Commencez gratuitement avec WEMASY et créez votre site en quelques minutes.