Hello and welcome! my name is Amulya and you are watching TubeMint. In this video I am going to show you another progressive web app example.
So, I just converted this website to progressive web app. This one www.tubemint.com and I am already online, just trying to pull up this website on my android phone.
I am using Google Chrome to demonstrate to this website, also, because Google chrome give and supports all PWA features.
So, after converting your website to PWA, you starting getting “Add to Home Screen” banner at the very bottom of your mobile screen.
This pop-up/banner pulls up the website favicon and adds the text “Add to Home screen”, which completely customizable.
In case, you want to try or optimize your website for iPhone and iPad, there are other things, things need to be done in order make your PWA iPhone and iPad compatible.
I just tapped on the “Add to Home screen” banner and this PWA should be installed on my home screen.
You would see the download arrow on the very top left of the screen. And a notification about app shortcut has been added to the home screen.
I am get out of the browser and if I go offline now. I just turned off the mobile data, and my wi-fi is already off.
Here is the PWA shortcut icon, which just got installed.
And when I press and hold on it, you can see I am getting all the options that I generally get on any native application installed from Google play store.
The other thing, I would like to clarify is that you do not need to deploy your PWAs onto any app store like Apple app store, Google play store, or Microsoft Windows play store.
This directly works from your existing web hosting server and PWA features are added to any existing websites, on the existing web server.
So, you are getting all the options, that you get a native app, when you press and hold it.
Like: Uninstall App, Sleep Mode, and App info like native app.
Now, I am going to launch my PWA, by tapping on it and it will launch.
Remember I am off-line.
And now, I’ll go ahead and view few of the posts as well. And you can see PWA loads the blog post and could not load the video, which is embedded from YouTube.com.
So, the content that is being loaded off-line, is actually stored on my device.
Now, I am going to try to load another blog post as well. Ok, so, it is loading pages/posts off-line.
So, these are the features and benefits, and this is why companies are promoting PWAs, companies like Google, Microsoft, and other companies as well.
To uninstall the PWAs, just tap and hold the shortcut icon and tap on uninstall.
So, this is how the PWAs work offline. The benefit that get from PWA is SEO benefit.
You start ranking higher on smart devices like Android, iPhone, tablets, and iPad as well.
The other benefits is that your users get faster page load on their smart devices. And this also loads fast on slow internet connection.
So, that is the main benefit of PWA.
This only benefit I converted my websites to PWA is basically I want to rank to higher on smart phones.
And my websites are already ranking higher on smart phones and tablets as well.
And that is it for this video.
I you need help with PWA, please leave your question below and reach me at [email protected]