HTML5 offline

Preview:

Citation preview

Welcome!

Tuesday, June 8, 2010

Who am I?

Tuesday, June 8, 2010

Me: Huge Apple fanboy!

Tuesday, June 8, 2010

Tuesday, June 8, 2010

I am the mayor ‘n shit!

Tuesday, June 8, 2010

Tuesday, June 8, 2010

Tuesday, June 8, 2010

0

1

2

3

Requests

Native app Web app

Tuesday, June 8, 2010

0

1

2

3

Requests

Native app Web app

SUCKAGE!

Tuesday, June 8, 2010

Ruby’s syntax Objective-C syntaxTuesday, June 8, 2010

app-store approval process

Tuesday, June 8, 2010

Release early release oftenTuesday, June 8, 2010

What is the answer?

Tuesday, June 8, 2010

Tuesday, June 8, 2010

Wow awesome!

Tuesday, June 8, 2010

Tuesday, June 8, 2010

The answer:

Tuesday, June 8, 2010

The answer: Webapps

Tuesday, June 8, 2010

The real answer: HTML5 Offline

Modulehttp://www.w3.org/TR/offline-webapps/

Tuesday, June 8, 2010

Cache Manifest

Tuesday, June 8, 2010

The manifest filemime: text/cache-manifest

CACHE MANIFESTindex.htmlstylesheets/all.cssjavascripts/jquery.jsjavascripts/rails.jsjavascripts/application.jsimages/logo.pngimages/hoff.png

NETWORK:contacts/index.json

Tuesday, June 8, 2010

<!DOCTYPE HTML><html manifest="/cache-manifest">

Tuesday, June 8, 2010

var online = navigator.onLine;Can you hear me now?

Tuesday, June 8, 2010

Grab the data and run!$.get('/contacts.json');

Tuesday, June 8, 2010

An app aint nuthing without:Persistent storage

Tuesday, June 8, 2010

SQL databasehttp://www.w3.org/TR/offline-webapps/#sql

Tuesday, June 8, 2010

Key-value persistent data storage

http://www.w3.org/TR/webstorage/

Tuesday, June 8, 2010

html5demos.com

Tuesday, June 8, 2010

Justin Halsall

• blog: juice10.com

• pet project: tvnotify.com

• twitter.com/juice10

• wakoopa.com/juice10

• github.com/Juice10

Tuesday, June 8, 2010

snoranje.nlTuesday, June 8, 2010

Recommended