This workshop has already been published as a course!
Progressive Web Applications and Offline
By coding along with us in the Workshop, you'll:
- Learn how to audit a web application for "Progressive Web Fitness" with Lighthouse, and to measure important performance metrics like "time to first load" and "time to interactive"
- Take a "classic" client-side-rendered single-page app, and make it work offline, without changing a single line of the app's code
- Get hands-on experience with IndexedDb, a worker-friendly nosql database that's built in to most browsers
- Build an example of the App-Shell architecture, where large portions of the UI load almost instantly
- Walk through a proper HTTP/2 server-side rendering setup, by putting nginx in front of node.js
- Learn how to apply Rollup and Prepack to your code, to shrink your production bundles down as much as possible
Your (Awesome) Instructor
Spend A Full Day Immersed With Mike North and Steve Kinney
Progressive Web Apps become superheroes when they can, while still providing a great baseline experience on less modern browsers. They're reliable, fast, engaging, and although they can do many of the things users expect from native apps, they don't take up a lot of space, or require a long install process. In this workshop, we'll begin with a "classic" single page app, that's a bit bulky in size, has a slow initial load, doesn't work offline, and provides a very "basic" mobile web experience. We'll then enhance it in several ways, so that when key technologies are supported in your users' browsers, their experience ends up being substantially better! First, we'll add any mobile-specific metadata to the app, and look at how we can use android studio and the iOS simulator to test out our improvements. In order to reduce our page weight a little bit, we'll discuss how to choose between image types like png and jpeg, and some recent advances in compression. Next, we'll add a service worker, and apply a few caching strategies to ultimately allow our app to work offline! Additionally, we'll take advantage of IndexedDb, so that new data created on a mobile device can be stored as a structured record, available both in our application and service worker scopes. Finally, we'll work on reducing our initial page weight, by applying code splitting, and reduce the size of our bundles with Rollup and Prepack. In the end, our "classic" app will load quickly on the first visit, and nearly instantly for every visit thereafter!
We've already held over 150 workshops with thousands of attendees in-person and online. In this time we've discovered ways to schedule the day, so it goes smoothly and efficiently. Regardless if you're in-person or participating with us online you'll have the full ability to replay things you missed, get your questions answered LIVE and interact with the teacher throughout the day.
- 9:30AMWelcome and Setup
- 9:45AMFrom MPA to SPA to PWA
- 10:15AMAudits and Instrumentation
- 10:45AMExercise: Progressive Web Examples
- 11:00AMHTTP Caching
- 11:30AMUsing AppCache (responsibly)
- 12:00PMExercise: Appcache
- 12:30PMService Workers
- 2:00PMExercise: Service Workers 1
- 2:30PMService Worker Cache APIS
- 3:00PMExercise: Crushing Caches
- 3:30PMBasic IndedDB
- 4:00PMExercise: IndedDB IDB
- 5:00PMIndexes, Version Migration and IndexedDB 2.0
- 6:00PMExercise: IndedDB2.0 and Migrations
- 6:30PMRecap and Wrap Up
- 9:30AMWelcome and Recap
- 9:45AMMobile and Social Metadata
- 10:15AMExercise: Mobile Web, as an APP!
- 10:45AMPush Notifications
- 11:00AMPayment Processing
- 11:30AMBackground Tasks
- 12:00PMExercise: Background Processes
- 12:30PMBuilding Improvements: Tree Shaking
- 2:00PMExercise: Tree Shaking
- 2:30PMBuilding Improvements: Partial Evaluation
- 3:00PMExercise: Partial Evaluation
- 3:30PMCode Improvements: A V8 Primer
- 4:00PMExercise: Constant Shakes and Hot Functions
- 4:30PMNetwork Improvements: HTTP/2
- 5:00PMAPP Shell
- 5:30PMExercise: APP Shell
- 6:00PMExercise: PRPL
- 6:30PMWrap Up
Interact with the Instructor - Online & In-Person
Is This Workshop for Me?
This workshop is for people who want to bring their web applications to the next level, and leverage the full current offline capabilities to their fullest extent.
2 Full Day Workshop Sessions
Replay Videos (available immediately)
July 27 to 28, 2017 - 9:30am to 5:30pm Central US Time
Option 1: Attend online on our full HD live stream
Option 2: Attend in-person at HQ in Minneapolis, MN