The PubCon PWA Puts the Schedule in Your Pocket Even When the Wi-Fi Fails
Last Updated -
This week I am speaking at PubCon Las Vegas. This is my first time to attend this event or any online marketing conference, so there is much to learn, experience and compare to my developer event experiences.
Being a seasoned veteran of conferences, one thing I know is important is having the schedule handy. You could carry around a printed schedule, but that is so analog.
Today everyone has a phone in their pocket that of course is a powerful computer. Each one of those phones has a browser, which can load any progressive web app. So, let's have a conference schedule application to make the schedule available to the attendees at all times.
That is why I decided to build a simple PubCon Scheudle PWA.
I did this for the Spring 2018 Philly Code Camp if you recall. This gave me a shell to work with, I just needed to the conference schedule data, which Brett gladly supplied.
So, in the margins of my time the past few days I have created a PubCon Schedule progressive web application.
PubCon PWA Features
The PubCon PWA has two types of data, sessions and speakers. The home page serves as a list of sessions. There is also a speakers page.
Each of these pages allow you to scroll through the list to find your favorite sessions and speakers.
Speaking of favorites...
If you plan on attending a session or want to attend a session, each session card, and its detail page, has a little star. You can tap the star to toggle the session on an off your list of favorites.
Each session has a button you can click/tap to see the session detail.
Each session lists the speaker(s), which are linked to the speaker's profile page.
In all there are around 210 unique pages in the site, which is a nice, small footprint.
Working Offline
If you are like me, you know conference Wi-Fi is notoriously bad. In fact, I cannot even connect to the Las Vegas Conference Center's network.
The entire application works offline. That's right as long as you can load the first page you have the entire application installed.
No, this is not a SPA. If you know me, you know those are more or less dead thanks to progressive web apps.
When you first visit the site the service worker is registered. Next it goes through the registration life cycle, which I plugged in a workflow to download the conference data, site templates and render all the pages.
The rendered pages are then added to the service worker cache. The service worker's fetch event handler checks if a request is cached before it hits the network.
This means any page you request after you initially visit the application will come from the local cache, not the network, even if you are online.
The time it takes to render the entire site once the files are fetched is about 1-2 seconds and it happens in the service worker, off the UI thread.
Now, even when the conference Wi-Fi is unavailable and your cellular connection is not reliable the PubCon schedule still works!
Installing the PubCon PWA
You won’t be pestered to install up front, but the second page request will trigger a prompt. From there you can install using the native install experience if it is available or you can manually do it if you are on a less capable platform like an iPhone.
No worries if you don't add to homescreen, the application is all there.
Summing it Up
If you have not heard about progressive web apps before and are participating in PubCon then this is a easy way to experience one.
The application is simply compared to many I have built over the years. There is so much more you can do with the modern web than just work offline.
I will be doing a Progressive Web Application session with Aleyda Solis Thursday morning at 10:10 in Salon E. It will be a very high level session and I plan on doing demonstrations more than slides, so it should be very engaging.