У меня есть автономное веб-приложение, использующее appcaching. Мне нужно предоставить около 10 МБ - 20 МБ данных, которые он сохранит (на стороне клиента), состоящий в основном из файлов изображений PNG. Операция следующая:
- Веб-приложение загружается и устанавливается в appcache (использует манифест)
- Запросы веб-приложений из файлов данных PNG сервера (как? - см. альтернативы ниже)
- Иногда веб-приложение выполняет повторную синхронизацию с сервером и выполняет небольшие частичные обновления/удаления/добавления в базу данных PNG.
- FYI: Сервер - это сервер JSON REST, который может размещать файлы в wwwroot для pickup
Вот мой текущий анализ клиентских "баз данных", которые обрабатывают двоичное хранилище blob
СМОТРЕТЬ ОБНОВЛЕНИЕ в нижней части
- AppCache (через манифест добавить все PNG, а затем обновить по требованию)
- CON: любое изменение элемента базы PNG будет означать полную загрузку всех элементов в манифесте (действительно плохие новости!)
- WebStorage
- CON: Предназначен для хранения JSON
- CON: может хранить только капли с помощью кодировки base64 (возможно, фатальный из-за стоимости декодирования)
- CON: жесткий предел 5MB для webStorage http://htmlui.com/blog/2011-08-23-5-obscure-facts-about-html5-localstorage.html
- PhoneGap и SQLLite
- CON: Спонсор отклонит его как родное приложение, требующее сертификации
- ZIP файл
- Сервер создает zip файл, помещает его в wwwroot и уведомляет клиента
- пользователь должен вручную распаковать (по крайней мере, так я его вижу) и сохранить в клиентской файловой системе
- Веб-приложение использует API FileSystem для ссылки на файлы
- CON: ZIP может быть слишком большим (zip64?), долгое время для создания
- CON: Не уверен, что FileSystem API всегда может читать из песочницы (я так думаю)
- USB или SD-карта (назад к каменному возрасту....)
- Пользователь будет локальным на сервере перед выходом в автономный режим
- Таким образом, мы могли бы вставить его в SD-карту, чтобы сервер заполнил ее PNG файлами.
- Затем пользователь подключит его к ноутбуку, планшету
- Веб-приложение будет использовать FileSystem API для чтения файлов
- CON: Не уверен, что FileSystem API всегда может читать из песочницы (я так думаю)
- WebSQL
- CON: w3c отказался от него (довольно плохо)
- Я мог бы рассмотреть Javascript-оболочку, которая использует индексированные индексы и WebSQL в качестве спада
- API файловой системы
- Chrome поддерживает чтение/запись blobs
- CON: непонятно о IE и FireFox (IE10, имеет нестандартное msSave)
- caniuse.com сообщает о поддержке IOS и Android (но опять же, это просто r/w JSON, или он включает полный API-интерфейс blob для написания?
- CON: пользователям FireFox не нравится API-интерфейс FileSystem и не ясны, если они поддерживают сохранение капли: https://hacks.mozilla.org/2012/07/why-no-filesystem-api-in-firefox/
- PRO: намного быстрее, чем IndexedDB для blobs в соответствии с jsperf http://jsperf.com/indexeddb-vs-localstorage/15 (стр. 2)
- IndexedDB
- Хорошая поддержка в IE10, FireFox (save, read blobs)
- Хорошая скорость и удобство управления, чем файловая система (удаляет, обновляет)
- PRO: см. тесты скорости: http://jsperf.com/indexeddb-vs-localstorage/15
- См. эту статью о хранении и отображении изображений в IndexedDB: https://hacks.mozilla.org/2012/02/storing-images-and-files-in-indexeddb/
- CON: Я подтвердил, что Chrome пока не поддерживает запись blob (текущая ошибка, но неясно, когда она будет исправлена)
- ОБНОВЛЕНИЕ: разработчики Chrome подтверждают, что они работают над этим как для настольных, так и для Android! еще нет временной шкалы.
- LawnChair Оболочка JavaScript http://brian.io/lawnchair/
- PRO: очень чистая оболочка для IndexedDB, WebSQL или любой другой имеющейся у вас базы данных (подумайте polyfill)
- CON: не может хранить двоичные капли, только данные: uri (кодировка base64) (возможно, фатальная ошибка из-за стоимости декодирования)
- IndexedDB JQUERY polyFill https://github.com/axemclion/jquery-indexeddb
- Parashuram имеет ремиссионную симпатичную оболочку JQUERY для исходного интерфейса IndexedDB.
- PRO: значительно упрощает использование IndexedDB, я надеялся добавить шайбу / polyfill для Chrome FileSystemAPI
- CON: Он должен обрабатывать капли, но я не смог заставить его работать.
- idb.filesystem.js http://ericbidelman.tumblr.com/post/21649963613/idb-filesystem-js-bringing-the-html5-filesystem-api
- Eric Bidelman @Google написал хорошо протестированный polyFill API FileSystem, который использует индексированную БД как откат
- PRO: API FileSystem хорошо подходит для хранения blobs
- PRO: отлично работает на FireFox и Chrome
- PRO: отлично подходит для синхронизации с облачным CouchDB
- CON: не понятно почему, но он не работает на IE10
- Библиотека PouchDB JavaScript http://pouchdb.com/
- отлично подходит для синхронизации CouchDB с локальной БД (использует либо WebSQL, либо IndexedDB (не моя проблема)
- CON: NO CONS, PouchDB теперь поддерживает бинарные капли для всех последних браузеров (IE, Chrome, Firefox, Chrome на мобильных устройствах и т.д.), а также многие старые браузеры. Это было не так, когда я впервые сделал это сообщение.
ПРИМЕЧАНИЕ: чтобы увидеть данные: uri-кодирование PNG, я создал пример: http://jsbin.com/ivefak/1/edit
Желаемые/полезные/не входящие функции
- Нет приложения native (EXE, PhoneGap, ObjectiveC и т.д.) на клиенте (чистое веб-приложение)
- Для работы с новейшими Chrome, FireFox, IE10 для ноутбуков требуется только
- Сильно хочу, чтобы такое же решение для Android Tablet (IOS было бы неплохо), но нужен только один браузер для работы (FF, Chrome и т.д.).
- Быстрая начальная численность DB
- ТРЕБОВАНИЕ: очень быстрое извлечение изображений с помощью веб-приложения из хранилища (DB, file)
- Не предназначен для потребителей. Мы можем ограничить браузеры и попросить пользователя выполнить специальную настройку и задачи, но свести к минимуму, что
Индексированные версии DB
- Существует отличная статья о том, как IE, FF и Chrome реализуют это внутри: http://www.aaron-powell.com/web/indexeddb-storage
- Короче:
- IE использует тот же формат базы данных, что и Exchange и Active Directory для IndexedDB
- Firefox использует SQLite, так что это реализация базы данных NoSQL в базе данных SQL
- Chrome (и WebKit) используют хранилище Key/Value, имеющее наследие в BigTable
Мои текущие результаты
- Я решил использовать подход IndexedDB (и polyFill с FileSystemAPI для Chrome до тех пор, пока не отправит поддержку blob)
- Для извлечения плиток у меня была дилемма, так как люди JQUERY kvetching добавили это в AJAX
- Я пошел с XHR2-Lib Phil Parsons, который очень похож на JQUERY.ajax() https://github.com/p-m-p/xhr2-lib
- Производительность для загрузки 100 МБ (IE10 4s, Chrome 6s, FireFox 7s).
- Я не мог заставить ни одну из оберток IndexedDB работать для blobs (lawnchair, PouchDB, jquery-indexeddb и т.д.).
- Я перевернул свою собственную оболочку, и производительность (IE10 2s, Chrome 3s, FireFox 10s)
- С FF я предполагаю, что мы видим проблему с производительностью использования реляционной БД (sqllite) для хранения без sql
- ПРИМЕЧАНИЕ. У Chrome есть выдающиеся инструменты отладки (вкладка разработчика, ресурсы) для проверки состояния IndexedDB.
ЗАКЛЮЧИТЕЛЬНЫЕ Результаты, представленные ниже как ответ
Update
Теперь PouchDB поддерживает бинарные капли для всех последних браузеров (IE, Chrome, Firefox, Chrome на мобильных устройствах и т.д.), а также многие старые браузеры. Это было не так, когда я впервые сделал это сообщение.