SlideShare a Scribd company logo
1 of 14
Download to read offline
Native Mobile vs.
Progressive Web App:
Developer Evaluation Guide
Swaran Soft
- Tech Simplified -
You have to build for mobile. But you don’t have to learn native iOS and Android
development to do it.
With just over half of all internet traffic serving mobile devices, your users expect smartphone
friendly services. But does that mean you have to invest in the creation and maintenance of native
mobile apps?
There is an alternative. Progressive web apps (PWAs) give your users a native app-like experience
but, under the hood, they’re just standard web applications with some mobile-friendly additions.
The best of both worlds. Depending on your app’s needs, PWAs could help you get to market faster,
improve discoverability, and reduce maintenance costs.
In this evaluation guide, we present the pros and cons of PWAs, alongside how the OutSystems app
development platform can help. By the end of this guide, you’ll be ready to decide which route to
take for your next mobile project.
Native Mobile vs Progressive Web App: Developer Evaluation Guide
2
Introducing Progressive Web Apps
It might seem like you have no choice. If you want to target mobile device users then you have to
invest in native iOS and Android apps, right?
Perhaps not. Progressive web apps offer an alternative. PWAs give you the tools to deliver a mobile
app experience using everyday HTML, CSS, and JavaScript. They’re fast, work offline, and “install” to
the device home screen with an app icon.
So, what’s the catch? That depends on what your users need and we’ll cover the tradeoffs on page 7.
First, let’s look at what goes into a PWA.
PWA Fundamentals
At heart, progressive web apps are just web applications. They work in any browser. However,
relying on the principle of progressive enhancement, they gain extra functionality — such as
working offline — when accessed using a modern browser.
So, with a little extra work you can retrofit an existing web app to become a PWA. And, if you’re
planning a new project, you can serve both web and mobile users equally from one code base and
one deployment.
Interested? Read on to learn more about how a progressive web app could be right for your
next project.
Native Mobile vs Progressive Web App: Developer Evaluation Guide
3
PWA Fundamentals
If PWAs are just web apps, how can they offer an alternative to native mobile apps?
On modern browsers, including Safari, Chrome, and Edge, your PWA can take advantage of
three technologies to deliver that app-like experience. On older browsers, your web app will
work just like any other.
So, what is it that makes a PWA a PWA?
Service workers
The key to a native mobile app-like experience, service workers let you run background
JavaScript jobs directly on the device. That reduces the need for round trips to the
server, meaning your PWA is more responsive and that it doesn’t always need a network
connection.
Offline cache
Service workers are good for more than only improving responsiveness. They also allow
you to cache data locally on the device. With functionality and data available offline, your
PWA can work without a network connection and then sync with the server when the
device is back online.
App manifest
Just like a native app, users can install your PWA on their devices. Each PWA comes
with a JSON file called the app manifest. That specifies the icon, the app URL, and other
associated data meaning that the user experience is nearly indistinguishable from a
regular mobile app.
Native Mobile vs Progressive Web App: Developer Evaluation Guide
4
Business Benefits of PWAs
From a development perspective, the benefits of a single codebase using standard web tooling are
clear. But how do they help with user engagement and ROI?
Discoverability
Remember that PWAs are just web apps? As such, search engines index them just like any
other website. With Google’s commitment to mobile-first indexing, PWAs rank higher and are
commonly seen as snippet cards at the top of the first results page.
Stickiness
Once installed, PWAs become available on a device’s home screen just like any other app. Think
of it as a portable web page that’s accessible with a single click or tap, without the user having
to open the browser first.
High performance
According to a recent study by Google, 53% of users abandon mobile websites that take more
than three seconds to load,1
so speed is critical to adoption. Since PWAs work offline first they
load and run faster.
Always up to date
PWAs are always fresh. Each time a user connects to the server, the app can update
automatically over-the-air, with no need for manual user approval.
1
https://www.thinkwithgoogle.com/consumer-insights/consumer-trends/mobile-site-load-time-statistics
Native Mobile vs Progressive Web App: Developer Evaluation Guide
5
Responsiveness
PWAs are responsive by nature. They adapt to any screen size, and their behavior will be
consistent regardless of device.
Shareability
PWAs can be easily shared and used via a link that doesn’t require a visit to the app marketplace
or a lengthy download. Furthermore, when Android users can share links to PWAs with iOS
users, they don’t need to distinguish the store being used to download the app.
Native device capabilities
Just like a native app, PWAs can make use of a device’s hardware features and storage. Your app
can also allow users to make payments through built-in payment systems such as Apple Pay or
Google Pay.
Native Mobile vs Progressive Web App: Developer Evaluation Guide
6
There is no app store revenue-sharing to skim off around 15% of the app’s income.2
Advantages of PWAs
PWAs help speed your time to value with a shared code base between platforms and the ability to deploy without going through an app store.
Built using existing skills: PWAs are built using familiar web technology such as HTML,
CSS and JavaScript.
Cross-platform compatibility: Because PWAs run on a browser (albeit invisibly to the
user), they can operate on any device that can run a modern browser. You’re essentially
offloading the cost of making your apps compatible with multiple devices to the browser
vendors. This makes it much faster to build for multiple devices.
Rapid upgrading/iterative improvement: This speed comes in handy not only in
delivering a new app to market, but also when it comes to delivering improvements on
apps that are already deployed. You can push updates directly to users without going
through the provisioning process that app stores require. That means there’s no lag
between finding a bug and fixing it in production.
Lower costs: Time is money. With a single code base that works on all devices, you
can cut development time compared to native application development and save the
expense of a lengthy development process. Also, there is no app store revenue-sharing
to skim off around 15% of the app’s income.
2
https://www.pocketgamer.biz/comment-and-opinion/68590/why-the-7030-app-store-revenue-split-is-doomed
Native Mobile vs Progressive Web App: Developer Evaluation Guide
7
PWA, web app or native app: Which to choose?
Fast, reliable performance
Multi-platform (mobile
and desktop)
Offline capabilities
Advanced device capabilities
(e.g., calendar, contacts,
browser bookmarks)
Support for demanding
hardware usage (e.g.,
fingerprint or face identification)
Integrations with camera,
GPS, etc.
Push notifications
Storage requirements
Distribution without app store
Discoverable online
Shareable and linkable
Yes
No
Yes
Yes
Yes
Yes
Yes
High
No
No
No
Native app
No
Yes
No
No
No
No
No
None
Yes
Yes
Yes
Web app
Yes
Yes
Yes
No
No
Yes
Yes
Low
Yes
Yes
Yes
PWA
Native Mobile vs Progressive Web App: Developer Evaluation Guide
8
1
3
2
4
You should choose PWAs when you and your teams:
Continually struggle to find the resources to launch new projects and complete projects
on time. PWAs are typically quicker to build than web and mobile apps, so they’re a smart
option for teams that need to prioritize speed.
Need a stepping-stone for consumers to progressively adopt your applications
(browser > PWA > mobile), especially in low-loyalty parts of their customer journeys
(e.g., onboarding journeys).
Want to increase the reach of your mobile presence by providing a lightweight version
of a mobile application to cater to users with lower-end devices or who are in areas with
unpredictable or low connectivity.
Experience common obstacles to delivering mobile applications to consumers and
employees, such as app stores and lengthy approval processes.
Choose a native application if you need:
Ingration with certain device capabilities, such as calendars, contacts, browser
bookmarks, alarms or other applications.
The ability to intercept SMS messages or calls or obtain users’ phone numbers.
Demanding hardware usage such as fingerprint or facial recognition.
The ability to launch without an internet connection.
Native Mobile vs Progressive Web App: Developer Evaluation Guide
9
How OutSystems Accelerates PWA
Development
If you choose to build a PWA, there are a number of advantages to doing so with OutSystems. Once
you’ve created a mobile app using our rapid, intuitive visual development tool, you can distribute it as
a PWA with a single toggle, so you can spend more of your time bringing greater value to users and
less time repeating code.
No additional knowledge required
With the ability to create a reactive web app or mobile app using OutSystems, you have all
the tools that you need to create a PWA right now. OutSystems takes care of the manifests
and service workers necessary to create the PWA automatically.
Single code base
OutSystems lets you create the UI and front-end code for your mobile apps and PWAs once.
You can engage customers and employees through web, mobile and progressive web apps
without adapting the code for each device you want to support.
Data sync framework
Keeping local and server data in sync is no small task. OutSystems provides a framework for
syncing data between your PWA and the server.
Native Mobile vs Progressive Web App: Developer Evaluation Guide
10
Streamlined deployment
OutSystems allows customers to deploy PWAs with a toggle. The platform automatically
generates all the resources needed for PWA deployment — metatags, app manifest, service
workers and offline capabilities — without developer intervention. OutSystems is the only
application development platform that does not require any specific code configuration to
deploy a PWA. Most competing solutions require developers to manually create these assets
and upload them to the server. What’s more, our PWAs achieve the maximum score on
Google Lighthouse.
Modern application platform
PWA development takes advantage of the full benefits of the OutSystems platform: a visual,
model-based development platform supporting the full DevOps lifecycle. The platform
provides tools that support multi-disciplinary teams who ensure your apps meet business
needs as well as performance requirements.
Automated impact analysis and bug checking
OutSystems uses automation, AI and analytics to remove the guesswork and repetition
from development and delivery across design, build and runtime. TrueChange checks for
architecture errors and dependencies, provides governance and monitors performance in
real time.
To see just how fast it is to build and deploy a PWA on the OutSystems platform, watch our
demo video.
Native Mobile vs Progressive Web App: Developer Evaluation Guide
11
Use Cases for PWAs
New customer onboarding
PWAs reduce the friction typical of customer
onboarding because they don’t require the time
and additional steps of visiting an app market and
downloading a new large app to their phone.
Insurance
Since users don’t (hopefully!) have to file an
insurance claim every day, there’s no reason to
force them into downloading a dedicated app.
Retail loyalty programs
The large number of loyalty apps discourages
users from installing all the apps on their device.
Airline mobile apps
Users resist installing one app per airline, especially
when they might be incurring roaming charges.
That makes a PWA a great fit for this use case.
Workflow management
Applications that help in creating, monitoring
and following processes and workflows.
Transportation
This includes B2C apps for taxi services, rental
cars, city-share bikes and public transportation.
Location specificity means that visitors would
prefer not to download a full-size app.
Critical aspects
• Low footprint
• GPS/geolocation
• Camera
• Push notifications
Critical aspects • Push notifications Critical aspects • Push notifications
Critical aspects
• Low footprint,
• Push notifications
• Payment gateways
Critical aspects
• Flawless UI
• GPS/geolocation
• Push notifications
Critical aspects
• Low footprint
• Push notifications
Native Mobile vs Progressive Web App: Developer Evaluation Guide
12
2
APP DEVELOPMENT:
CUSTOMER SUCCESS
RESULTS:
15
20
IT staff trained to use
OutSystems alongside
five pro developers
months
minutes admin time
eliminated from every
consultation call
Constellation is a growing portfolio of medical professional liability insurance and partner companies
dedicated to reducing risk and supporting physicians and care teams. To support physicians facing
lawsuits — something many will deal with at least once during their careers — Constellation’s clinician
peer support program links healthcare professionals to skilled peers who provide professional and
emotional support.
Previously, this involved numerous time-consuming manual processes: emails, text messages and
voicemails to schedule a consultation and follow-ups, and handle documentation, timekeeping,
invoicing and more. Using OutSystems, Constellation built a progressive web app in just two months
to streamline the peer support program’s communications, time-tracking and compensation
processes. Apart from saving valuable time for clinicians, Constellation has grown its app dev team
from five to 20, with other IT staff learning to use OutSystems alongside five professional developers.
Read more about how Constellation built an integrated app in just two months.
Native Mobile vs Progressive Web App: Developer Evaluation Guide
13
About OutSystems
Thousands of customers worldwide trust OutSystems—the only
solution that enables the visual development of entire application
portfolios that easily integrate with existing systems.
Learn more at www.outsystems.com
Want to know more? Contact Swaran Soft Support Solutions Pvt. Ltd.:
Email Swaran Soft Support Solutions Pvt. Ltd.
info@swaransoft.com
Visit our site to learn more
www.swaransoft.com
www.lowcodedigitalfactory.com
Next steps with [Swaran Soft Support Solutions
Pvt. Ltd.]
Swaran Soft is a Digital Transformation experienced in Digital Adoption,
Omni Channel Commerce, IoT, ML, AI & Big Data. We serve large Global
Corporates, Government, Institutions & Innovation Hungry Startups for
end to end IT adoption & business continuity services.
We envision longevity in our business relationships for a win-win
associations.
Swaran Soft
- Tech Simplified - Partner
SALES

