Progressive Web Apps for Better eLearning

We’re always investigating the latest digital trends, to see if they can improve learning technology. Progressive Web Apps are all the rage right now, so we had to give you the lowdown.

What are Progressive Web Apps?

A Google Chrome developer called Alex Russel coined the term Progressive Web App (PWA), but it all started out with Apple and the original iPhone. When they released their iPhone in 2007 there wasn’t an app store, they instead wanted developers to build web apps that could be installed through the built-in Safari web browser. Developers weren’t so keen though, and only 4 months later Apple announced the App Store and a software development kit that mostly replaced web apps for iPhone.

After that, web apps fell to one side – that is, until HTML5 and JavaScript improved. In 2015 Google spearheaded a new push for web apps to be used on mobile and desktop, including their new operating system Chrome OS. Web apps could become Progressive Web Apps by including features like Service Workers and Web App Manifests which allows these apps to do more than web apps ever could originally.

Chrome is continuing its effort with PWAs and is constantly adding new features to Chrome. For example, you can now share images from your PWA in the same way that you can share images from any other app.

What can they do for me?

A PWA is like a website with extra steps. They can be installed like regular apps but are cheaper and quicker to build than a native application. There are a few limitations compared to native apps though, some of which will likely be deal breakers for many developers. However, the capabilities of PWAs are constantly improving.

Using HTML5, CSS3, JavaScript ES2018, and now also WebAssembly, developers can create amazing applications that work on every operating system and device. Here are some examples of PWA’s that make clever use of the format:

  • Squoosh is a web app that can compress images using web technologies and the latest codecs.
  • Figma is a powerful and collaborative design tool build using Web Assembly to make it as fast as a native application.
  • Proxx is a game similar to Minesweeper that can be played on any desktop or smartphone, and it’s tiny at only 25kb for the initial load. You can read more about it in the announcement post

Web browsers are being continuously updated to add new features like Bluetooth, access to USB connected devices, notifications, and offline storage. You can follow the statuses of Chrome, Safari, and Firefox to see upcoming features.

A huge advantage is that you can write one app and make it available to people on so many platforms. Your PWA can run on Android, iOS, iPadOS, Windows, macOS, Linux, and Chrome OS which makes it accessible to a massive audience.

What are the drawbacks?

The biggest disadvantage of PWAs (in my opinion) is that their available features are limited to those of the web browser used to install it. In comparison, native applications can get permission to make use of most of the device’s features. For example, notifications are available in Chrome on Windows and Android but not in Safari on iOS. You’ll want to keep things like this in mind when thinking about choosing to build a PWA over a native app.

When you’ve finished building your PWA and are about to submit it to the app store, better get ready for the long processing times and a chance of rejection. Well hold on a second, these are PWAs! All you need is an install button on your website. Clicking it will get your app installed in seconds without ever having to submit anything to the app store, and your user can get started with using your app even sooner. But, if you still want to submit it to the Apple App Store, there is a good chance it would get rejected.

Apps that provide core features and functionality dynamically with web technology like HTML5 are best delivered to everyone in Safari, rather than through the curated App Store.

iOS has some of the biggest limitations currently. You can’t send the user push notifications, can’t run processes in the background, and are limited to up to 50MB of storage (which will be cleared if the user doesn’t open the app for a few weeks).

Google has been one of the key players in deciding what directions PWAs should head, and therefore Chrome support for new features is much better than other browsers.

Microsoft Edge is lacking in many of the features that are available in Firefox and Chrome. This should be improving soon as Microsoft are developing a new version of Edge that is built on Chromium, which is what Google Chrome, Brave, and Opera are built on.

What does this mean for elearning?

If you have had an elearning website built for training users, then there’s a good chance that it can be converted to a PWA with relative ease. Content can be synced to be viewed offline which is not possible with regular websites and even with the storage limit imposed on each platform, a course’s content should all fit as long as images are compressed properly.

Web technologies are getting faster and more featureful all the time (Chrome gets updates every month or so) and with WebAssembly becoming the fourth language of the web, new web apps are able to be faster than ever. Figma is one of the first big web apps to be using WebAssembly and it feels almost like a native program.

With accessibility and flexibility being a key advantage of elearning, it’s likely that PWAs will be used more and more. Being user-friendly and dev friendly (as well as budget-friendly) they may become the first choice for many learning applications. That’s not to say native apps and platforms will be made redundant – rather PWAs are a useful new tool.

What next?

The web is constantly evolving and it’s doing so at a rapid pace. Some of the things talked about in this blog might be out of date by the time you read this.

It’s always worthwhile investigating new and emerging technologies. PWAs may help to efficiently distribute elearning materials, particularly among user bases with diverse forms of web access and unreliable connectivity. Furthermore, the ease and speed of development may mean that materials may be developed that were previously out of budget or scope.

Nonetheless, as with other enticing new digital prospects, PWAs are not likely to be a magic bullet. Effective behaviour transformation and skills management will always result from a studied, consultative approach that seeks measurable outcomes. Emerging web technologies can form a part of this approach, but won’t be effective outside of a strategy based on set goals and studied cognitive insights.

If you want to hear more about how PWAs and other technologies can create effective learning solutions for your organisation, get in touch here and we’ll help you transform your training.