The Secret Source 2018 Hackathon – Progressive web apps
This past April 27th we celebrated our second Hackathon. In this last edition we dove off the deep end into Progressive Web Apps. For those of you new to the concept, a PWA bridges the gap between a web site and a mobile (native), installable app. In our opinion, it is the future of web development. The most compelling feature is the ability to behave like a mobile app after a visit to the site and “installing” it on your phone. The business case for PWAs is very compelling.
Our approach at the hackathon is to come in knowing almost nothing about the topic at hand, and then spend the day learning about it by following tutorials and trying to build something. Throughout the day we also stop and share our experiences over coffee. We end the day by sharing our projects and making note of what we learned, our struggles, and the “ah ha!” moments.
To support the learning, we also created two repositories where participants could download a completely static web site and a WordPress site with the intention being that they convert these sites into Progressive Web Apps. In general, we were only barely able to get the static site to support some basic PWA features and no one managed to get to the WordPress site.
In the case of PWAs, there’s no question in our minds that they are the future. For me, personally, the main feature they bring to the table is the ability to use a web site off line, and it actually works. Wow! But there are more features and advantages like the improved load times, splash screens, push notifications, access to the camera, etc. We were also impressed with how relatively easy it was to write the JavaScript necessary to enable caching. However, like anything, successful implementation of caching requires planning and forethought (caching can be a very complex subject).
There was only one feature that we found that is keeping us from requiring PWA support in all of our work: POST requests cannot currently be cached by ServiceWorker (or at least, that’s how we understood it – remember, we spent one day learning this…). Since all of our work is for clients and not our own software products, we have to choose technologies that are widely supported, feature complete and don’t require much custom code to work. PWAs are almost there, very close. We will definitely start implementing very, very basic features (such as installable and custom offline pages) but it’s going to be a while before we enable Contact Us forms.
In the ServiceWorker engineers’ defense, there are plenty of examples of POST requests being handled off line, so, it is possible. It’s just going to be a while before we take the dive on behalf of our clients.
In the end, it was an awesome day. We learned a lot and feel empowered to start incorporating PWA features in all of our projects. We also think it is the kind of work our clients will be happy to pay for as it will positively impact their bottom line in every case.
Interesting Links
- Jake Archibald does a great overview of what a Service Worker is (although this video is already 2 years old, so, the details may have changed).
- Google PWA introductory tutorial (several Progressive web app hackathoners followed this tutorial)
- Sample PWA apps