More Related Content

Similar to How OutSystems Accelerates PWA Development

PWA ( Progressive Web Apps ) - Sai Kiran Kasireddy
PWA ( Progressive Web Apps ) - Sai Kiran KasireddyPWA ( Progressive Web Apps ) - Sai Kiran Kasireddy
PWA ( Progressive Web Apps ) - Sai Kiran KasireddySai Kiran Kasireddy
 
Web Application Development- Best Practices in 2023.
Web Application Development- Best Practices in 2023.Web Application Development- Best Practices in 2023.
Web Application Development- Best Practices in 2023.Techugo
 
The importance of developing PWAs in ReactJs
The importance of developing PWAs in ReactJsThe importance of developing PWAs in ReactJs
The importance of developing PWAs in ReactJsReactJS
 
Native, hybrid, or pw as – choose the best for your business
Native, hybrid, or pw as – choose the best for your businessNative, hybrid, or pw as – choose the best for your business
Native, hybrid, or pw as – choose the best for your businessMarkovate
 
Web Application Development in 2023.pdf
Web Application Development in 2023.pdfWeb Application Development in 2023.pdf
Web Application Development in 2023.pdfTechugo
 
A Useful Guide to Investigate the Various Mobile Application Types
A Useful Guide to Investigate the Various Mobile Application TypesA Useful Guide to Investigate the Various Mobile Application Types
A Useful Guide to Investigate the Various Mobile Application TypesFlexsin
 
