Tôi hiện có một ứng dụng bản đồ HTML5 ngoại tuyến (được xây dựng trên Leaflet & KendoUI với các bổ sung tùy chỉnh) có bảng kê khai ứng dụng và hoạt động tốt trên nhiều nền tảng. Tuy nhiên, tôi ngần ngại sử dụng bảng kê khai để lưu trữ các lát bản đồ thực tế theo cách này (các tệp PNG được lưu dưới dạng Bộ đệm ẩn kiểu TMS).
Các vấn đề:
- Có thể có rất nhiều ô (10MB - 50MB) trong khoảng 1.000 tệp PNG
- Tải xuống ban đầu có thể rất chậm (và khó hiển thị tiến trình cho người dùng)
- Bản kê khai ứng dụng hoạt động hoặc chúng không hoạt động nếu chúng không thực hiện toàn bộ bộ đệm ẩn ngoại tuyến (theo [whatwg.org] [1])
- Người dùng ngoại tuyến đôi khi sẽ kết nối lại và cần được làm mới các ô, Đây là các đồng bằng nhỏ nhưng cơ chế tệp kê khai ứng dụng sẽ tải lại tất cả các tệp js, css và PNG ngay khi cập nhật tệp kê khai
Ý tưởng thay thế: giữ cho ứng dụng web tách biệt khỏi việc lưu trữ các lát bản đồ slippy. Lưu trữ các ô trong cơ sở dữ liệu thân thiện với ứng dụng web
Cập nhật:
[PouchDB gần đây đã thêm hỗ trợ cho các đốm nhị phân. Tôi đang nhận được kết quả ban đầu tốt. Xem: /programming/16721312/USE-pouchdb-as-an-offline-raster-map-cache ]
- Điều này được đề xuất bởi Ben Nolan http://bennolan.com/2011/06/03/offline-mapping.html
- Công việc tương tự trên Maps trên gậy: http://developmentseed.org/blog/2010/oct/02/maps-stick-version-2-release/ ([deprecated] [2])
- MBtiles http://mapbox.com/developers/mbtiles/
- Xếp hình https://github.com/mapbox/tilestream
- Lous Remi: http://louisremi.com/2011/10/07/offline-web-appluggest-were-not-there-yet/
Câu hỏi: Trí tuệ tập thể (và kinh nghiệm) nói gì về các lựa chọn sau cho DB thân thiện với JavaScript:
- SqlLite
- Có vẻ như bạn cần tạo một trình bao bọc ứng dụng gốc cho việc này để cho phép nó nói chuyện với JavaScript
- Ví dụ: Thêm bạn DLL vào chương trình gốc cho windows và PhoneGap cho android / IOS
- WebQuery
- thất vọng
- nhưng đó là SQL Lite mà tôi có thể dễ dàng tạo và phân phối từ máy chủ web
IndexDB
- Lưu trữ các đốm màu dường như hoạt động, xem: https://hacks.mozilla.org/2012/02/storing-images-and-files-in-indexeddb/
- Tôi lo ngại nếu đây là cách duy nhất để bắt đầu DB
- Đây có phải là một tệp SQLLite không? Tôi có thể gửi nó để tải lên số lượng lớn DB không?
- Tôi đang nghiêng về phía này như là một giải pháp. Có phải Gotchas của họ không biết?
Yêu cầu:
- Dân số ban đầu nhanh chóng (thông qua tải xuống) đến máy khách Web DB
- Tương thích với API LeafLayer Leaflet hiện tại (nghĩa là tôi không muốn viết một lớp tùy chỉnh, nhưng nếu cần ...) (ví dụ: MbTiles)
- Nền tảng: Máy tính xách tay Windows, nhưng máy tính bảng Android và IOS mong muốn (Tôi có thể đợi cho đến khi IndexDB được phát hành, không cần hỗ trợ ngay lập tức)
- Tôi thà không viết một ứng dụng gốc (EXE, IOS, Android) nhưng nếu đó là cách tốt nhất ...
- Tạo bản đồ phía máy chủ (đây sẽ là một quy trình tự động). Người dùng chọn một vị trí, chọn bản đồ và họ được chuyển đổi linh hoạt và biến thành bộ đệm ẩn nhanh chóng (công việc này đã được thực hiện phần lớn).
- Tải xuống hàng loạt nhanh
- Làm mới delta thay đổi bản đồ (Tôi sẽ viết logic này, dựa trên số lượng chứng khoán không đổi và cập nhật logic ngày)
- Tác động tối thiểu đến ứng dụng web Tờ rơi & KendoUI hiện tại
Cập nhật:
Ý tưởng nền tảng chính: trong khi ứng dụng web khá ổn định, các lát bản đồ slippy được tạo ra một cách nhanh chóng cho vị trí của bạn và loại vấn đề bạn đang làm (ở phần cuối). Vì vậy, tôi đã nghĩ đến hai cách khác để chuyển 'vụ nổ lớn' ban đầu và sau đó cập nhật:
Tệp Zip (có thể không phải là ý tưởng hay - vì nó thêm tải máy chủ) cũng mở rộng trên máy khách sẽ yêu cầu tương tác của người dùng, nhưng nó cho phép các lát gạch nhanh chóng sử dụng url cục bộ
API tệp HTML5: Tôi chưa xem xét điều này rất chi tiết. Nhưng có vẻ như hầu hết các hoạt động để tạo một cây tệp cục bộ ở định dạng TMS: http://www.html5rocks.com/en/tutorials/file/filesystem/ điều thú vị để kiểm tra là hiệu suất (ví dụ: tôi có thể sử dụng các tác phẩm web để tối đa hóa băng thông vào đĩa và trên mạng). IndexDB không được triển khai rộng rãi để thân thiện với nhân viên web (giao diện đồng bộ: /programming/10698728/indexeddb-in-web-worker-on-firefox
Tôi đã tìm thấy một số thông tin bổ sung về việc sử dụng IndexDB với Tờ rơi:
https://github.com/calvinmetcalf/leaflet.pouch (đồng bộ couchdb với indexdb để ngoại tuyến) Ngoài ra đây là một số thử nghiệm về tốc độ đọc / ghi cho indexdb, websql và cửa hàng địa phương: http://jsperf.com/indexeddb -vs-localst Storage / 15
Và đây là cách sử dụng API tệp đọc / ghi từ javascript: (và cũng để yêu cầu tăng giới hạn lưu trữ) http://www.html5rocks.com/en/tutorials/file/filesystem/
Cảm ơn bạn, Tom MacWright (còn gọi là tmcw), vì một số phản hồi tốt. Ví dụ của bạn thực sự sẽ giúp ích khi tôi tạo các lớp tùy chỉnh để ăn các đốm nhị phân.
Tôi đã thực hiện một số thử nghiệm ngày hôm qua với IndexedDB và bằng cách sử dụng một số polyfill và thư viện tôi nghĩ rằng nó sẽ giải quyết vấn đề của tôi. Bây giờ là lúc để đặt một số vốn chủ sở hữu mồ hôi vào đây, và tôi sẽ báo cáo lại.
BTW: nếu bạn muốn xem kết quả nghiên cứu của tôi về cơ sở dữ liệu phía khách hàng, hãy xem:
/programming/14113278/storing-image-data-for-offline-web-application-client-side-st Storage-database
