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
Phil Nash
September 21, 2015
Programming
0
160
Data: online and off
Phil Nash
September 21, 2015
Tweet
Share
More Decks by Phil Nash
See All by Phil Nash
Four steps from JavaScript to TypeScript
philnash
3
500
JavaScript Apps Go Intl - GIDS Live 2021
philnash
2
310
You're on Mute! WebRTC and our Lives on Screen - GIDS Live 2021
philnash
1
320
Better API DX with a CLI - APIdays Jakarta
philnash
0
390
The trouble with webhooks - at Apidays Live Hong Kong
philnash
2
230
Four steps from JavaScript to TypeScript
philnash
0
440
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3.3k
The trouble with webhooks - at APIdays Singapore
philnash
0
340
What's going on with Project Fugu? at DevTalks Reimagined
philnash
0
530
Other Decks in Programming
See All in Programming
イベントストーミング図からコードへの変換手順 / Procedure for Converting Event Storming Diagrams to Code
nrslib
2
600
dbt民主化とLLMによる開発ブースト ~ AI Readyな分析サイクルを目指して ~
yoshyum
3
450
Quand Symfony, ApiPlatform, OpenAI et LangChain s'allient pour exploiter vos PDF : de la théorie à la production…
ahmedbhs123
0
130
スタートアップの急成長を支えるプラットフォームエンジニアリングと組織戦略
sutochin26
0
1.3k
AIプログラマーDevinは PHPerの夢を見るか?
shinyasaita
1
190
PipeCDのプラグイン化で目指すところ
warashi
1
250
Systèmes distribués, pour le meilleur et pour le pire - BreizhCamp 2025 - Conférence
slecache
0
120
Modern Angular with Signals and Signal Store:New Rules for Your Architecture @enterJS Advanced Angular Day 2025
manfredsteyer
PRO
0
180
#kanrk08 / 公開版 PicoRubyとマイコンでの自作トレーニング計測装置を用いたワークアウトの理想と現実
bash0c7
1
670
PHPで始める振る舞い駆動開発(Behaviour-Driven Development)
ohmori_yusuke
2
250
PHPでWebSocketサーバーを実装しよう2025
kubotak
0
260
来たるべき 8.0 に備えて React 19 新機能と React Router 固有機能の取捨選択とすり合わせを考える
oukayuka
2
890
Featured
See All Featured
Into the Great Unknown - MozCon
thekraken
39
1.9k
Code Review Best Practice
trishagee
69
18k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
229
22k
Large-scale JavaScript Application Architecture
addyosmani
512
110k
4 Signs Your Business is Dying
shpigford
184
22k
Building Better People: How to give real-time feedback that sticks.
wjessup
367
19k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
5.9k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
48
2.9k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Code Reviewing Like a Champion
maltzj
524
40k
How STYLIGHT went responsive
nonsquared
100
5.6k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
657
60k
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