A Guide to Mobile App Development - Web vs Native vs Hybrid.pdf
A Guide to Mobile App Development - Web vs Native vs Hybrid.pdfA Guide to Mobile App Development - Web vs Native vs Hybrid.pdf
A Guide to Mobile App Development - Web vs Native vs Hybrid.pdfWDP Technologies
 
Progressive web application
Progressive web applicationProgressive web application
Progressive web applicationRavikantGautam8
 
PWA Utility App Development_ Learn How To Build.pdf
PWA Utility App Development_ Learn How To Build.pdfPWA Utility App Development_ Learn How To Build.pdf
PWA Utility App Development_ Learn How To Build.pdfLucas Lagone
 
Progressive Web Apps (PWAs) - Transforming the Future of Full-Stack Developme...
Progressive Web Apps (PWAs) - Transforming the Future of Full-Stack Developme...Progressive Web Apps (PWAs) - Transforming the Future of Full-Stack Developme...
Progressive Web Apps (PWAs) - Transforming the Future of Full-Stack Developme...mohitreal1995
 
Progressive web apps
Progressive web appsProgressive web apps
Progressive web appsAkshay Sharma
 
Planning Your Progressive Web App
Planning Your Progressive Web AppPlanning Your Progressive Web App
Planning Your Progressive Web AppJason Grigsby
 
PWAs For Travel_ How To Build A PWA Travel App.pdf
PWAs For Travel_ How To Build A PWA Travel App.pdfPWAs For Travel_ How To Build A PWA Travel App.pdf
PWAs For Travel_ How To Build A PWA Travel App.pdfLucas Lagone
 
IRJET-Garbage Monitoring and Management using Internet of things
IRJET-Garbage Monitoring and Management using Internet of thingsIRJET-Garbage Monitoring and Management using Internet of things
IRJET-Garbage Monitoring and Management using Internet of thingsIRJET Journal
 
What Are Progressive Web Application Development
What Are Progressive Web Application DevelopmentWhat Are Progressive Web Application Development
What Are Progressive Web Application DevelopmentApp Verticals
 

Similar to How OutSystems Accelerates PWA Development (20)

PWA ( Progressive Web Apps ) - Sai Kiran Kasireddy
PWA ( Progressive Web Apps ) - Sai Kiran KasireddyPWA ( Progressive Web Apps ) - Sai Kiran Kasireddy
PWA ( Progressive Web Apps ) - Sai Kiran Kasireddy
 
Web Application Development- Best Practices in 2023.
Web Application Development- Best Practices in 2023.Web Application Development- Best Practices in 2023.
Web Application Development- Best Practices in 2023.
 
The importance of developing PWAs in ReactJs
The importance of developing PWAs in ReactJsThe importance of developing PWAs in ReactJs
The importance of developing PWAs in ReactJs
 
Native, hybrid, or pw as – choose the best for your business
Native, hybrid, or pw as – choose the best for your businessNative, hybrid, or pw as – choose the best for your business
Native, hybrid, or pw as – choose the best for your business
 
Web Application Development in 2023.pdf
Web Application Development in 2023.pdfWeb Application Development in 2023.pdf
Web Application Development in 2023.pdf
 
Progressive Web App
Progressive Web AppProgressive Web App
Progressive Web App
 
