SlideShare a Scribd company logo
Progressive Web App
(PWA)
{Intro}
By: AKASH
Agenda
Overview
Technologies Behind
Basic Need
App Shell
Storage
Service Worker
Caching Strategies
Web App Manifest
Overview
Progressive Web App (PWA) is a term used to denote web apps that use the latest web
technologies. Progressive web apps are technically regular web pages (or websites) but
can appear to the user like traditional applications or (native) mobile applications.
This new application type attempts to combine features offered by most modern
browsers with the benefits of mobile experience.
Technologies Behind
Service Workers
A JavaScript file that runs
separately from the main
browser thread
(XMLHttpRequest),
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.

Recommended for you

Why Progressive Web App is what you need for your Business
Why Progressive Web App is what you need for your BusinessWhy Progressive Web App is what you need for your Business
Why Progressive Web App is what you need for your Business

Progressive Web Apps (PWAs) are web applications that have responsive designs, work offline, and can be installed on a user's home screen. Key features of PWAs include being responsive across devices, working offline through service workers, being discoverable through web app manifests, automatically updating, using secure HTTPS connections, and allowing users to re-engage through push notifications and installing on home screens without an app store. PWAs provide faster experiences for web users compared to regular websites and allow developers to engage users similar to native mobile apps.

web designonline businessdesign
Progressive Web App
Progressive Web AppProgressive Web App
Progressive Web App

“Progressive Web Apps (PWAs) are web applications that load like regular web pages or websites but can offer the user functionality such as working offline, push notifications, and device hardware access traditionally available only to native mobile applications. PWAs are an emerging technology that combine the open standards of the web offered by modern browsers to provide benefits of a rich mobile experience”

pwaangular pwaprogressive web app
Progressive Web Apps are here!
Progressive Web Apps are here!Progressive Web Apps are here!
Progressive Web Apps are here!

Progressive Web Apps use modern web capabilities to deliver an app-like user experience. They evolve from pages in browser tabs to immersive, top-level apps, maintaining the web's low friction at every moment. They are reliable, fast, engaging and delivering amazing UX to end users. And they are here! The slides are from my talk at http://2018.symfonycamp.org.ua/

pwaprogressive web appsjavascript
Basic Need
Project
HTML
JavaScript
Chrome Extensions:
Web Server (Run project on local machine)
Lighthouse (Testing the app)
App Shell
The application shell is the minimum HTML, CSS and JavaScript required to power a
user interface. A native mobile application includes the application shell as part of its
distributable, whereas websites ordinarily request this over the network.
Storage
Local Storage
Easy to User
Synchronous
Not Transaction
Support Most of the
Browser
Caches Object
Easy to use
Asynchronous
FAST
Not Transaction
Not Support in Most of
the Browser
IndexedDB
Complex Data
Asynchronous
Fast
Transactional
Support in Every
Browser
Service Worker
A JavaScript file that runs separately from the main browser thread (XMLHttpRequest),
intercepting network request caching or retrieving resource from the cache and delivering push
messages.

Recommended for you

Pwa demystified
Pwa demystifiedPwa demystified
Pwa demystified

Progressive Web Apps, also known as Installable Web Apps or Hybrid Web Apps, is the latest industry trend helping businesses create more engaged and loyal customers by presenting regular web pages or websites as traditional applications or native mobile applications to the users.

progressive web appsinstallable web appshybrid web apps
Pwa.pptx
Pwa.pptxPwa.pptx
Pwa.pptx

Progressive Web Apps (PWAs) provide an app-like user experience through the use of features like service workers, web app manifests, and push notifications. They load instantly, work offline, and can be installed on the home screen without an app store. Service workers act as a proxy to cache resources, enabling fast and reliable performance even in uncertain network conditions. PWAs are responsive across devices and browsers, and feel natural on each platform due to their immersive, app-like interfaces.

pwaprogressivewebappweb
Progressive Web Apps
Progressive Web AppsProgressive Web Apps
Progressive Web Apps

A Progressive Web App uses modern web capabilities to deliver an app-like user experience. Progressive Web Apps bring features we expect from native apps to the mobile browser experience in a way that uses standards-based technologies and run in a secure container accessible to anyone on the web.

