Mosa Lefu: Wrapping My Head Around Progressive Web Apps

Hello fellow developers, my name is Mosa Lefu. I am a junior mobile apps developer aspiring to be a top software developer in South Africa.

Have you ever noticed that most of the people leave the web pages not because they do not find them interesting but simply because they take time to load? Imagine waiting for a minute for a page to load, I mean even 30 seconds is a lot. Downloading an app is not that bad but sometimes we just do not have the time to wait for downloads and installations. How cool would it be if one could just add an app within a second to a homescreen without going through the process of installation?

Progressive Web Apps(PWAs) do not need to be installed they are like websites and are accessed like one but PWAs can work even if you do not have any signal. They fit any form factor, always up-to-date and uses HTTPs for security. Before we get into more details lets first understand what are PWAs:

PWAs are web applications that uses the latest technologies. They are regular web pages but can appear to users like native mobile applications. The PWAs provide the user with an app-like experience. They combine the best of the web and apps. The most interesting part about this kind of an app is that it can work wherever you are, you do not need to have internet access to access it.

To develop them requires service worker and APIs such as the cache storage API or IndexedDB. With service worker PWA can precache parts of a web so that it loads within a second the next time a user opens it.

Using a service worker gives PWAs the ability to prevent and to be able to handle network request. However PWA can run without a service worker. Also the PWA tend to be architected around an application shell. I'm not going to dwell much on this but in passing app shell contains local resources that your web app needs to load the user interface so it works offline.

For the first time when i got to learn about PWAs myself it was pretty interesting. The discovery thereof was overwhelming. I have developed a webpage before and a mobile app, but this was different altogether, being able to mix web and app in one bowl made it pretty interesting and the fact that it is faster than any of the two. I have had challenges along the way, like registering service worker. This was challenging but fortunate enough I got the hang of it.

In Order for one to develop a Progressive Web App an ability to create a website is needed and the knowledge of CSS, HTML, JavaScript as well as Version Control tools. Also the understanding of a lighthouse which is an open source, automated tool for improving the quality of web pages. Lighthouse enables a developer to check if the website is working as a PWA and gives you scores out of hundred to guide you.

The benefits of PWAs are that it is fast, reliable, fresh, app-like and engaging. They are fast and load instantly, researches shows that 53% of users leave a site if it takes more than 3 seconds to load, 53% that is more than half. Meaning that most of the users can engage with a web page if it loads within a second. It is reliable it can load without a network connection.

I would call it fresh because it is always up-to-date. App-like because the app shell model separates the application functionality from application content. Lastly but not least it is engaging because it is live on the user’s home screen.

One may wonder what is the fuss about. What is the future with it? The thing is, the PWAs are the future and are what users are looking for. We are moving into faster things and users are used to the idea of getting things faster.

PWAs cut down on the number of users abandoning your website. If you want to increase the number of people who visit your website the PWAs is the way to go. Big leagues like twitter are moving into PWAs so should you. There is nothing to lose but more to gain.