Basket.js, mise en cache des scripts dans le localStorage pour plus de rapidité

Basket.js, mise en cache des scripts dans le localStorage pour plus de rapidité

http://addyosmani.github.com/basket.js/asset/logo.png

Basket.js est un projet intéressant qui met en cache les fichiers JavaScript dans le localStorage pour les demandes futures plutôt que de compter sur les fonctionnalités de mise en cache intégrées des navigateurs. C'est une bonne idée car localStorage est pris en charge partout (même par IE8).

Selon les tests effectués par Google et Bing qui emploient cette technique, il s'avère que c'est assez rapide. Basket.js vous permet de profiter de la même technique dans vos sites et vos applications.

Il fonctionne en chargeant d'abord un petit fichier (Basket.js lui-même) et ensuite vérifie si vos autres scripts sont déjà mis en cache dans localStorage, sinon, ils les charge via XHR et les met en cache pour les appels suivants. Basket.js a une belle API qui vous permet de requérir des scripts et de les injecter dans la page à exécuter.

:fleche: Site officiel.


Source : D'après un article sur BadAssJS.

Je ne vois pas l'intérêt de réinventer la roue et de sortir le localStorage de son rôle initial, alors que les mécanismes de cache existent depuis bien plus longtemps et que plein d'autres outils côté serveur comme côté client sont greffés dessus.

Il n'y a aucun chiffre sur le réel gain de performances par rapport au cache classique, mais comme les ressources sont de toute façon déjà chargées localement, c'est probablement un gain ridicule en millisecondes.

Par ailleurs j'ai voulu utiliser le localStorage à plusieurs reprises dans des projets Web mobile, et dans tous les cas j'ai été confronté au problème de taille maximale (qui dépend des browsers, parfois à peine 2.5 MB...). Alors gâcher le peu qu'on a pour mettre en cache mes scripts, non merci.

Qui plus est, les perfs sont désastreuses avec localStorage quand il s'agit de stocker un nombre très importants de données. Plus la base est grosse, et plus c'est long à charger. Tout est chargé au du disque à la mémoire au chargement de la page, ce qui bloque le reste tant que ce n'est pas entièrement chargé.
Bref, c'est bien pour des scripts pas très volumineux à mettre en cache, à oublier quand il y en a beaucoup.

Source, William Chan qui travaille chez Google pour Chrome, Les créateurs de basket.js en parlent ici