progressive web appsjavascriptpwa
Service Worker Life Cycle
Caching Strategies
Cache first, then Network
Network first, then Cache
Cache Only
Network Only(Not Caching Strategy)
Cache and Network Race
Cache and Network
Web App Manifest
The web app manifest is a simple JSON file that gives you, the developer, the ability to
control how your app appears to the user in areas where they would expect to see apps
(for example, a mobile device's home screen), direct what the user can launch, and
define its appearance at launch.
Questions?

Recommended for you

PWA
PWAPWA
PWA

A Progressive Web App (PWA) is a web app that uses modern web capabilities to deliver an app-like experience to users. These apps meet certain requirements, are deployed to web servers and accessible through URLs (on HTTPS protocol).

pwaprogressive web appservice worker
Progressive web apps
Progressive web appsProgressive web apps
Progressive web apps

Progressive Web Apps presentation for GDG Istanbul's Progressive Web Apps Meetup. I'm not a web developer or front-end developer but I tried to explain how PWAs work.

progressive web appspwamobile
Introduction to Progressive Web Apps (PWA)
Introduction to Progressive Web Apps (PWA)Introduction to Progressive Web Apps (PWA)
Introduction to Progressive Web Apps (PWA)

Progressive Web Apps (PWA) allow web applications to have app-like capabilities by being installable, load quickly, and work offline or on low quality networks. PWAs use service workers to cache assets and API responses so that the app is able to function with limited or no network connection. Other features of PWAs include being responsive and being able to re-engage users with push notifications. The document provides an overview of PWAs and their capabilities as well as links to learn more and examples of existing PWA implementations.

javascriptpwahtml5
Thank You

More Related Content

What's hot

Progressive Web Apps / GDG DevFest - Season 2016
Progressive Web Apps / GDG DevFest - Season 2016Progressive Web Apps / GDG DevFest - Season 2016
Progressive Web Apps / GDG DevFest - Season 2016
Abdelrahman Omran
 
Building a Progressive Web App
Building a  Progressive Web AppBuilding a  Progressive Web App
Building a Progressive Web App
Ido Green
 
Progressive web app
Progressive web appProgressive web app
Progressive web app
Deepak Upadhyay
 
Why Progressive Web App is what you need for your Business
Why Progressive Web App is what you need for your BusinessWhy Progressive Web App is what you need for your Business
Why Progressive Web App is what you need for your Business
Lets Grow Business
 
Progressive Web App
Progressive Web AppProgressive Web App
Progressive Web App
SaleemMalik52
 
Progressive Web Apps are here!
Progressive Web Apps are here!Progressive Web Apps are here!
Progressive Web Apps are here!
Antonio Peric-Mazar
 
Pwa demystified
Pwa demystifiedPwa demystified
Pwa demystified
edynamic
 
Pwa.pptx
Pwa.pptxPwa.pptx
Pwa.pptx
Harish Karthick
 
Progressive Web Apps
Progressive Web AppsProgressive Web Apps
Progressive Web Apps
Nitheesh T Ganesh
 
PWA
PWAPWA
Progressive web apps
Progressive web appsProgressive web apps
Progressive web apps
R. Caner Yıldırım
 
Introduction to Progressive Web Apps (PWA)
Introduction to Progressive Web Apps (PWA)Introduction to Progressive Web Apps (PWA)
Introduction to Progressive Web Apps (PWA)
Sandip Nirmal
 
Introduction of Progressive Web App
Introduction of Progressive Web AppIntroduction of Progressive Web App
Introduction of Progressive Web App
Sankalp Khandelwal
 
Why Progressive Web Apps For WordPress - WordCamp Finland
Why Progressive Web Apps For WordPress - WordCamp FinlandWhy Progressive Web Apps For WordPress - WordCamp Finland
Why Progressive Web Apps For WordPress - WordCamp Finland
Imran Sayed
 
Build progressive web apps with Angular
Build progressive web apps with AngularBuild progressive web apps with Angular
Build progressive web apps with Angular
Simona Cotin
 
Progressive Web Apps (PWAs): Why you want one & how to optimize them #Applaus...
Progressive Web Apps (PWAs): Why you want one & how to optimize them #Applaus...Progressive Web Apps (PWAs): Why you want one & how to optimize them #Applaus...
Progressive Web Apps (PWAs): Why you want one & how to optimize them #Applaus...
Aleyda Solís
 
Angular PWA
Angular PWAAngular PWA
Angular PWA
Vinci Rufus
 
Progressive Web Apps and React
Progressive Web Apps and ReactProgressive Web Apps and React
Progressive Web Apps and React
Mike Melusky
 
Progressive Web APP ( PWA )
Progressive Web APP ( PWA ) Progressive Web APP ( PWA )
Progressive Web APP ( PWA )
Bijaya Oli
 
Mobile application development React Native - Tidepool Labs
Mobile application development React Native - Tidepool LabsMobile application development React Native - Tidepool Labs
Mobile application development React Native - Tidepool Labs
Harutyun Abgaryan
 

What's hot (20)

Progressive Web Apps / GDG DevFest - Season 2016
Progressive Web Apps / GDG DevFest - Season 2016Progressive Web Apps / GDG DevFest - Season 2016
Progressive Web Apps / GDG DevFest - Season 2016
 
Building a Progressive Web App
Building a  Progressive Web AppBuilding a  Progressive Web App
Building a Progressive Web App
 
Progressive web app
Progressive web appProgressive web app
Progressive web app
 
Why Progressive Web App is what you need for your Business
Why Progressive Web App is what you need for your BusinessWhy Progressive Web App is what you need for your Business
Why Progressive Web App is what you need for your Business
 
Progressive Web App
Progressive Web AppProgressive Web App
Progressive Web App
 
Progressive Web Apps are here!
Progressive Web Apps are here!Progressive Web Apps are here!
Progressive Web Apps are here!
 
Pwa demystified
Pwa demystifiedPwa demystified
Pwa demystified
 
Pwa.pptx
Pwa.pptxPwa.pptx
Pwa.pptx
 
Progressive Web Apps
Progressive Web AppsProgressive Web Apps
Progressive Web Apps
 
PWA
PWAPWA
PWA
 
Progressive web apps
Progressive web appsProgressive web apps
Progressive web apps
 
Introduction to Progressive Web Apps (PWA)
Introduction to Progressive Web Apps (PWA)Introduction to Progressive Web Apps (PWA)
Introduction to Progressive Web Apps (PWA)
 
Introduction of Progressive Web App
Introduction of Progressive Web AppIntroduction of Progressive Web App
Introduction of Progressive Web App
 
Why Progressive Web Apps For WordPress - WordCamp Finland
Why Progressive Web Apps For WordPress - WordCamp FinlandWhy Progressive Web Apps For WordPress - WordCamp Finland
Why Progressive Web Apps For WordPress - WordCamp Finland
 
Build progressive web apps with Angular
Build progressive web apps with AngularBuild progressive web apps with Angular
Build progressive web apps with Angular
 
Progressive Web Apps (PWAs): Why you want one & how to optimize them #Applaus...
Progressive Web Apps (PWAs): Why you want one & how to optimize them #Applaus...Progressive Web Apps (PWAs): Why you want one & how to optimize them #Applaus...
Progressive Web Apps (PWAs): Why you want one & how to optimize them #Applaus...
 
Angular PWA
Angular PWAAngular PWA
Angular PWA
 
Progressive Web Apps and React
Progressive Web Apps and ReactProgressive Web Apps and React
Progressive Web Apps and React
 
Progressive Web APP ( PWA )
Progressive Web APP ( PWA ) Progressive Web APP ( PWA )
Progressive Web APP ( PWA )
 
Mobile application development React Native - Tidepool Labs
Mobile application development React Native - Tidepool LabsMobile application development React Native - Tidepool Labs
Mobile application development React Native - Tidepool Labs
 

Viewers also liked

Jsoup
JsoupJsoup
JFree chart
JFree chartJFree chart
Spring Web Flow
Spring Web FlowSpring Web Flow
Spring Web Flow
NexThoughts Technologies
 
RESTEasy
RESTEasyRESTEasy
Hamcrest
HamcrestHamcrest
Introduction to es6
Introduction to es6Introduction to es6
Introduction to es6
NexThoughts Technologies
 
Introduction to gradle
Introduction to gradleIntroduction to gradle
Introduction to gradle
NexThoughts Technologies
 
Grails with swagger
Grails with swaggerGrails with swagger
Grails with swagger
NexThoughts Technologies
 
Actors model in gpars
Actors model in gparsActors model in gpars
Actors model in gpars
NexThoughts Technologies
 
Introduction to thymeleaf
Introduction to thymeleafIntroduction to thymeleaf
Introduction to thymeleaf
NexThoughts Technologies
 
Jmh
JmhJmh
Cosmos DB Service
Cosmos DB ServiceCosmos DB Service
Cosmos DB Service
NexThoughts Technologies
 
Apache tika
Apache tikaApache tika
Reactive java - Reactive Programming + RxJava
Reactive java - Reactive Programming + RxJavaReactive java - Reactive Programming + RxJava
Reactive java - Reactive Programming + RxJava
NexThoughts Technologies
 
Java 8 features
Java 8 featuresJava 8 features
Java 8 features
NexThoughts Technologies
 
Unit test-using-spock in Grails
Unit test-using-spock in GrailsUnit test-using-spock in Grails
Unit test-using-spock in Grails
NexThoughts Technologies
 
Vertx
VertxVertx

Viewers also liked (17)

Jsoup
JsoupJsoup
Jsoup
 
JFree chart
JFree chartJFree chart
JFree chart
 
Spring Web Flow
Spring Web FlowSpring Web Flow
Spring Web Flow
 
RESTEasy
RESTEasyRESTEasy
RESTEasy
 
Hamcrest
HamcrestHamcrest
Hamcrest
 
Introduction to es6
Introduction to es6Introduction to es6
Introduction to es6
 
Introduction to gradle
Introduction to gradleIntroduction to gradle
Introduction to gradle
 
Grails with swagger
Grails with swaggerGrails with swagger
Grails with swagger
 
Actors model in gpars
Actors model in gparsActors model in gpars
Actors model in gpars
 
Introduction to thymeleaf
Introduction to thymeleafIntroduction to thymeleaf
Introduction to thymeleaf
 
Jmh
JmhJmh
Jmh
 
Cosmos DB Service
Cosmos DB ServiceCosmos DB Service
Cosmos DB Service
 
Apache tika
Apache tikaApache tika
Apache tika
 
Reactive java - Reactive Programming + RxJava
Reactive java - Reactive Programming + RxJavaReactive java - Reactive Programming + RxJava
Reactive java - Reactive Programming + RxJava
 
Java 8 features
Java 8 featuresJava 8 features
Java 8 features
 
Unit test-using-spock in Grails
Unit test-using-spock in GrailsUnit test-using-spock in Grails
Unit test-using-spock in Grails
 
Vertx
VertxVertx
Vertx
 

Similar to Progressive Web-App (PWA)

Web 2 0 Tools
Web 2 0 ToolsWeb 2 0 Tools
Web 2 0 Tools
ramesh kumar
 
Ajax presentation
Ajax presentationAjax presentation
Ajax presentation
Bharat_Kumawat
 
Krug Fat Client
Krug Fat ClientKrug Fat Client
Krug Fat Client
Paul Klipp
 
AJAX Frameworks
AJAX FrameworksAJAX Frameworks
AJAX Frameworks
shank
 
Using Ajax In Domino Web Applications
Using Ajax In Domino Web ApplicationsUsing Ajax In Domino Web Applications
Using Ajax In Domino Web Applications
dominion
 
Web 2 0 Fullfeatures
Web 2 0 FullfeaturesWeb 2 0 Fullfeatures
Web 2 0 Fullfeatures
Ratna Prashanth
 
Interview questions on asp
Interview questions on aspInterview questions on asp
Interview questions on asp
Mrunal Bhandarkar
 
Ajax technology
Ajax technologyAjax technology
Ajax technology
Safal Agrawal
 
Web 2 0 Fullfeatures
Web 2 0 FullfeaturesWeb 2 0 Fullfeatures
Web 2 0 Fullfeatures
vsnmurthy
 
Web 2 0 Fullfeatures
Web 2 0 FullfeaturesWeb 2 0 Fullfeatures
Web 2 0 Fullfeatures
guest9b7f4753
 
Angular jS Introduction by Google
Angular jS Introduction by GoogleAngular jS Introduction by Google
Angular jS Introduction by Google
ASG
 
Introduction Java Web Framework and Web Server.
Introduction Java Web Framework and Web Server.Introduction Java Web Framework and Web Server.
Introduction Java Web Framework and Web Server.
suranisaunak
 
Components of a Generic Web Application Architecture
Components of  a Generic Web Application ArchitectureComponents of  a Generic Web Application Architecture
Components of a Generic Web Application Architecture
MadonnaLamin1
 
UIT: Our Skills
UIT: Our SkillsUIT: Our Skills
UIT: Our Skills
uitpramati
 
Web Applications
Web ApplicationsWeb Applications
Web Applications
Debayan Goswami
 
Resume_Sandip_Mohod_Java_9_plus_years_exp
Resume_Sandip_Mohod_Java_9_plus_years_expResume_Sandip_Mohod_Java_9_plus_years_exp
Resume_Sandip_Mohod_Java_9_plus_years_exp
Sandip Mohod
 
Front-end rich JavaScript application creation (Backbone.js)
Front-end rich JavaScript application creation (Backbone.js)Front-end rich JavaScript application creation (Backbone.js)
Front-end rich JavaScript application creation (Backbone.js)
Oleksii Prohonnyi
 
Html5
Html5Html5
Advanced JavaScript
Advanced JavaScriptAdvanced JavaScript
Advanced JavaScript
Mahmoud Tolba
 
Single Page Application (SPA): A Comprehensive Guide for Beginners
Single Page Application (SPA): A Comprehensive Guide for BeginnersSingle Page Application (SPA): A Comprehensive Guide for Beginners
Single Page Application (SPA): A Comprehensive Guide for Beginners
Inexture Solutions
 

Similar to Progressive Web-App (PWA) (20)

Web 2 0 Tools
Web 2 0 ToolsWeb 2 0 Tools
Web 2 0 Tools
 
Ajax presentation
Ajax presentationAjax presentation
Ajax presentation
 
Krug Fat Client
Krug Fat ClientKrug Fat Client
Krug Fat Client
 
AJAX Frameworks
AJAX FrameworksAJAX Frameworks
AJAX Frameworks
 
Using Ajax In Domino Web Applications
Using Ajax In Domino Web ApplicationsUsing Ajax In Domino Web Applications
Using Ajax In Domino Web Applications
 
Web 2 0 Fullfeatures
Web 2 0 FullfeaturesWeb 2 0 Fullfeatures
Web 2 0 Fullfeatures
 
Interview questions on asp
Interview questions on aspInterview questions on asp
Interview questions on asp
 
Ajax technology
Ajax technologyAjax technology
Ajax technology
 
Web 2 0 Fullfeatures
Web 2 0 FullfeaturesWeb 2 0 Fullfeatures
Web 2 0 Fullfeatures
 
Web 2 0 Fullfeatures
Web 2 0 FullfeaturesWeb 2 0 Fullfeatures
Web 2 0 Fullfeatures
 
Angular jS Introduction by Google
Angular jS Introduction by GoogleAngular jS Introduction by Google
Angular jS Introduction by Google
 
Introduction Java Web Framework and Web Server.
Introduction Java Web Framework and Web Server.Introduction Java Web Framework and Web Server.
Introduction Java Web Framework and Web Server.
 
Components of a Generic Web Application Architecture
Components of  a Generic Web Application ArchitectureComponents of  a Generic Web Application Architecture
Components of a Generic Web Application Architecture
 
UIT: Our Skills
UIT: Our SkillsUIT: Our Skills
UIT: Our Skills
 
Web Applications
Web ApplicationsWeb Applications
Web Applications
 
Resume_Sandip_Mohod_Java_9_plus_years_exp
Resume_Sandip_Mohod_Java_9_plus_years_expResume_Sandip_Mohod_Java_9_plus_years_exp
Resume_Sandip_Mohod_Java_9_plus_years_exp
 
Front-end rich JavaScript application creation (Backbone.js)
Front-end rich JavaScript application creation (Backbone.js)Front-end rich JavaScript application creation (Backbone.js)
Front-end rich JavaScript application creation (Backbone.js)
 
Html5
Html5Html5
Html5
 
Advanced JavaScript
Advanced JavaScriptAdvanced JavaScript
Advanced JavaScript
 
Single Page Application (SPA): A Comprehensive Guide for Beginners
Single Page Application (SPA): A Comprehensive Guide for BeginnersSingle Page Application (SPA): A Comprehensive Guide for Beginners
Single Page Application (SPA): A Comprehensive Guide for Beginners
 

More from NexThoughts Technologies

Alexa skill
Alexa skillAlexa skill
GraalVM
GraalVMGraalVM
Docker & kubernetes
Docker & kubernetesDocker & kubernetes
Docker & kubernetes
NexThoughts Technologies
 
Apache commons
Apache commonsApache commons
Apache commons
NexThoughts Technologies
 
HazelCast
HazelCastHazelCast
MySQL Pro
MySQL ProMySQL Pro
Microservice Architecture using Spring Boot with React & Redux
Microservice Architecture using Spring Boot with React & ReduxMicroservice Architecture using Spring Boot with React & Redux
Microservice Architecture using Spring Boot with React & Redux
NexThoughts Technologies
 
Swagger
SwaggerSwagger
Solid Principles
Solid PrinciplesSolid Principles
Solid Principles
NexThoughts Technologies
 
Arango DB
Arango DBArango DB
Jython
JythonJython
Introduction to TypeScript
Introduction to TypeScriptIntroduction to TypeScript
Introduction to TypeScript
NexThoughts Technologies
 
Smart Contract samples
Smart Contract samplesSmart Contract samples
Smart Contract samples
NexThoughts Technologies
 
My Doc of geth
My Doc of gethMy Doc of geth
My Doc of geth
NexThoughts Technologies
 
Geth important commands
Geth important commandsGeth important commands
Geth important commands
NexThoughts Technologies
 
Ethereum genesis
Ethereum genesisEthereum genesis
Ethereum genesis
NexThoughts Technologies
 
Ethereum
EthereumEthereum
Springboot Microservices
Springboot MicroservicesSpringboot Microservices
Springboot Microservices
NexThoughts Technologies
 
An Introduction to Redux
An Introduction to ReduxAn Introduction to Redux
An Introduction to Redux
NexThoughts Technologies
 
Google authentication
Google authenticationGoogle authentication
Google authentication
NexThoughts Technologies
 

More from NexThoughts Technologies (20)

Alexa skill
Alexa skillAlexa skill
Alexa skill
 
GraalVM
GraalVMGraalVM
GraalVM
 
Docker & kubernetes
Docker & kubernetesDocker & kubernetes
Docker & kubernetes
 
Apache commons
Apache commonsApache commons
Apache commons
 
HazelCast
HazelCastHazelCast
HazelCast
 
MySQL Pro
MySQL ProMySQL Pro
MySQL Pro
 
Microservice Architecture using Spring Boot with React & Redux
Microservice Architecture using Spring Boot with React & ReduxMicroservice Architecture using Spring Boot with React & Redux
Microservice Architecture using Spring Boot with React & Redux
 
Swagger
SwaggerSwagger
Swagger
 
Solid Principles
Solid PrinciplesSolid Principles
Solid Principles
 
Arango DB
Arango DBArango DB
Arango DB
 
Jython
JythonJython
Jython
 
Introduction to TypeScript
Introduction to TypeScriptIntroduction to TypeScript
Introduction to TypeScript
 
Smart Contract samples
Smart Contract samplesSmart Contract samples
Smart Contract samples
 
My Doc of geth
My Doc of gethMy Doc of geth
My Doc of geth
 
Geth important commands
Geth important commandsGeth important commands
Geth important commands
 
Ethereum genesis
Ethereum genesisEthereum genesis
Ethereum genesis
 
Ethereum
EthereumEthereum
Ethereum
 
Springboot Microservices
Springboot MicroservicesSpringboot Microservices
Springboot Microservices
 
An Introduction to Redux
An Introduction to ReduxAn Introduction to Redux
An Introduction to Redux
 
Google authentication
Google authenticationGoogle authentication
Google authentication
 

Recently uploaded

Best Practices for Effectively Running dbt in Airflow.pdf
Best Practices for Effectively Running dbt in Airflow.pdfBest Practices for Effectively Running dbt in Airflow.pdf
Best Practices for Effectively Running dbt in Airflow.pdf
Tatiana Al-Chueyr
 
Scaling Connections in PostgreSQL Postgres Bangalore(PGBLR) Meetup-2 - Mydbops
Scaling Connections in PostgreSQL Postgres Bangalore(PGBLR) Meetup-2 - MydbopsScaling Connections in PostgreSQL Postgres Bangalore(PGBLR) Meetup-2 - Mydbops
Scaling Connections in PostgreSQL Postgres Bangalore(PGBLR) Meetup-2 - Mydbops
Mydbops
 
Quality Patents: Patents That Stand the Test of Time
Quality Patents: Patents That Stand the Test of TimeQuality Patents: Patents That Stand the Test of Time
Quality Patents: Patents That Stand the Test of Time
Aurora Consulting
 
Fluttercon 2024: Showing that you care about security - OpenSSF Scorecards fo...
Fluttercon 2024: Showing that you care about security - OpenSSF Scorecards fo...Fluttercon 2024: Showing that you care about security - OpenSSF Scorecards fo...
Fluttercon 2024: Showing that you care about security - OpenSSF Scorecards fo...
Chris Swan
 
BLOCKCHAIN FOR DUMMIES: GUIDEBOOK FOR ALL
BLOCKCHAIN FOR DUMMIES: GUIDEBOOK FOR ALLBLOCKCHAIN FOR DUMMIES: GUIDEBOOK FOR ALL
BLOCKCHAIN FOR DUMMIES: GUIDEBOOK FOR ALL
Liveplex
 
Measuring the Impact of Network Latency at Twitter
Measuring the Impact of Network Latency at TwitterMeasuring the Impact of Network Latency at Twitter
Measuring the Impact of Network Latency at Twitter
ScyllaDB
 
DealBook of Ukraine: 2024 edition
DealBook of Ukraine: 2024 editionDealBook of Ukraine: 2024 edition
DealBook of Ukraine: 2024 edition
Yevgen Sysoyev
 
The Rise of Supernetwork Data Intensive Computing
The Rise of Supernetwork Data Intensive ComputingThe Rise of Supernetwork Data Intensive Computing
The Rise of Supernetwork Data Intensive Computing
Larry Smarr
 
WPRiders Company Presentation Slide Deck
WPRiders Company Presentation Slide DeckWPRiders Company Presentation Slide Deck
WPRiders Company Presentation Slide Deck
Lidia A.
 
Transcript: Details of description part II: Describing images in practice - T...
Transcript: Details of description part II: Describing images in practice - T...Transcript: Details of description part II: Describing images in practice - T...
Transcript: Details of description part II: Describing images in practice - T...
BookNet Canada
 
How Social Media Hackers Help You to See Your Wife's Message.pdf
How Social Media Hackers Help You to See Your Wife's Message.pdfHow Social Media Hackers Help You to See Your Wife's Message.pdf
How Social Media Hackers Help You to See Your Wife's Message.pdf
HackersList
 
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdfBT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
Neo4j
 
How RPA Help in the Transportation and Logistics Industry.pptx
How RPA Help in the Transportation and Logistics Industry.pptxHow RPA Help in the Transportation and Logistics Industry.pptx
How RPA Help in the Transportation and Logistics Industry.pptx
SynapseIndia
 
Cookies program to display the information though cookie creation
Cookies program to display the information though cookie creationCookies program to display the information though cookie creation
Cookies program to display the information though cookie creation
shanthidl1
 
7 Most Powerful Solar Storms in the History of Earth.pdf
7 Most Powerful Solar Storms in the History of Earth.pdf7 Most Powerful Solar Storms in the History of Earth.pdf
7 Most Powerful Solar Storms in the History of Earth.pdf
Enterprise Wired
 
Advanced Techniques for Cyber Security Analysis and Anomaly Detection
Advanced Techniques for Cyber Security Analysis and Anomaly DetectionAdvanced Techniques for Cyber Security Analysis and Anomaly Detection
Advanced Techniques for Cyber Security Analysis and Anomaly Detection
Bert Blevins
 
INDIAN AIR FORCE FIGHTER PLANES LIST.pdf
INDIAN AIR FORCE FIGHTER PLANES LIST.pdfINDIAN AIR FORCE FIGHTER PLANES LIST.pdf
INDIAN AIR FORCE FIGHTER PLANES LIST.pdf
jackson110191
 
Pigging Solutions Sustainability brochure.pdf
Pigging Solutions Sustainability brochure.pdfPigging Solutions Sustainability brochure.pdf
Pigging Solutions Sustainability brochure.pdf
Pigging Solutions
 
Mitigating the Impact of State Management in Cloud Stream Processing Systems
Mitigating the Impact of State Management in Cloud Stream Processing SystemsMitigating the Impact of State Management in Cloud Stream Processing Systems
Mitigating the Impact of State Management in Cloud Stream Processing Systems
ScyllaDB
 
Choose our Linux Web Hosting for a seamless and successful online presence
Choose our Linux Web Hosting for a seamless and successful online presenceChoose our Linux Web Hosting for a seamless and successful online presence
Choose our Linux Web Hosting for a seamless and successful online presence
rajancomputerfbd
 

Recently uploaded (20)

Best Practices for Effectively Running dbt in Airflow.pdf
Best Practices for Effectively Running dbt in Airflow.pdfBest Practices for Effectively Running dbt in Airflow.pdf
Best Practices for Effectively Running dbt in Airflow.pdf
 
Scaling Connections in PostgreSQL Postgres Bangalore(PGBLR) Meetup-2 - Mydbops
Scaling Connections in PostgreSQL Postgres Bangalore(PGBLR) Meetup-2 - MydbopsScaling Connections in PostgreSQL Postgres Bangalore(PGBLR) Meetup-2 - Mydbops
Scaling Connections in PostgreSQL Postgres Bangalore(PGBLR) Meetup-2 - Mydbops
 
Quality Patents: Patents That Stand the Test of Time
Quality Patents: Patents That Stand the Test of TimeQuality Patents: Patents That Stand the Test of Time
Quality Patents: Patents That Stand the Test of Time
 
Fluttercon 2024: Showing that you care about security - OpenSSF Scorecards fo...
Fluttercon 2024: Showing that you care about security - OpenSSF Scorecards fo...Fluttercon 2024: Showing that you care about security - OpenSSF Scorecards fo...
Fluttercon 2024: Showing that you care about security - OpenSSF Scorecards fo...
 
BLOCKCHAIN FOR DUMMIES: GUIDEBOOK FOR ALL
BLOCKCHAIN FOR DUMMIES: GUIDEBOOK FOR ALLBLOCKCHAIN FOR DUMMIES: GUIDEBOOK FOR ALL
BLOCKCHAIN FOR DUMMIES: GUIDEBOOK FOR ALL
 
Measuring the Impact of Network Latency at Twitter
Measuring the Impact of Network Latency at TwitterMeasuring the Impact of Network Latency at Twitter
Measuring the Impact of Network Latency at Twitter
 
DealBook of Ukraine: 2024 edition
DealBook of Ukraine: 2024 editionDealBook of Ukraine: 2024 edition
DealBook of Ukraine: 2024 edition
 
The Rise of Supernetwork Data Intensive Computing
The Rise of Supernetwork Data Intensive ComputingThe Rise of Supernetwork Data Intensive Computing
The Rise of Supernetwork Data Intensive Computing
 
WPRiders Company Presentation Slide Deck
WPRiders Company Presentation Slide DeckWPRiders Company Presentation Slide Deck
WPRiders Company Presentation Slide Deck
 
Transcript: Details of description part II: Describing images in practice - T...
Transcript: Details of description part II: Describing images in practice - T...Transcript: Details of description part II: Describing images in practice - T...
Transcript: Details of description part II: Describing images in practice - T...
 
How Social Media Hackers Help You to See Your Wife's Message.pdf
How Social Media Hackers Help You to See Your Wife's Message.pdfHow Social Media Hackers Help You to See Your Wife's Message.pdf
How Social Media Hackers Help You to See Your Wife's Message.pdf
 
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdfBT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
 
How RPA Help in the Transportation and Logistics Industry.pptx
How RPA Help in the Transportation and Logistics Industry.pptxHow RPA Help in the Transportation and Logistics Industry.pptx
How RPA Help in the Transportation and Logistics Industry.pptx
 
Cookies program to display the information though cookie creation
Cookies program to display the information though cookie creationCookies program to display the information though cookie creation
Cookies program to display the information though cookie creation
 
7 Most Powerful Solar Storms in the History of Earth.pdf
7 Most Powerful Solar Storms in the History of Earth.pdf7 Most Powerful Solar Storms in the History of Earth.pdf
7 Most Powerful Solar Storms in the History of Earth.pdf
 
Advanced Techniques for Cyber Security Analysis and Anomaly Detection
Advanced Techniques for Cyber Security Analysis and Anomaly DetectionAdvanced Techniques for Cyber Security Analysis and Anomaly Detection
Advanced Techniques for Cyber Security Analysis and Anomaly Detection
 
INDIAN AIR FORCE FIGHTER PLANES LIST.pdf
INDIAN AIR FORCE FIGHTER PLANES LIST.pdfINDIAN AIR FORCE FIGHTER PLANES LIST.pdf
INDIAN AIR FORCE FIGHTER PLANES LIST.pdf
 
Pigging Solutions Sustainability brochure.pdf
Pigging Solutions Sustainability brochure.pdfPigging Solutions Sustainability brochure.pdf
Pigging Solutions Sustainability brochure.pdf
 
Mitigating the Impact of State Management in Cloud Stream Processing Systems
Mitigating the Impact of State Management in Cloud Stream Processing SystemsMitigating the Impact of State Management in Cloud Stream Processing Systems
Mitigating the Impact of State Management in Cloud Stream Processing Systems
 
Choose our Linux Web Hosting for a seamless and successful online presence
Choose our Linux Web Hosting for a seamless and successful online presenceChoose our Linux Web Hosting for a seamless and successful online presence
Choose our Linux Web Hosting for a seamless and successful online presence
 

Progressive Web-App (PWA)

  • 2. Agenda Overview Technologies Behind Basic Need App Shell Storage Service Worker Caching Strategies Web App Manifest
  • 3. Overview Progressive Web App (PWA) is a term used to denote web apps that use the latest web technologies. Progressive web apps are technically regular web pages (or websites) but can appear to the user like traditional applications or (native) mobile applications. This new application type attempts to combine features offered by most modern browsers with the benefits of mobile experience.
  • 4. Technologies Behind Service Workers A JavaScript file that runs separately from the main browser thread (XMLHttpRequest), 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.
  • 5. Basic Need Project HTML JavaScript Chrome Extensions: Web Server (Run project on local machine) Lighthouse (Testing the app)
  • 6. App Shell The application shell is the minimum HTML, CSS and JavaScript required to power a user interface. A native mobile application includes the application shell as part of its distributable, whereas websites ordinarily request this over the network.
  • 7. Storage Local Storage Easy to User Synchronous Not Transaction Support Most of the Browser Caches Object Easy to use Asynchronous FAST Not Transaction Not Support in Most of the Browser IndexedDB Complex Data Asynchronous Fast Transactional Support in Every Browser
  • 8. Service Worker A JavaScript file that runs separately from the main browser thread (XMLHttpRequest), intercepting network request caching or retrieving resource from the cache and delivering push messages.
  • 10. Caching Strategies Cache first, then Network Network first, then Cache Cache Only Network Only(Not Caching Strategy) Cache and Network Race Cache and Network
  • 11. Web App Manifest The web app manifest is a simple JSON file that gives you, the developer, the ability to control how your app appears to the user in areas where they would expect to see apps (for example, a mobile device's home screen), direct what the user can launch, and define its appearance at launch.