OnConnectionLost - The Life of an Offline Web Application
summary
A web application was built to let field staff read documents, record results and upload photos while offline, then automatically sync changes when back online. The project uses HTML5 AppCache, IndexedDB and the File API to store both application code and data in the browser, and addresses design questions about client vs. server data ownership, app updates, which data to pre-download for offline use, automated testing of offline features, and defining what “offline” means.
AI-written summary · about
chapters (21)
- 0:00Offline apps intro
- 1:13What offline means
- 2:17Two real-world cases
- 4:49Three steps to offline
- 5:10Installing in browser
- 8:46AppCache pitfalls and alternatives
- 9:49Service Workers solution
- 10:12Choosing storage options
- 11:42LocalStorage to IndexedDB
- 12:23IndexedDB API overview
- 13:46IndexedDB API challenges
- 14:06Handling DB migrations
- 15:56Cross-language migration logic
- 16:21Sync offline data changes
- 18:08Command vs memento pattern
- 19:10Memento pattern implementation
- 21:42Detecting online status
- 23:29Developer's nightmare?
- 23:50Key questions for offline
- 27:52Unsolved challenges
- 30:45Offline-first design tips
related talks
33mOffline applications in an online world
45mOffline First (Web) Apps
22mSurviving the Offline Apocalypse
30mOffline First: Making Your App Awesome When the Network Isn't
01h 01mMake Your Web App Work Even Offline — It's Possible!
38mHow we developed an Offline‑First app using Persistent Storage
48mThe Web's future is offline
31mI'm offline, cool! What now?