A Useful Guide to Investigate the Various Mobile Application Types
A Useful Guide to Investigate the Various Mobile Application TypesA Useful Guide to Investigate the Various Mobile Application Types
A Useful Guide to Investigate the Various Mobile Application Types
 
A Guide to Mobile App Development - Web vs Native vs Hybrid.pdf
A Guide to Mobile App Development - Web vs Native vs Hybrid.pdfA Guide to Mobile App Development - Web vs Native vs Hybrid.pdf
A Guide to Mobile App Development - Web vs Native vs Hybrid.pdf
 
Progressive web application
Progressive web applicationProgressive web application
Progressive web application
 
PWA Utility App Development_ Learn How To Build.pdf
PWA Utility App Development_ Learn How To Build.pdfPWA Utility App Development_ Learn How To Build.pdf
PWA Utility App Development_ Learn How To Build.pdf
 
Progressive Web Apps (PWAs) - Transforming the Future of Full-Stack Developme...
Progressive Web Apps (PWAs) - Transforming the Future of Full-Stack Developme...Progressive Web Apps (PWAs) - Transforming the Future of Full-Stack Developme...
Progressive Web Apps (PWAs) - Transforming the Future of Full-Stack Developme...
 
Introduction to PWAs
Introduction to PWAsIntroduction to PWAs
Introduction to PWAs
 
Progressive web apps
Progressive web appsProgressive web apps
Progressive web apps
 
Planning Your Progressive Web App
Planning Your Progressive Web AppPlanning Your Progressive Web App
Planning Your Progressive Web App
 
PWAs For Travel_ How To Build A PWA Travel App.pdf
PWAs For Travel_ How To Build A PWA Travel App.pdfPWAs For Travel_ How To Build A PWA Travel App.pdf
PWAs For Travel_ How To Build A PWA Travel App.pdf
 
Mobile app vs web app
Mobile app vs web appMobile app vs web app
Mobile app vs web app
 
IRJET-Garbage Monitoring and Management using Internet of things
IRJET-Garbage Monitoring and Management using Internet of thingsIRJET-Garbage Monitoring and Management using Internet of things
IRJET-Garbage Monitoring and Management using Internet of things
 
What Are Progressive Web Application Development
What Are Progressive Web Application DevelopmentWhat Are Progressive Web Application Development
What Are Progressive Web Application Development
 
Checklist for progressive web app development
Checklist for progressive web app developmentChecklist for progressive web app development
Checklist for progressive web app development
 
PWAs Vs. Native Apps
PWAs Vs. Native AppsPWAs Vs. Native Apps
PWAs Vs. Native Apps
 

More from LCDF

Use a Modern App Platform and AI to Deliver Frictionless Customer Experiences
Use a Modern App Platform and AI to Deliver Frictionless Customer ExperiencesUse a Modern App Platform and AI to Deliver Frictionless Customer Experiences
Use a Modern App Platform and AI to Deliver Frictionless Customer ExperiencesLCDF
 
Cloud Native Development
Cloud Native DevelopmentCloud Native Development
Cloud Native DevelopmentLCDF
 
Low Code is The Intelligent Automation Enabler
Low Code is The Intelligent Automation EnablerLow Code is The Intelligent Automation Enabler
Low Code is The Intelligent Automation EnablerLCDF
 
Can low-code overturn this wisdom?
Can low-code overturn this wisdom?Can low-code overturn this wisdom?
Can low-code overturn this wisdom?LCDF
 
Streamline your digital transformation for a future ready venture.
Streamline your digital transformation for a future ready venture.Streamline your digital transformation for a future ready venture.
Streamline your digital transformation for a future ready venture.LCDF
 
Bring Agility in your Customer Service through Low code adoption and improve ...
Bring Agility in your Customer Service through Low code adoption and improve ...Bring Agility in your Customer Service through Low code adoption and improve ...
Bring Agility in your Customer Service through Low code adoption and improve ...LCDF
 
Customize Transformation For A Personalized Experience
Customize Transformation For A Personalized ExperienceCustomize Transformation For A Personalized Experience
Customize Transformation For A Personalized ExperienceLCDF
 

More from LCDF (7)

Use a Modern App Platform and AI to Deliver Frictionless Customer Experiences
Use a Modern App Platform and AI to Deliver Frictionless Customer ExperiencesUse a Modern App Platform and AI to Deliver Frictionless Customer Experiences
Use a Modern App Platform and AI to Deliver Frictionless Customer Experiences
 
Cloud Native Development
Cloud Native DevelopmentCloud Native Development
Cloud Native Development
 
Low Code is The Intelligent Automation Enabler
Low Code is The Intelligent Automation EnablerLow Code is The Intelligent Automation Enabler
Low Code is The Intelligent Automation Enabler
 
Can low-code overturn this wisdom?
Can low-code overturn this wisdom?Can low-code overturn this wisdom?
Can low-code overturn this wisdom?
 
Streamline your digital transformation for a future ready venture.
Streamline your digital transformation for a future ready venture.Streamline your digital transformation for a future ready venture.
Streamline your digital transformation for a future ready venture.
 
Bring Agility in your Customer Service through Low code adoption and improve ...
Bring Agility in your Customer Service through Low code adoption and improve ...Bring Agility in your Customer Service through Low code adoption and improve ...
Bring Agility in your Customer Service through Low code adoption and improve ...
 
Customize Transformation For A Personalized Experience
Customize Transformation For A Personalized ExperienceCustomize Transformation For A Personalized Experience
Customize Transformation For A Personalized Experience
 

Recently uploaded

software engineering Chapter 5 System modeling.pptx
software engineering Chapter 5 System modeling.pptxsoftware engineering Chapter 5 System modeling.pptx
software engineering Chapter 5 System modeling.pptxnada99848
 
