A progressive web application is a type of application software delivered through the web, built using common web technologies including HTML, CSS and JavaScript. It is intended to work on any platform that uses a standards-compliant browser.

1. SEMINAR
ON
PRESENTED BY
KASIREDDY SAI KIRAN
17NT5A0506

2. Contents :
 What is PWA ?
 How PWA Works ?
 Who Developed PWA ?
 Key Features of PWA ?
 Benefits of PWA ?
 Example of PWA ?
 How to Add PWA to Homescreen ?
 Technologies Behind PWA ?
 How Service Worker Works ?
 Advantages of PWA Apps
 Conclusion
 References

3. What is PWA ?
“Progressive Web App (PWA) is a term used to denote a
new software development methodology. Unlike
traditional applications (Native Apps ), progressive web apps are
a hybrid of regular web pages (or websites) and a mobile
application. This new application model attempts to combine
features offered by most modern browsers with the benefits
of mobile Experience.”
 Progressive Web Apps, also known as Installable Web Apps or
Hybrid Web Apps.

4. How PWA works ?
 Minimum Requirements : Html, CSS, Javascript.
 Depends on OS
 When you Connect with Web Site
> Install Banner/ Properties
> Add to Shortcut
> PWA working as a native/ hybrid apps.
 Example Website : www.flipkart.com (check On Your Mobile
Phone)

5. Who developed PWA ?
In 2015, Frances Berriman and Alex Russell coined the term
"Progressive Web Apps" to describe apps taking advantage of
new features supported by modern browsers, including service
workers and web app manifests, that let users upgrade web apps
to progressive web applications in their native operating system
(OS)

6. Key Features of PWA ?
Progressive Web Apps are user experiences that have the reach of the
web, and are:
 Fast
 Reliable
 Engaging
This new level of quality allows Progressive Web Apps to earn a place on the
user's home screen.

7. Key Features of PWA ?
Fast
Respond quickly to user interactions with silky smooth animations and no
janky scrolling.

8. Key Features of PWA ?
Reliable
Load instantly and never show the dinosaur, even in uncertain network
conditions.

9. Key Features of PWA ?
Engaging
Feel like a natural app on the device, with immersive user experience.

10. Benefits of PWA ?
 Short loading time than the Native App
 Good performance in poor network conditions
 Small in size
 App-like features (add to home screen, offline mode, push notifications)
 avoid app Stores (Google Play, App Store, etc.)
 Instant updates

11. Example of PWA App ?

12. How to add PWA to Homescreen?

13. Technologies Behind PWA ?
Service Workers :
A JavaScript file that runs separately from the main browser
thread (XML Http Request), intercepting network request caching
or retrieving resource from the cache and delivering push
messages.
Web App Manifest File :
A JSON file that gives you the ability to control how your app
appears to the user in areas where they would expect to see
apps, direct what the user can launch, and define its appearance
at launch.

14. How Service Worker Works ?

15. Advantages of PWA Apps
 Cost – The cost of building a PWA is less than that of a mobile (Native )
application.
 Progressive – Works for every user, regardless of browser choice because
they’re built with progressive enhancement.
 Responsive – Fit any form factor: desktop, mobile, tablet, or forms yet to
emerge.
 Connectivity independent – Service workers allow apps to work offline or
on low-quality networks.
 App-like – Feel like a native app to the user with app-style interactions
and navigation.
 Fresh – Always up-to-date thanks to the service worker update process.

16. Advantages of PWA Apps
 Safe – Served via HTTPS to prevent snooping and ensure content hasn’t
been tampered with.
 Easy Discovery – Are identifiable as “applications” thanks to W3C
manifests and service worker registration scope allowing search engines to
find them.
 Re-engageable – Make re-engagement easy through features such as
push notifications.
 Installable – Allow users to “keep” apps they find most useful on their
home screen without the hassle of an app store.

17. Conclusion
In These Present Days the Native Apps are Taking a Huge
Storage space to use in our Mobile Apps instead of Progressive
Web Apps have immense potential and are evolving the mobile
web scene. Time will decide whether PWAs will take over a native
mobile app or not but it has definitely created its space in the
mobile web.

18. References
 https://blog.pusher.com/introduction-progressive-web-apps/
 https://www.techuz.com/blog/progressive-web-apps-the-
future-of-mobile-web-app-
development/#:~:text=Conclusion,space%20in%20the%20mo
bile%20web.
 https://divante.com/pwabook/chapter/01-introduction-to-
pwa-technology.html#what-are-progressive-web-apps

19. ANY QUERIES ???

20. THANK YOU