Уже довольно давно у веб-приложений появилась возможность хранить часть данных или файлов локально. Можно даже кешировать MP3-файлы. Браузеры научились хранить немалые объёмы данных. Тем не менее, пока что технологии локального хранения сильно фрагментированы.
localStorage предоставляет лишь самые базовые функции, это хранилище довольно медленно и не умеет хранить блобы. IndexedDB и WebSQL асинхронны, быстры и поддерживают большие объемы данных, но их API довольно запутан. Кроме того, ни IndexedDB, ни WebSQL не поддерживаются
всеми основными браузерами, и, похоже, в ближайшем будущем эта ситуация не изменится.
Если вам нужно писать веб-приложение с оффлайн-режимом, и вы не знаете, с чего начать, то эта статься для вас. Если вы уже пытались работать с локальными хранилищами, и у вас от этого голова пошла кругом — статья и для вас тоже. Мы в Mozilla написали библиотеку localForage, которая значительно облегчает задачу хранения локальных данных в любом браузере.
Почувствовать на своей шкуре все сложности работы с локальным хранилищем мне помогла разработка around — HTML5-клиента для Foursquare. Хотя в этой статье я рассказываю, как использовать localForage, возможно кто-то предпочтёт изучить реальные примеры работы с ней.
localForage — очень простая библиотека JavaScript, которая использует API, похожий на API localStorage, с теми же самыми базовыми методами
get
,
set
,
remove
,
clear
и
length
, но имеет ещё несколько важных улучшений:
- асинхронный API с колбэками;
- драйвера IndexedDB, WebSQL и localStorage (самый подходящий драйвер выбирается автоматически в зависимости от возможностей браузера);
- поддержка блобов и произвольных форматов данных, так что можно хранить изображения, файлы и так далее;
- поддержка обещаний ECMAScript 6.
Использование IndexedDB и WebSQL позволяет хранить намного больше данных, чем localStorage. Неблокирующий асинхронный API делает приложение более быстрым и отзывчивым, так как основной поток приложения не подвисает во время выполнения вызовов
get/set
. Поддержка обещаний позволяет писать чистый код без спагетти из колбэков. Конечно, если вы любите колбэки, можно использовать и их.
Хватит болтовни, покажите, как это работает!
Большинству программистов на языке JavaScript, успевших ознакомиться с Node.js, хорошо известен
модуль fs, который
в API Node служит для доступа к файловой системе.
Matthew Phillips (на фото справа) предпринял успешную попытку создания во браузерном (клиентском) джаваскрипте частичного аналога этого нодовского модуля. Исходный код, опубликованный им на Гитхабе к началу нынешнего (2013) года, поддерживает работу с файлами и каталогами виртуальной файловой системы, в роли которой в Chrome выступает
FileSystem API, а в Firefox и в IE —
IndexedDB.