Professional Resume Template for Software Developers
Professional Resume Template for Software DevelopersProfessional Resume Template for Software Developers
Professional Resume Template for Software DevelopersVinodh Ram
 
EY_Graph Database Powered Sustainability
EY_Graph Database Powered SustainabilityEY_Graph Database Powered Sustainability
EY_Graph Database Powered SustainabilityNeo4j
 
Adobe Marketo Engage Deep Dives: Using Webhooks to Transfer Data
Adobe Marketo Engage Deep Dives: Using Webhooks to Transfer DataAdobe Marketo Engage Deep Dives: Using Webhooks to Transfer Data
Adobe Marketo Engage Deep Dives: Using Webhooks to Transfer DataBradBedford3
 
Salesforce Certified Field Service Consultant
Salesforce Certified Field Service ConsultantSalesforce Certified Field Service Consultant
Salesforce Certified Field Service ConsultantAxelRicardoTrocheRiq
 
Asset Management Software - Infographic
Asset Management Software - InfographicAsset Management Software - Infographic
Asset Management Software - InfographicHr365.us smith
 
办理学位证(UQ文凭证书)昆士兰大学毕业证成绩单原版一模一样
办理学位证(UQ文凭证书)昆士兰大学毕业证成绩单原版一模一样办理学位证(UQ文凭证书)昆士兰大学毕业证成绩单原版一模一样
办理学位证(UQ文凭证书)昆士兰大学毕业证成绩单原版一模一样umasea
 
Try MyIntelliAccount Cloud Accounting Software As A Service Solution Risk Fre...
Try MyIntelliAccount Cloud Accounting Software As A Service Solution Risk Fre...Try MyIntelliAccount Cloud Accounting Software As A Service Solution Risk Fre...
Try MyIntelliAccount Cloud Accounting Software As A Service Solution Risk Fre...MyIntelliSource, Inc.
 
Building a General PDE Solving Framework with Symbolic-Numeric Scientific Mac...
Building a General PDE Solving Framework with Symbolic-Numeric Scientific Mac...Building a General PDE Solving Framework with Symbolic-Numeric Scientific Mac...
Building a General PDE Solving Framework with Symbolic-Numeric Scientific Mac...stazi3110
 
KnowAPIs-UnknownPerf-jaxMainz-2024 (1).pptx
KnowAPIs-UnknownPerf-jaxMainz-2024 (1).pptxKnowAPIs-UnknownPerf-jaxMainz-2024 (1).pptx
KnowAPIs-UnknownPerf-jaxMainz-2024 (1).pptxTier1 app
 
Building Real-Time Data Pipelines: Stream & Batch Processing workshop Slide
Building Real-Time Data Pipelines: Stream & Batch Processing workshop SlideBuilding Real-Time Data Pipelines: Stream & Batch Processing workshop Slide
Building Real-Time Data Pipelines: Stream & Batch Processing workshop SlideChristina Lin
 
ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...
ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...
ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...Christina Lin
 
Steps To Getting Up And Running Quickly With MyTimeClock Employee Scheduling ...
Steps To Getting Up And Running Quickly With MyTimeClock Employee Scheduling ...Steps To Getting Up And Running Quickly With MyTimeClock Employee Scheduling ...
Steps To Getting Up And Running Quickly With MyTimeClock Employee Scheduling ...MyIntelliSource, Inc.
 
Implementing Zero Trust strategy with Azure
Implementing Zero Trust strategy with AzureImplementing Zero Trust strategy with Azure
Implementing Zero Trust strategy with AzureDinusha Kumarasiri
 
Russian Call Girls in Karol Bagh Aasnvi ➡️ 8264348440 💋📞 Independent Escort S...
Russian Call Girls in Karol Bagh Aasnvi ➡️ 8264348440 💋📞 Independent Escort S...Russian Call Girls in Karol Bagh Aasnvi ➡️ 8264348440 💋📞 Independent Escort S...
Russian Call Girls in Karol Bagh Aasnvi ➡️ 8264348440 💋📞 Independent Escort S...soniya singh
 
BATTLEFIELD ORM: TIPS, TACTICS AND STRATEGIES FOR CONQUERING YOUR DATABASE
BATTLEFIELD ORM: TIPS, TACTICS AND STRATEGIES FOR CONQUERING YOUR DATABASEBATTLEFIELD ORM: TIPS, TACTICS AND STRATEGIES FOR CONQUERING YOUR DATABASE
BATTLEFIELD ORM: TIPS, TACTICS AND STRATEGIES FOR CONQUERING YOUR DATABASEOrtus Solutions, Corp
 
Der Spagat zwischen BIAS und FAIRNESS (2024)
Der Spagat zwischen BIAS und FAIRNESS (2024)Der Spagat zwischen BIAS und FAIRNESS (2024)
Der Spagat zwischen BIAS und FAIRNESS (2024)OPEN KNOWLEDGE GmbH
 
Alluxio Monthly Webinar | Cloud-Native Model Training on Distributed Data
Alluxio Monthly Webinar | Cloud-Native Model Training on Distributed DataAlluxio Monthly Webinar | Cloud-Native Model Training on Distributed Data
Alluxio Monthly Webinar | Cloud-Native Model Training on Distributed DataAlluxio, Inc.
 
Cloud Management Software Platforms: OpenStack
Cloud Management Software Platforms: OpenStackCloud Management Software Platforms: OpenStack
Cloud Management Software Platforms: OpenStackVICTOR MAESTRE RAMIREZ
 

Recently uploaded (20)

software engineering Chapter 5 System modeling.pptx
software engineering Chapter 5 System modeling.pptxsoftware engineering Chapter 5 System modeling.pptx
software engineering Chapter 5 System modeling.pptx
 
Professional Resume Template for Software Developers
Professional Resume Template for Software DevelopersProfessional Resume Template for Software Developers
Professional Resume Template for Software Developers
 
