working connected to create offline - trondheim developer conference 2014
DESCRIPTION
One of the main problems that the web has is that it doesn’t work when you are offline. That’s one of the reasons why HTML5 is not the revolution that replaces native apps. In this talk Chris Heilmann of Mozilla shows just how much developers can benefit from working online and what you can do to ensure that the users of our products have a great offline experience. “Offline first” is a great principle, and we can use the web to achieve it.TRANSCRIPT
Working connected to create offline
Chris Heilmann, Trondheim Developer Conference, ← there, 24/11/2014
We live in exciting times.
Going online is not a thing anymore…
Natural service integration
Single location service aggregation
Automatic updates and notifications
Seamless data retention and syncing
A steady stream of amazing data
With us as consumers and creators
Voice recognition and wearables
oh…
We live in exciting times.
The future won’t have flying cars and limitless connectivity.
Physics is still against us…
https://www.flickr.com/photos/52686644@N04/6304054115/ MokshaDolphin
Geography is against us
World Wide Web(ish)…
IDC: Worldwide Smartphone Forecast by Region
Homegrown concerns…
Can we trust what we don’t know?
What is the cloud?
Someone else’s computer.
We are constantly being monitored.
There’s a need for an offline web, but we conditioned people not to believe in it.
https://www.youtube.com/watch?v=gnbLLQwZxeA
The current tools are OK(ish)…
Offline apps - caching resources
http://caniuse.com/#search=appcache
Offline apps - storing resources
http://caniuse.com/#search=webstorage
Offline apps - storing larger resources
We need to use them well, so that people start trusting the web to be offline capable and theirs to own.
I am not alone in this…
https://www.youtube.com/watch?v=dPz_5-MEvcg
ALEX FEYERKE — OFFLINE FIRST
We’re working on the solution…
A great solution attempt: ServiceWorker
https://www.youtube.com/watch?v=4uQMl7mFB6g
More in depth (with demos and all)
https://www.youtube.com/watch?v=SmZ9XcTpMS4
In the meantime, prepare for the next challenge…
Think offline first!
Offline ideas…
• Store static, unchanged content using AppCache • Offer interfaces for users (“do you want to store
this for later?”) • Check battery status and remind people to store
instead of polling and storing. • Start with a very simple, easy to cache version
that loads more on demand. • Store resources locally (libraries, fonts, images)
http://www.peterbe.com/plog/localforage-vs.-xhr
LocalForage vs. XHR experiment
Be frugal with your resources.
Put the web on a diet…• Slim down your dependencies - do you really
need bootstrap, jQuery and those huge hero images when the user is on a mobile?
• Think about icon fonts, sprites and other ways to reduce HTTP requests - anything you can collate into a single resource, you can cache.
• Are you using whole fonts when you only need a few chars? Do you need all the weights and versions of the font?
Find extra fat and remove it!
https://www.youtube.com/watch?v=Qrzf1lsBMMw
Find extra fat and remove it!
We live in exciting times.Let’s make the web world-wide again
