Engineer Sushil Kumar Sushil Kumar Profile
Progressive Web Apps, or PWAs, have been around for some time, but only lately it has become a buzzword. Everyone is talking about it, but is it just a fad, or a future of the web?
What is a PWA?
Progressive web apps are a hybrid between web pages and native apps. The application type attempts to combine features offered by most modern browsers with the benefits of mobile experience. But underneath, PWA is still just a website. It can “become” an app if user wants to use it that way. So if user returns to the website, using supporting OS and browser, he will be prompted to add the website to the home screen. If he decides to do it, he can use the website as an app later on. If not, the website is still reachable through the browser, and still with most of the benefits that make PWA’s great.
- Reliable – Load instantly and never show the downasaur, even in uncertain network conditions. aka: work offline.
- Fast – Respond quickly to user interactions with silky smooth animations and no janky scrolling.
- Engaging – Feel like a natural app on the device, with an immersive user experience.
Working offline, what kind of sorcery is that?
Service workers. They are the heart of every PWA. Service worker is a script that runs in the background, separate from the web page. It is responsible for caching, content updates, push notifications and makes it possible for the PWAs to work offline. Basically, service workers can intercept and handle network requests, serving assets from the cache if needed.
In most cases, PWAs will be single page app, and on the first load, the Application shell will be stored in the cache.
What is an Application shell?
Application shell is minimal HTML, CSS and JS needed to render the UI of your website. It should contain only UI elements, without any dynamic data. As it is stored in the cache on the first load, every subsequent time that user opens the app (or the website), UI will load immediately, making PWA fetch only dynamic data.
OK… How do I install the app?
You don’t. It is not actually an installation. There is an “Add To home screen“ feature, so users can add a shortcut to your website on their smartphone home screen. It looks and behaves like a native app. Once opened, it will load with the splash screen loader and without browser UI. To enable “Add to home screen” feature, your PWA will need app manifest.
App manifest?
Yes. Web app manifest is just a simple JSON file that gives you the ability to control how your app appears to the user in the areas that they would expect to see apps (for example the mobile home screen), direct what the user can launch and more importantly how they can launch it. This includes app name, various icons and sizes, splash screen background, etc.
PWAs don’t work on Apple devices, so it’s all useless?
Service workers and web app manifest don’t work in Safari at the moment, but are currently in development. That means that we’ll soon have PWAs in all their glory on all devices.
But until then, PWAs work just fine on your iPhones. Like any other regular website. Even better.
That’s all fine, but what about Magento?
Well, Magento is, in fact, working on their PWA studio. It should be released as a part of Magento 2.3. sometime later this year. It will be based on React and Redux.
In the meantime, there are couple of community efforts, such as Deity or Vue Storefront.
What about Inchoo and PWA?
We recognized PWAs as a future default, just as we did back in the days when Responsive Web Design emerged, and we are prepared for this (r)evolution. PWAs have been in our focus for some time now and that’s why we partnered with Deity in order to bring next generation web apps to the merchants who want to stand out from their competition. If you are thinking about running your online business as PWA, we’re at your service.
As a part of our efforts in leveling up our skills, Inchoo delegation will attend Reacticon, the first Magento conference completely dedicated to PWAs, so if you are attending too – get in touch!
Who’s Deity?
First time we heard about Deity was at Meet Magento Poland 2017 in Krakow where The Rake case study was presented. That presentation attracted a lot of interest and we started following the progress. When we got an invitation to become a partner, we didn’t hesitate too much.
We have a feeling that Deity project went farther than announced Magento PWA Studio. Who knows, perhaps Deity could actually become an official PWA Studio. We expect a lot of excitement in the next couple of months!
The post Progressive web apps – the future default appeared first on Inchoo.
