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
HTML5 Application Caching
Search
Ryan McGeary
February 05, 2012
Technology
4
970
HTML5 Application Caching
Ryan McGeary
February 05, 2012
Tweet
Share
More Decks by Ryan McGeary
See All by Ryan McGeary
Cloud Services You Should Be Using To Build Your Startup
rmm5t
1
620
Asynchronous Collaboration
rmm5t
5
1.2k
How We Use MongoDB at BusyConf (Take Two!)
rmm5t
2
140
Just In Time Inventory with Spree
rmm5t
3
1.7k
How We Use MongoDB at BusyConf
rmm5t
2
670
CoffeeScript
rmm5t
5
640
One Man Lightning Talks
rmm5t
2
360
Do Your Commit Messages Suck?
rmm5t
5
1.8k
Other Decks in Technology
See All in Technology
開発生産性向上サービスを作るFindyが自分たちで開発生産性を爆上げした組織づくりの歩み / Findy's path to boosting its own development productivity 2024-04-17
ma3tk
3
600
JAWS-UG Bedrock Claude Night
yamahiro
3
530
プロトタイピングによる不確実性の低減 / Reducing Uncertainty through Prototyping
ohbarye
5
380
JSON攻略法.pdf
miyakemito
8
4.8k
AOAI をきっかけに 社内の Azure 管理を見直した話
recruitengineers
PRO
1
250
Delivering Millions of Messages within seconds @ Duolingo
pelelgrino
0
340
コンテナセキュリティの基本と脅威への対策
kyohmizu
3
750
Reducing Cross-Zone Egress at Spotify with Custom gRPC Load Balancing Recap
koh_naga
0
190
プラットフォームってつくることより計測することが重要なんじゃないかという話 / Platform Engineering Meetup #8
taishin
1
340
[新卒向け研修資料] テスト文字列に「うんこ」と入れるな(2024年版)
infiniteloop_inc
0
4.3k
Azure犬駆動開発の記録/GlobalAzureFukuoka2024_20240420
nina01
1
200
継続的な改善 x ⾮連続的な進化
sansantech
PRO
3
130
Featured
See All Featured
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
187
16k
Optimizing for Happiness
mojombo
370
69k
Product Roadmaps are Hard
iamctodd
44
9.7k
Agile that works and the tools we love
rasmusluckow
325
20k
Git: the NoSQL Database
bkeepers
PRO
422
63k
The Straight Up "How To Draw Better" Workshop
denniskardys
227
130k
Reflections from 52 weeks, 52 projects
jeffersonlam
345
19k
The Invisible Customer
myddelton
114
12k
Web development in the modern age
philhawksworth
202
10k
For a Future-Friendly Web
brad_frost
172
9k
A better future with KSS
kneath
231
16k
Designing Experiences People Love
moore
136
23k
Transcript
HTML5 Application Caching There are only two hard things in
Computer Science: cache invalidation and naming things. -- Phil Karlton Ryan McGeary http://ryan.mcgeary.org @rmm5t
diveintohtml5.info
Browser Support
Cache Manifest <!DOCTYPE HTML> <html manifest="/mobile.manifest"> <body> ... </body> </html>
text/cache-manifest
CACHE Sections CACHE MANIFEST http://www.google-analytics.com/ga.js /favicon.ico /javascripts/application.js /stylesheets/screen.css /data.json
NETWORK Sections CACHE MANIFEST NETWORK: * CACHE: http://www.google-analytics.com/ga.js /favicon.ico /javascripts/application.js
/stylesheets/screen.css /data.json
FALLBACK Sections CACHE MANIFEST FALLBACK: / /offline.html NETWORK: * CACHE:
http://www.google-analytics.com/ga.js /favicon.ico
Expiring The Cache CACHE MANIFEST # Updated: <%= something.updated_at %>
# Released: <%= application_released_at %> NETWORK: * CACHE: # ...
window.applicationCache swapCache() checking downloading progress cached error updateready already cached?
NO YES updated manifest? noupdate NO YES
window.applicationCache.status 0: window.applicationCache. UNCACHED 1: window.applicationCache. IDLE 2: window.applicationCache. CHECKING
3: window.applicationCache. DOWNLOADING 4: window.applicationCache. UPDATEREADY 5: window.applicationCache. OBSOLETE
Debugging Tips about:about
Debugging Tips https://gist.github.com/1714753
Debugging Tips or Use:
Gotchas! #1 The manifest is downloaded twice during a sync.
Gotchas! #2 Beware of swapCache
Gotchas! #3 Make sure your manifest file isn’t cached.
DEMO Let’s play some music.
Ryan McGeary ryan.mcgeary.org @rmm5t
[email protected]
McGeary Consulting Group