glennjones / extending-the-offline-web

Extending the offline web experience - asyncjs talk

Extending the offline web - asyncjs talk

This repo contains material created for a talk given at async.js on Thursday 23 June 2016.

Install node app to run slide deck

• Install node.js
• Clone or download this repo to your local machine
• In a command line move to the projects parent directory
• $ npm install
• $ node app
• The slide website can then be accessed from http://localhost:3030/slides/
• The web worker code examples from http://localhost:3030/code/

Reading and watching list

Offline

• Jake Archibald IO2016 talk - outline what can current be achived with Service Workers
• Ben Kelly PWASummit slides - Support for progressive web apps in Firefox
• Andreas Bovens PWASummit slides - Opera's Perspective

Push

• Pete LePage IO2016 talk - user engagement with web push notifications

UX, design and research

• Tal Oppenheimer PWASummit talk - designing for emerging markets
• Thao Tran PWASummit talk - mobile landscape
• Nate Schloss IO2016 talk - Facebook's UX learning for web Push
• Progressively less progressive - Andrew Betts blog post on state of PWA
• Progressive web apps and our regressive approach - Christian Heilmann blog post

Data and sync

• Beyond progressive web apps part1, part2 and part3

Case studies

• Googles case studies

Sites

• PWA rocks - Lists example progressive web apps sites
• IO2016 - Offline conference website
• Washington Post - Offline web app with fast render speed
• Aliexpress - Offline web app only on mobile UA
• Telegram - Offline messaging app.
• Pokedex - Demo of webapp with Service Worker, PouchDB, virtual-dom, and web workers by Nolan Lawson
• Wiki offline - Demo by Jake Archibald
• Trained to thrill - Demo by Jake Archibald

Resources

• The Service Worker Cookbook - Mozilla's collection of working, practical examples of using service workers
• Offline cookbook - Jake Archibald list of examples
• Is service worker ready - Browser compatibility
• Service Worker API - MDN API reference
• Chrome dev
• Introducing Pokedex.org - Blog post Nolan Lawson on how he built Pokedex webapp
• Progressive Web App Summit 2016 - playlist on youtube
• Web and Chrome at Google I/O 2016 - playlist on youtube

Tools and libraries

• ManifeStation - automatically build web app manifest from web page metadata
• upup - simple library offline.html page to your site
• Lighthouse - Chrome, tools forauditing and performance metrics for Progressive Web Apps
• sw-precache - Chrome, a module for generating a service worker that precaches resources
• sw-toolbox - Chrome, a library provides common caching patterns
• sw-helpers - Chrome, a collection of libraries that help enhance your existing service worker
• Lunr.js - offline free text search
• Nedb - the query engine from nedb
  
• Geolib - nearby search
• LocalForage - data persistence
  
• Elasticlunr - Extended faster version of lunr.js
• IndexedDB Promised - Promises wrap of indexdb
• Dixie.js - Wrapper for indexdb
• Pouchdb - Universal db with sync
• Hoodie - Offline-first architecture for web apps
• Pusher - Realtime messaging (SaaS)
• Firebase - Realtime messaging and synced db (SaaS)

Streams

• Jake Archibald PWASummit talk - advanced use of streams with Service Workers
• Streaming template literals - advanced topic on streams and tmeplates