EY_Graph Database Powered Sustainability
EY_Graph Database Powered SustainabilityEY_Graph Database Powered Sustainability
EY_Graph Database Powered Sustainability
 
Hot Sexy call girls in Patel Nagar🔝 9953056974 🔝 escort Service
Hot Sexy call girls in Patel Nagar🔝 9953056974 🔝 escort ServiceHot Sexy call girls in Patel Nagar🔝 9953056974 🔝 escort Service
Hot Sexy call girls in Patel Nagar🔝 9953056974 🔝 escort Service
 
Adobe Marketo Engage Deep Dives: Using Webhooks to Transfer Data
Adobe Marketo Engage Deep Dives: Using Webhooks to Transfer DataAdobe Marketo Engage Deep Dives: Using Webhooks to Transfer Data
Adobe Marketo Engage Deep Dives: Using Webhooks to Transfer Data
 
Salesforce Certified Field Service Consultant
Salesforce Certified Field Service ConsultantSalesforce Certified Field Service Consultant
Salesforce Certified Field Service Consultant
 
Asset Management Software - Infographic
Asset Management Software - InfographicAsset Management Software - Infographic
Asset Management Software - Infographic
 
办理学位证(UQ文凭证书)昆士兰大学毕业证成绩单原版一模一样
办理学位证(UQ文凭证书)昆士兰大学毕业证成绩单原版一模一样办理学位证(UQ文凭证书)昆士兰大学毕业证成绩单原版一模一样
办理学位证(UQ文凭证书)昆士兰大学毕业证成绩单原版一模一样
 
Try MyIntelliAccount Cloud Accounting Software As A Service Solution Risk Fre...
Try MyIntelliAccount Cloud Accounting Software As A Service Solution Risk Fre...Try MyIntelliAccount Cloud Accounting Software As A Service Solution Risk Fre...
Try MyIntelliAccount Cloud Accounting Software As A Service Solution Risk Fre...
 
Building a General PDE Solving Framework with Symbolic-Numeric Scientific Mac...
Building a General PDE Solving Framework with Symbolic-Numeric Scientific Mac...Building a General PDE Solving Framework with Symbolic-Numeric Scientific Mac...
Building a General PDE Solving Framework with Symbolic-Numeric Scientific Mac...
 
KnowAPIs-UnknownPerf-jaxMainz-2024 (1).pptx
KnowAPIs-UnknownPerf-jaxMainz-2024 (1).pptxKnowAPIs-UnknownPerf-jaxMainz-2024 (1).pptx
KnowAPIs-UnknownPerf-jaxMainz-2024 (1).pptx
 
Building Real-Time Data Pipelines: Stream & Batch Processing workshop Slide
Building Real-Time Data Pipelines: Stream & Batch Processing workshop SlideBuilding Real-Time Data Pipelines: Stream & Batch Processing workshop Slide
Building Real-Time Data Pipelines: Stream & Batch Processing workshop Slide
 
ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...
ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...
ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...
 
Steps To Getting Up And Running Quickly With MyTimeClock Employee Scheduling ...
Steps To Getting Up And Running Quickly With MyTimeClock Employee Scheduling ...Steps To Getting Up And Running Quickly With MyTimeClock Employee Scheduling ...
Steps To Getting Up And Running Quickly With MyTimeClock Employee Scheduling ...
 
Implementing Zero Trust strategy with Azure
Implementing Zero Trust strategy with AzureImplementing Zero Trust strategy with Azure
Implementing Zero Trust strategy with Azure
 
Russian Call Girls in Karol Bagh Aasnvi ➡️ 8264348440 💋📞 Independent Escort S...
Russian Call Girls in Karol Bagh Aasnvi ➡️ 8264348440 💋📞 Independent Escort S...Russian Call Girls in Karol Bagh Aasnvi ➡️ 8264348440 💋📞 Independent Escort S...
Russian Call Girls in Karol Bagh Aasnvi ➡️ 8264348440 💋📞 Independent Escort S...
 
BATTLEFIELD ORM: TIPS, TACTICS AND STRATEGIES FOR CONQUERING YOUR DATABASE
BATTLEFIELD ORM: TIPS, TACTICS AND STRATEGIES FOR CONQUERING YOUR DATABASEBATTLEFIELD ORM: TIPS, TACTICS AND STRATEGIES FOR CONQUERING YOUR DATABASE
BATTLEFIELD ORM: TIPS, TACTICS AND STRATEGIES FOR CONQUERING YOUR DATABASE
 
Der Spagat zwischen BIAS und FAIRNESS (2024)
Der Spagat zwischen BIAS und FAIRNESS (2024)Der Spagat zwischen BIAS und FAIRNESS (2024)
Der Spagat zwischen BIAS und FAIRNESS (2024)
 
Alluxio Monthly Webinar | Cloud-Native Model Training on Distributed Data
Alluxio Monthly Webinar | Cloud-Native Model Training on Distributed DataAlluxio Monthly Webinar | Cloud-Native Model Training on Distributed Data
Alluxio Monthly Webinar | Cloud-Native Model Training on Distributed Data
 
Cloud Management Software Platforms: OpenStack
Cloud Management Software Platforms: OpenStackCloud Management Software Platforms: OpenStack
Cloud Management Software Platforms: OpenStack
 

