# Progressive web apps

In this guide, we will take you through everything you need to know about PWAs and how to enable them in your app.

### What is a PWA?

A PWA, or Progressive Web Application, is a web application that uses modern web technologies to deliver a native app-like experience to its users. PWAs are designed to work on any device, regardless of the operating system or screen size. PWAs can be accessed through web browsers and can be installed on the user's device, giving them an app-like experience. As a result, users of your app will have the option to install it, just like a native app.

### Benefits of PWA

We have integrated PWA to provide users with a seamless and fast experience. Some of the benefits of PWA:

* Faster load times: PWAs are designed to load quickly, even on slow network connections.
* Push notifications: PWAs can send push notifications to the user's device, increasing user engagement.
* App-like experience: PWAs offer an experience similar to a native app, with a smooth and responsive interface.

### Enabling PWA

{% hint style="info" %}
In order to install a PWA, your app [favicon](/~/revisions/4ycMT0EcUe4aYSGLpT5Z/settings/general-settings/custom-logos.md#update-the-apps-favicon) needs to be exactly 192 x 192px
{% endhint %}

Enabling PWA for your app is easy and straightforward. Follow these steps to enable PWA:

1. Go to your app settings page, or you can visit: <https://portals.noloco.io/~/_/settings/pwa>, and you can choose the app you want, or it will automatically open the last active app after 5 seconds.&#x20;
2. Switch the toggle to enable PWA. Please make sure that you have added a title, a description, and a favicon icon, and have published your app.
3. Now, just head to your app and do a reload. You will see a prompt to install the app.

<figure><img src="/files/4Wh3GNWaxU10ZuszwyIK" alt=""><figcaption></figcaption></figure>

#### Installing PWA on desktop

<figure><img src="/files/GBmkEKi4M5r9N9rjY44y" alt=""><figcaption></figcaption></figure>

#### Installing PWA on mobile

<figure><img src="/files/ldjgCfgiWbfKmhJimsMv" alt="" width="300"><figcaption></figcaption></figure>

### Instant PWA Functionality

Enabling PWA for your Noloco app is seamless. Simply enable it from the PWA settings in your app. Your app users can then install it directly from their browsers, when they open your app, making it accessible from their home screens.

### Cross-Platform Compatibility

Whether your users are on iOS, Android, Windows, or MacOS, they can download and engage with your app as if it were a native application, ensuring a uniform experience across all devices.

### Native Push Notifications

Keep your app users engaged with native push notifications. Whether it’s for comments, mentions, or any custom Noloco notifications, this feature ensures that your users stay informed and engaged with your app, wherever they are.

Notifications will still appear in your notification centre, but if notification permissions are given to your app, then notifications will be sent as native notifications, whether the app is open or not.

### Frequently Asked Questions

<details>

<summary>My PWA won't install</summary>

Please ensure that you are using a favicon with dimensions 192 x 192px in your project if you intend on installing it as a PWA

</details>

<details>

<summary>How do I install a PWA on iOS?</summary>

Simply follow these steps to install your PWA on iOS:

1. On your iOS device open Safari.
2. Go to the app URL.
3. At the bottom of the screen, tap the Share icon (with the arrow pointing up)
4. Scroll down the list of options, then tap Add to Home Screen.
5. Tap on Add at the top right.

</details>

<details>

<summary>What plan do I need to enable PWAs?</summary>

PWAs are currently available to users on all Noloco plans but please check our [pricing page](https://noloco.io/pricing) for the latest availability

</details>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://guides.noloco.io/~/revisions/4ycMT0EcUe4aYSGLpT5Z/settings/progressive-web-apps.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
