Accompanying code in which we incrementally added offline capabilities, notifications and background sync of newly created content can be found at https://github.com/jamesmaciver/dddscot-demo
- Fast It just feels native Response: respond in under 50 ms Animation: produce a frame in 10ms Idle: maximise the use of Idle Time Load: Deliver content and interactive in 5s on first hit, 2s on subsequent hits
Twitter Lite to deliver a more robust experience, with explicit goals for instant loading, user engagement and lower data consumption. “Twitter Lite is now the fastest, least expensive, and most reliable way to use Twitter. The web app rivals the performance of our native apps but requires less than 3% of the device storage space compared to Twitter for Android.” 65% increase in pages per session 75% increase in Tweets sent 20% decrease in bounce rate
“Since launching our PWA, we’ve seen an exponential increase in mobile conversion rates. The PWA helped us connect with more people on mobile — and it's mobile users who make up the majority of our overall audience.” BookMyShow's PWA drove an 80%+ increase in their conversion rates. The size of the PWA is 54x smaller than the Android app and 180x smaller than the iOS app. The PWA takes less than 2.94 seconds to load and enables checkout within 30 seconds.
In Jumia's main market, sub-Saharan Africa, 75% of the mobile connections are on 2G networks. Many users only have intermittent connectivity and visit the site from low-end phones with data limitations 33% higher conversion rate 50% lower bounce rate 12X more users versus native apps (Android & IOS) 5X less data used 2X less data to complete first transaction 25X less device storage required
</html> CACHE MANIFEST # v1 - 2011-08-13 # This is a comment. http://www.example.com/index.html http://www.example.com/header.png http://www.example.com/blah/blah
a Douchebag by Jake Archibald “The ApplicationCache spec is like an onion: it has many layers, and as you peel through them you will be reduced to tears” - Files Always Come from the Application Cache, even if online! - The application cache is only updated if the appcache manifest itself has changed - Non Cached files can’t be accessed from cached files - ApplicationCache respects caching headers - with no caching headers the browser will guess.
API Store for resources necessary to load your app when offline Request / Response pairings stored Available in windowed scopes as well as workers Multiple named Caches per origin (helpful for versioning) No Expiration or automatic updating. Does not honour cache headers E.g. match(), add(), put(), delete(), keys()
Sync Allows user to create content offline and sync to server later. Still in early stages - Chrome only. Extends service workers with a sync event and an API for signalling the desire for this event to fire. serviceWorkerRegistration.sync.register() to request a sync. self.addEventListener(‘sync’, () =>{}) to carry out the sync
(Working Draft) https://www.w3.org/TR/service-workers-1/ Is Service Worker Ready? https://jakearchibald.github.io/isserviceworkerready/ Offline Cookbook (Caching Strategies) https://jakearchibald.com/2014/offline-cookbook/ Google’s reference for “Amazing Web Experiences” https://developers.google.com/web/fundamentals/
News Readers as PWAs (PWAs using different frameworks) https://hnpwa.com/ Web Push Book https://web-push-book.gauntface.com/ Demo https://github.com/jamesmaciver/dddscot-demo
jamesmaciver
mii3king
ogaclejapan
bigmuramura
kkamegawa
stknohg
lycorptech_jp
nagisa53
nenonaninu
ysakotch
fnifni
miichan
maruto
marcelosomers
rmw
sstephenson
yeseniaperezcruz
mza
kneath
addyosmani
panda_program
sergeychernyshev
maggiecrowley
destraynor
reverentgeek
