現在、オフラインのHTML5マップアプリケーション（LeafletとKendoUIで構築され、カスタムの追加機能を備えています）があります。これは、アプリマニフェストを持ち、複数のプラットフォームで正常に動作します。ただし、この方法でマニフェストを使用して実際のマップタイルを保存することをためらっています（TMSスタイルのタイルキャッシュとして保存されたPNGファイル）。
問題点：
- 約1,000個のPNGファイルに多数のタイル（10MB-50MB）が存在する可能性があります
- 最初のダウンロードは非常に遅くなる可能性があります（そしてユーザーに進行状況を表示するのが難しい）
- アプリマニフェストが機能するか、機能しない場合は、オフラインキャッシュ全体が失敗します（[whatwg.org] [1]による）
- オフラインユーザーは時折再接続し、タイルの更新を取得する必要があります。これらは小さなデルタですが、アプリマニフェストメカニズムはマニフェストの更新時にすべてのjs、css、およびPNGファイルをリロードします
代替案： Webアプリケーションを、滑りやすいマップタイルのストレージとは別にしてください。Webアプリケーションに適したデータベースにタイルを保存します
更新：
[PouchDBは最近、バイナリBLOBのサポートを追加しました。良い初期結果を得ています。参照：https : //stackoverflow.com/questions/16721312/using-pouchdb-as-an-offline-raster-map-cache ]
- これはBen Nolanによって提案されていますhttp://bennolan.com/2011/06/03/offline-mapping.html
- Maps on a Stickでの同様の作業：http : //developmentseed.org/blog/2010/oct/02/maps-stick-version-2-released/（[非推奨] [2]）
- MBtiles http://mapbox.com/developers/mbtiles/
- TileStream https://github.com/mapbox/tilestream
- Lous Remi：http : //louisremi.com/2011/10/07/offline-web-applications-were-not-there-yet/
質問： JavaScriptフレンドリなDBの次の選択について、集合的な知恵（および経験）は何を言っていますか？
- SqlLite
- このためにネイティブアプリラッパーを作成してJavaScriptと通信できるようにする必要があるようです
- たとえば、Windows用のネイティブプログラムにDLLを追加し、Android / IOS用のPhoneGapを追加します。
- WebSQL
- 奪われた
- しかし、ホストWebサーバーから簡単に生成および配布できるのはSQL Liteでした
IndexDB
- blobの保存は次のように動作するようです：https : //hacks.mozilla.org/2012/02/storing-images-and-files-in-indexeddb/
- これが最初にDBにデータを入力する唯一の方法であるかどうか心配です
- これは基本的にSQLLiteファイルですか？一括DBアップロード用に出荷できますか？
- 私は解決策としてこれに傾いています。私が知らない彼らの落とし穴はありますか？
要件：
- クライアントWeb DBへの高速ダウンロード（ダウンロード経由）
- 現在のLeaflet TileLayer APIと互換性があります（つまり、カスタムレイヤーを作成するのではなく、必要に応じて...）（MbTilesなど）
- プラットフォーム：Windowsラップトップ、ただしAndroidおよびIOSタブレットが必要（IndexDBがリリースされるまで待つことができます。すぐにサポートする必要はありません）
- 私はむしろネイティブアプリ（EXE、IOS、Android）を書きたくはありませんが、それが最良の方法であれば...
- サーバー側でのWebマップの生成（これは自動化されたプロセスになります）。ユーザーが場所を選択し、マップを選択すると、それらは動的に変換され、滑りやすいタイルキャッシュに変換されます（この作業は既にほぼ完了しています）。
- 高速一括初期ダウンロード
- マップ変更デルタの更新（一定の在庫数に基づいてこのロジックを記述し、日付ロジックを更新します）
- 現在のLeafletおよびKendoUI Webアプリケーションへの影響は最小限
更新：
重要な背景アイデア：Webアプリはかなり安定していますが、滑りやすいマップタイルは、現在地と実行している問題の種類（バックエンドで）に応じてオンザフライで生成されます。そこで、最初の「ビッグバン」を転送してから更新するための2つの方法を考えました。
Zipファイル（おそらく良い考えではありません-サーバーの負荷を追加するため）また、クライアントマシンでの拡張にはユーザーの操作が必要になりますが、滑りやすいタイルでローカルURLを使用できます
HTML5 File API：私はこれを詳細に見ていない。しかし、TMS形式でローカルファイルツリーを作成するほとんどの操作があるようです：http : //www.html5rocks.com/en/tutorials/file/filesystem/テストするのが面白いのはパフォーマンスですディスクとネット全体の帯域幅を最大化するため）。IndexDBはWebワーカーに優しいように広く実装されていません（同期インターフェイス：https ://stackoverflow.com/questions/10698728/indexeddb-in-web-worker-on-firefox
リーフレットでIndexDBを使用することに関する追加情報を見つけました。
https://github.com/calvinmetcalf/leaflet.pouch（オフラインのためにcouchdbとindexdbを同期します）また、indexdb、websql、およびローカルストアの読み取り/書き込み速度のテストもいくつかあります：http ://jsperf.com/indexeddb -vs-localstorage / 15
そして、ここにはJavaScriptからの読み出し/書き込みファイルAPIを使用する方法である：（ともストレージの制限を増やすように依頼する）http://www.html5rocks.com/en/tutorials/file/filesystem/
トムマクライト（別名tmcw）、良いフィードバックをありがとう。バイナリBLOBを取り込むためにカスタムレイヤーを作成する場合、あなたの例は本当に役立ちます。
昨日、IndexedDBでいくつかのテストを行い、いくつかのポリフィルとライブラリを使用して、問題を解決できると思います。さて、これに汗をかく公平を置く時が来たので、報告します。
ところで：クライアント側のデータベースに関する私の研究の私の結果を見たい場合は、以下を参照してください。
/programming/14113278/storing-image-data-for-offline-web-application-client-side-storage-database