How OutSystems Accelerates PWA Development

  • 1. Native Mobile vs. Progressive Web App: Developer Evaluation Guide Swaran Soft - Tech Simplified -
  • 2. You have to build for mobile. But you don’t have to learn native iOS and Android development to do it. With just over half of all internet traffic serving mobile devices, your users expect smartphone friendly services. But does that mean you have to invest in the creation and maintenance of native mobile apps? There is an alternative. Progressive web apps (PWAs) give your users a native app-like experience but, under the hood, they’re just standard web applications with some mobile-friendly additions. The best of both worlds. Depending on your app’s needs, PWAs could help you get to market faster, improve discoverability, and reduce maintenance costs. In this evaluation guide, we present the pros and cons of PWAs, alongside how the OutSystems app development platform can help. By the end of this guide, you’ll be ready to decide which route to take for your next mobile project. Native Mobile vs Progressive Web App: Developer Evaluation Guide 2
  • 3. Introducing Progressive Web Apps It might seem like you have no choice. If you want to target mobile device users then you have to invest in native iOS and Android apps, right? Perhaps not. Progressive web apps offer an alternative. PWAs give you the tools to deliver a mobile app experience using everyday HTML, CSS, and JavaScript. They’re fast, work offline, and “install” to the device home screen with an app icon. So, what’s the catch? That depends on what your users need and we’ll cover the tradeoffs on page 7. First, let’s look at what goes into a PWA. PWA Fundamentals At heart, progressive web apps are just web applications. They work in any browser. However, relying on the principle of progressive enhancement, they gain extra functionality — such as working offline — when accessed using a modern browser. So, with a little extra work you can retrofit an existing web app to become a PWA. And, if you’re planning a new project, you can serve both web and mobile users equally from one code base and one deployment. Interested? Read on to learn more about how a progressive web app could be right for your next project. Native Mobile vs Progressive Web App: Developer Evaluation Guide 3
  • 4. PWA Fundamentals If PWAs are just web apps, how can they offer an alternative to native mobile apps? On modern browsers, including Safari, Chrome, and Edge, your PWA can take advantage of three technologies to deliver that app-like experience. On older browsers, your web app will work just like any other. So, what is it that makes a PWA a PWA? Service workers The key to a native mobile app-like experience, service workers let you run background JavaScript jobs directly on the device. That reduces the need for round trips to the server, meaning your PWA is more responsive and that it doesn’t always need a network connection. Offline cache Service workers are good for more than only improving responsiveness. They also allow you to cache data locally on the device. With functionality and data available offline, your PWA can work without a network connection and then sync with the server when the device is back online. App manifest Just like a native app, users can install your PWA on their devices. Each PWA comes with a JSON file called the app manifest. That specifies the icon, the app URL, and other associated data meaning that the user experience is nearly indistinguishable from a regular mobile app. Native Mobile vs Progressive Web App: Developer Evaluation Guide 4
  • 5. Business Benefits of PWAs From a development perspective, the benefits of a single codebase using standard web tooling are clear. But how do they help with user engagement and ROI? Discoverability Remember that PWAs are just web apps? As such, search engines index them just like any other website. With Google’s commitment to mobile-first indexing, PWAs rank higher and are commonly seen as snippet cards at the top of the first results page. Stickiness Once installed, PWAs become available on a device’s home screen just like any other app. Think of it as a portable web page that’s accessible with a single click or tap, without the user having to open the browser first. High performance According to a recent study by Google, 53% of users abandon mobile websites that take more than three seconds to load,1 so speed is critical to adoption. Since PWAs work offline first they load and run faster. Always up to date PWAs are always fresh. Each time a user connects to the server, the app can update automatically over-the-air, with no need for manual user approval. 1 https://www.thinkwithgoogle.com/consumer-insights/consumer-trends/mobile-site-load-time-statistics Native Mobile vs Progressive Web App: Developer Evaluation Guide 5
  • 6. Responsiveness PWAs are responsive by nature. They adapt to any screen size, and their behavior will be consistent regardless of device. Shareability PWAs can be easily shared and used via a link that doesn’t require a visit to the app marketplace or a lengthy download. Furthermore, when Android users can share links to PWAs with iOS users, they don’t need to distinguish the store being used to download the app. Native device capabilities Just like a native app, PWAs can make use of a device’s hardware features and storage. Your app can also allow users to make payments through built-in payment systems such as Apple Pay or Google Pay. Native Mobile vs Progressive Web App: Developer Evaluation Guide 6
  • 7. There is no app store revenue-sharing to skim off around 15% of the app’s income.2 Advantages of PWAs PWAs help speed your time to value with a shared code base between platforms and the ability to deploy without going through an app store. Built using existing skills: PWAs are built using familiar web technology such as HTML, CSS and JavaScript. Cross-platform compatibility: Because PWAs run on a browser (albeit invisibly to the user), they can operate on any device that can run a modern browser. You’re essentially offloading the cost of making your apps compatible with multiple devices to the browser vendors. This makes it much faster to build for multiple devices. Rapid upgrading/iterative improvement: This speed comes in handy not only in delivering a new app to market, but also when it comes to delivering improvements on apps that are already deployed. You can push updates directly to users without going through the provisioning process that app stores require. That means there’s no lag between finding a bug and fixing it in production. Lower costs: Time is money. With a single code base that works on all devices, you can cut development time compared to native application development and save the expense of a lengthy development process. Also, there is no app store revenue-sharing to skim off around 15% of the app’s income. 2 https://www.pocketgamer.biz/comment-and-opinion/68590/why-the-7030-app-store-revenue-split-is-doomed Native Mobile vs Progressive Web App: Developer Evaluation Guide 7
  • 8. PWA, web app or native app: Which to choose? Fast, reliable performance Multi-platform (mobile and desktop) Offline capabilities Advanced device capabilities (e.g., calendar, contacts, browser bookmarks) Support for demanding hardware usage (e.g., fingerprint or face identification) Integrations with camera, GPS, etc. Push notifications Storage requirements Distribution without app store Discoverable online Shareable and linkable Yes No Yes Yes Yes Yes Yes High No No No Native app No Yes No No No No No None Yes Yes Yes Web app Yes Yes Yes No No Yes Yes Low Yes Yes Yes PWA Native Mobile vs Progressive Web App: Developer Evaluation Guide 8
  • 9. 1 3 2 4 You should choose PWAs when you and your teams: Continually struggle to find the resources to launch new projects and complete projects on time. PWAs are typically quicker to build than web and mobile apps, so they’re a smart option for teams that need to prioritize speed. Need a stepping-stone for consumers to progressively adopt your applications (browser > PWA > mobile), especially in low-loyalty parts of their customer journeys (e.g., onboarding journeys). Want to increase the reach of your mobile presence by providing a lightweight version of a mobile application to cater to users with lower-end devices or who are in areas with unpredictable or low connectivity. Experience common obstacles to delivering mobile applications to consumers and employees, such as app stores and lengthy approval processes. Choose a native application if you need: Ingration with certain device capabilities, such as calendars, contacts, browser bookmarks, alarms or other applications. The ability to intercept SMS messages or calls or obtain users’ phone numbers. Demanding hardware usage such as fingerprint or facial recognition. The ability to launch without an internet connection. Native Mobile vs Progressive Web App: Developer Evaluation Guide 9
  • 10. How OutSystems Accelerates PWA Development If you choose to build a PWA, there are a number of advantages to doing so with OutSystems. Once you’ve created a mobile app using our rapid, intuitive visual development tool, you can distribute it as a PWA with a single toggle, so you can spend more of your time bringing greater value to users and less time repeating code. No additional knowledge required With the ability to create a reactive web app or mobile app using OutSystems, you have all the tools that you need to create a PWA right now. OutSystems takes care of the manifests and service workers necessary to create the PWA automatically. Single code base OutSystems lets you create the UI and front-end code for your mobile apps and PWAs once. You can engage customers and employees through web, mobile and progressive web apps without adapting the code for each device you want to support. Data sync framework Keeping local and server data in sync is no small task. OutSystems provides a framework for syncing data between your PWA and the server. Native Mobile vs Progressive Web App: Developer Evaluation Guide 10
  • 11. Streamlined deployment OutSystems allows customers to deploy PWAs with a toggle. The platform automatically generates all the resources needed for PWA deployment — metatags, app manifest, service workers and offline capabilities — without developer intervention. OutSystems is the only application development platform that does not require any specific code configuration to deploy a PWA. Most competing solutions require developers to manually create these assets and upload them to the server. What’s more, our PWAs achieve the maximum score on Google Lighthouse. Modern application platform PWA development takes advantage of the full benefits of the OutSystems platform: a visual, model-based development platform supporting the full DevOps lifecycle. The platform provides tools that support multi-disciplinary teams who ensure your apps meet business needs as well as performance requirements. Automated impact analysis and bug checking OutSystems uses automation, AI and analytics to remove the guesswork and repetition from development and delivery across design, build and runtime. TrueChange checks for architecture errors and dependencies, provides governance and monitors performance in real time. To see just how fast it is to build and deploy a PWA on the OutSystems platform, watch our demo video. Native Mobile vs Progressive Web App: Developer Evaluation Guide 11
  • 12. Use Cases for PWAs New customer onboarding PWAs reduce the friction typical of customer onboarding because they don’t require the time and additional steps of visiting an app market and downloading a new large app to their phone. Insurance Since users don’t (hopefully!) have to file an insurance claim every day, there’s no reason to force them into downloading a dedicated app. Retail loyalty programs The large number of loyalty apps discourages users from installing all the apps on their device. Airline mobile apps Users resist installing one app per airline, especially when they might be incurring roaming charges. That makes a PWA a great fit for this use case. Workflow management Applications that help in creating, monitoring and following processes and workflows. Transportation This includes B2C apps for taxi services, rental cars, city-share bikes and public transportation. Location specificity means that visitors would prefer not to download a full-size app. Critical aspects • Low footprint • GPS/geolocation • Camera • Push notifications Critical aspects • Push notifications Critical aspects • Push notifications Critical aspects • Low footprint, • Push notifications • Payment gateways Critical aspects • Flawless UI • GPS/geolocation • Push notifications Critical aspects • Low footprint • Push notifications Native Mobile vs Progressive Web App: Developer Evaluation Guide 12
  • 13. 2 APP DEVELOPMENT: CUSTOMER SUCCESS RESULTS: 15 20 IT staff trained to use OutSystems alongside five pro developers months minutes admin time eliminated from every consultation call Constellation is a growing portfolio of medical professional liability insurance and partner companies dedicated to reducing risk and supporting physicians and care teams. To support physicians facing lawsuits — something many will deal with at least once during their careers — Constellation’s clinician peer support program links healthcare professionals to skilled peers who provide professional and emotional support. Previously, this involved numerous time-consuming manual processes: emails, text messages and voicemails to schedule a consultation and follow-ups, and handle documentation, timekeeping, invoicing and more. Using OutSystems, Constellation built a progressive web app in just two months to streamline the peer support program’s communications, time-tracking and compensation processes. Apart from saving valuable time for clinicians, Constellation has grown its app dev team from five to 20, with other IT staff learning to use OutSystems alongside five professional developers. Read more about how Constellation built an integrated app in just two months. Native Mobile vs Progressive Web App: Developer Evaluation Guide 13
  • 14. About OutSystems Thousands of customers worldwide trust OutSystems—the only solution that enables the visual development of entire application portfolios that easily integrate with existing systems. Learn more at www.outsystems.com Want to know more? Contact Swaran Soft Support Solutions Pvt. Ltd.: Email Swaran Soft Support Solutions Pvt. Ltd. info@swaransoft.com Visit our site to learn more www.swaransoft.com www.lowcodedigitalfactory.com Next steps with [Swaran Soft Support Solutions Pvt. Ltd.] Swaran Soft is a Digital Transformation experienced in Digital Adoption, Omni Channel Commerce, IoT, ML, AI & Big Data. We serve large Global Corporates, Government, Institutions & Innovation Hungry Startups for end to end IT adoption & business continuity services. We envision longevity in our business relationships for a win-win associations. Swaran Soft - Tech Simplified - Partner SALES