Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Data: online and off
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
Phil Nash
September 21, 2015
Programming
180
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Data: online and off
Phil Nash
September 21, 2015
More Decks by Phil Nash
See All by Phil Nash
Four steps from JavaScript to TypeScript
philnash
3
580
JavaScript Apps Go Intl - GIDS Live 2021
philnash
2
380
You're on Mute! WebRTC and our Lives on Screen - GIDS Live 2021
philnash
1
390
Better API DX with a CLI - APIdays Jakarta
philnash
0
460
The trouble with webhooks - at Apidays Live Hong Kong
philnash
2
290
Four steps from JavaScript to TypeScript
philnash
0
500
Fantastic passwords and where to find them - at NoRuKo
philnash
52
3.7k
The trouble with webhooks - at APIdays Singapore
philnash
0
430
What's going on with Project Fugu? at DevTalks Reimagined
philnash
0
640
Other Decks in Programming
See All in Programming
PHPで使える日時の表現と、その知り方 #frontend_phpcon_do
o0h
PRO
0
260
AIだと陥りがちなJakarta EE最新技術への移行時の落とし穴と解決策
tnagao7
0
130
Spec Driven Development | AI Summit Lisbon
danielsogl
PRO
0
210
Language Server 使ってる? 〜VSCode と Zed の場合〜 / Are you using a Language Server? ~For VS Code and Zed~
handlename
0
800
Strategic Design in the Frontend: Moduliths & Micro Frontends @DDDEurope
manfredsteyer
PRO
0
130
鹿野さんに聞く!『TypeScriptコードレシピ集』で磨く実践力
tonkotsuboy_com
4
810
Hunting Vulnerabilities in Symfony with LLMs
vinceamstoutz
0
560
Creating Composable Callables in Contemporary C++
rollbear
0
170
さぁV100、メモリをお食べ・・・
nilpe
0
160
AI駆動開発を妨げる技術的負債の解消アプローチ / ai-refactoring-approach
minodriven
14
6.9k
Vue × Nuxt × Oxc どこまで使える?実運用の現在地
andpad
0
300
軽量Java基盤の設計 DIコンテナに頼らない、長期保守と1秒起動の実現 JJUG CCC 2026 Spring
macha64
0
580
Featured
See All Featured
4 Signs Your Business is Dying
shpigford
187
22k
How to audit for AI Accessibility on your Front & Back End
davetheseo
0
450
Building AI with AI
inesmontani
PRO
1
1.1k
Bootstrapping a Software Product
garrettdimon
PRO
307
120k
Prompt Engineering for Job Search
mfonobong
0
350
Writing Fast Ruby
sferik
630
63k
Paper Plane (Part 1)
katiecoart
PRO
0
9.2k
16th Malabo Montpellier Forum Presentation
akademiya2063
PRO
0
150
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
21
1.5k
New Earth Scene 8
popppiees
3
2.4k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
9
1.4k
Heart Work Chapter 1 - Part 1
lfama
PRO
8
36k
Transcript
DATA: ONLINE AND OFF
Phil Nash @philnash http:/ /philna.sh
[email protected]
DATA: ONLINE AND OFF
OFFLINE FIRST
Offline first An application that treats the network as an
enhancement
Not offline first • Graceful failure to network requests •
Just saving data client side
None
None
THINGS TO CONSIDER
ASSETS
SERVICE WORKER
None
USER DATA
None
DATA: ONLINE AND OFF
Data: online and off • Traditional application data storage •
Traditional vs offline first • Browser based data storage • Offline first and data
TRADITIONAL APPLICATION DATA STORAGE
GET / POST
Traditional application data storage 1. POST data to a server
2. Server stores data in a database 1. GET request for data 2. Server interprets request and delivers
OFFLINE?
TRADITIONAL VS OFFLINE FIRST
INTERACT LOCALLY
Interact locally • Save data locally • Retrieve data from
local cache
Interact locally • Crazy fast! • The network doesn't matter
THEN SYNC
Sync • People have multiple devices • Good as a
backup
Sync • Can be asychronous • Can be intentional •
Requires network
DATA STORAGE IN THE FRONT END
LOCALSTORAGE
LocalStorage • Simple key value store • Synchronous (slow)
WEBSQL
WEBSQL
INDEXEDDB
IndexedDB • Asynchronous • o_O
MAKING DATA OFFLINE FIRST
Making data offline first We need something that is: •
Easily distributed • Eventually consistent • Resolves conflicts • Web friendly
None
CouchDB Apache CouchDB™ is a database that uses JSON for
documents, JavaScript for MapReduce indexes, and regular HTTP for its API
None
PouchDB • CouchDB for the browser/Node • Wraps IndexedDB or
WebSQL • LocalStorage adapter available as a plugin
DEMO
Offline first • The time for offline first is now
• Distributing data like this requires a change of mindset • Not all application data needs to be stored this way
Help me! On a scale of 0 to 10, how
likely is it that you would recommend this talk to a friend or colleague? 0203 322 5761
Thanks! @philnash http:/ /philna.sh
[email protected]
On a scale of 0
to 10, how likely is it that you would recommend this talk to a friend or colleague? 0203 322 5761