Progressive Web Apps (PWA)

Capítulo 111

Estimated reading time: 3 minutes

+ Exercise
Audio Icon

Listen in audio

0:00 / 0:00
Chapter 61: Progressive Web Apps (PWA)

Chapter 61: Progressive Web Apps (PWA)

Progressive Web Apps (PWA) are a new generation of web applications that offer a user experience similar to native applications. They combine the best features of web apps and mobile apps to create a unique and engaging user experience.

PWAs are built using standard web technologies like HTML, CSS, and JavaScript, but incorporate modern web features and design patterns that allow them to provide a user experience similar to that of a native app. This includes the ability to work offline, send push notifications, and be installed on the user's device home screen.

What makes a web app progressive?

There are three main characteristics that define a PWA:

  • Reliable: PWAs should load instantly and never show the network error screen, even in uncertain network conditions.
  • Fast: They should respond quickly to user interactions with smooth animations and no janky scrolling.
  • Engaging: They should look like a native app on the device's home screen, and users should be able to interact with them as they would with a native app.

How are PWAs built?

PWAs are built using a combination of modern web technologies and techniques, including:

  • Service Workers: Service workers are scripts that the browser runs in the background, separate from a web page, opening the door to features that don't need a web page or user interaction . They are key to enabling PWAs to work offline and provide push notifications.
  • Web App Manifest: The Web App Manifest is a JSON file that provides information about the application (such as name, author, icon, and description) in a way that devices can easily recognize and display.
  • HTTPS: To ensure user security, PWAs must be served over a secure connection.

Benefits of PWAs

PWAs offer several benefits over traditional web apps and native mobile apps, including:

Continue in our app.
  • Listen to the audio with the screen off.
  • Earn a certificate upon completion.
  • Over 5000 courses for you to explore!
Or continue reading below...
Download App

Download the app

  • User experience: PWAs offer a user experience similar to that of a native app, including the ability to work offline, send push notifications, and be installed on the home screen of the user's device.< /li>
  • Reach: Because PWAs are built using web technologies, they are accessible on any device with a web browser. This means they have a potentially much greater reach than native mobile apps, which need to be developed separately for different platforms.
  • Maintenance: Maintaining a PWA is generally easier and cheaper than maintaining a native mobile app, as you only need to maintain one codebase.

Challenges of PWAs

Despite their many benefits, PWAs also present some challenges, including:

  • Browser Compatibility: Although most modern browsers support the technologies used to build PWAs, there are still some differences between browsers in terms of what features they support.
  • Finding: Because PWAs are hosted on the web, they do not appear in app stores. This can make it harder for users to discover your app.

Despite these challenges, PWAs represent an exciting opportunity for developers to create high-quality, engaging user experiences using web technologies. They offer the potential to reach a wider audience, reduce maintenance costs, and provide a native app-like user experience.

Now answer the exercise about the content:

_Which of the following statements is true about Progressive Web Apps (PWA)?

You are right! Congratulations, now go to the next page

You missed! Try again.

Progressive Web Apps (PWA) combine the best features of web apps and mobile apps to create a unique and engaging user experience. They can work offline, send push notifications, and be installed on the user's device home screen. This makes Option 3 the correct statement as it accurately describes the capabilities and features of PWAs.

Next chapter

Mobile development with React Native

Arrow Right Icon
Free Ebook cover Complete HTML, CSS and Javascript course to become a Front End Developer
89%

Complete HTML, CSS and Javascript course to become a Front End Developer

3.79

(14)

125 pages

Download the app to earn free Certification and listen to the courses in the background, even with the screen off.