PWA vs html5 webapp?

Question

I know that the most Iconic feature of PWA are

• Service Worker: which make user can use the app offline from cached resources
• Add To Home Screen: With this feature, user can add a shortcut of the app on their mobile home screen, to get a experience like interacting with a Native App(But there still a huge different, in my opinion)
• etc.

However, I can do like all of them on about 6/7 years ago by using the HTML5 technology at that time, I know that service worker comes recently but there also was "HTML5 App Cache, as well as the Local Storage, Indexed DB, and the File API specifications." can do similar things.

Is there anyone can explain what's the difference between PWA and HTML5 webapps? or they are just the in term of same? or a similar concept but different implementation? or PWA is the (next gen/extension) of HTML5 webapp?

I might have some misunderstanding on PWAs, since I am new to this term, Thanks.

Answer 1

If keep it simple PWA is ordinary site with 3 additional features.

1. responsive design - site should look well on all devices
2. manifest.json - site must have general description about itself stored in manifest.json
3. caching - site must work offline

I believe 1 and 2 is easey. And 3 is realy what PWA is all about. So the question is: how we can provide offline support?

First problem is how we can get our initial .html .css and .js files without internet connection? Answer is: we should use service worker or App Cache. But App Cache has a lot of problems and probably will be deprecated, in other hand service worker under developement and become better each month. You can read more about their difference here.

Second problem is how we can get server data without internet connection? We should store most vital data somwhere. But after we get our .js file from cache we have access to Local Storage, Indexed DB etc. So we can store vital data in any of this storage while we online and get it back from them when we offline. It is totally up to you how you will handle that.

I believe there no cleare and strict defentiton for PWA and HTML5 webapp (at least for now). So you can asume it is the same but today PWA is more common word.