PWA vs Native: чек-лист, который поможет выбрать

PWA подходит для быстрого запуска сервиса через браузер без обязательной установки. Нативное приложение стоит выбирать, если критичны глубокая работа с устройством, устойчивый офлайн-режим, производительность и платформенный UX.

Коротко

Чек-лист решения

Привет! Меня зовут Никита Грибков, я работаю Flutter-разработчиком в AGIMA. Мы с командой часто консультируем заказчиков о том, какой тип приложения им выбрать: нативное, кросс-платформенное или PWA. Я решил упростить себе работу и написать об этом статью. Но поскольку о разнице между кросс-платформой и нативом мы уже писали, сосредоточусь на разнице между нативом и PWA.

Что такое PWA

Progressive Web Apps (PWA) или прогрессивные веб-приложения — это не какой-то фреймворк или SDK. Это философия того, как надо строить современные веб-приложения. Говоря по-простому, это режим отображения веб-сайта, который можно запускать в виде приложения на смартфоне. Поэтому PWA могут работать на любом устройстве, будь то компьютер, планшет или смартфон.

С технологической точки зрения в PWA используются современные веб-стандарты, доступные в браузерах: HTML5, CSS3 и JavaScript. Подход PWA не накладывает каких-то особых ограничений на сами веб-приложения. Например, PWA могут быть одностраничными (SPA — single page applications) приложениями, а могут и не быть таковыми.

Главная особенность PWA — поддержка офлайн-работы с помощью механизма Service Worker’ов и связанная с этим возможность добавления иконки приложения на стартовый экран устройства пользователя. PWA-приложения есть у таких компаний, как, например, Tinder, Pinterest, Forbes, Aliexpress и Uber.

PWA vs Native

У прогрессивных приложений ряд преимуществ перед нативными. Однако, как и у любого другого подхода, у PWA есть и недостатки. Рассмотрим PWA в сравнении с нативными приложениями.

Преимущества прогрессивных приложений (PWA)

✔️ Кросс-платформенность.

PWA работает с большинством браузеров и операционных систем:

• Браузеры: Safari, Chrome, FireFox и др.
• OS: iOS, Android, macOS, Linux и др.

✔️ Более быстрое развертывание.

Создать PWA быстрее, чем разработать нативные приложения для разных платформ.

✔️ Производительность приложения.

Так как PWA по-прежнему является веб-сайтом, он не сравнится по скорости работы с нативными приложениями. Если сравнивать с React Native, масштаб беды невелик, а вот производительность PWA на Flutter будет гораздо выше RN-приложений.

✔️ Пуш-уведомления.

PWA позволяют отправлять пуш-уведомления благодаря Service Worker’ам. Однако эта функция зависит от платформы. Они доступны в браузерах Chrome, Opera, Safari и Mozilla и Safari в iOS.

Пуш-уведомления в PWA хорошо работают на Android, эта функция была добавлена в обновление 16.4 и включена по умолчанию для всех пользователей iOS.

✔️ Независимость от сторов.

Благодаря PWA долгие проверки обновлений контента приложения, возможное удаление приложения, непрозрачные проверки под капотом в Google Play/Apple Strore/App Gallery, уйдут в небытие. PWA — это приложение, которое собирается из браузера. Чтобы выложить приложение на сайт не нужны сторы, нужно просто загрузить его на домен.

Минусы PWA

1. Один из главных недостатков PWA заключается в том, что они могут быть медленнее, чем обычные веб-сайты. Это происходит из-за того, что PWA должны загружать все ресурсы, необходимые для работы приложения, включая шрифты, изображения и JavaScript-файлы. Если на сайте много контента, то это может замедлить загрузку страницы.
2. Некоторые устройства могут не поддерживать определенные функции PWA, такие как пуш-уведомления или офлайн-режим. Также некоторые браузеры могут не поддерживать возможности PWA.
3. PWA приложения обеспечивают безопасность за счет использования HTTPS-протокола, манифеста веб-приложения и Service Worker`ов. Они полагаются на защиту, предоставляемую браузером, и требуют предварительной защиты от таких атак, как CSRF, XSS, SQL-инъекций и других подобных угроз.

Преимущества нативных приложений перед PWA

✔️ Максимальная производительность и функциональность.

Нативные приложения могут полностью использовать функциональность устройства, обеспечивая высокую производительность и доступ к широкому спектру возможностей.

✔️ Полный доступ к устройственным функциям.

Нативные приложения могут взаимодействовать с камерой, сенсорами, геолокацией и другими устройственными возможностями.

✔️ Лучший пользовательский опыт.

Нативные приложения могут предоставить наилучшие пользовательский интерфейс и взаимодействие благодаря оптимизации под каждую платформу.

✔️ Доступ к магазинам приложений.

Размещение в магазинах приложений может увеличить видимость приложения и доверие пользователей.

✔️ Безопасность в приложение.

Нативные приложения считаются более безопасными из-за ряда факторов:

1. Приложения используют многофакторную аутентификацию.
2. Имеют SSL-сертификат.
3. Сторы имеют ряд правил, благодаря которым безопасность приложения находится на приемлемом уровне.

Минусы нативных приложений в сравнении с PWA

1. Необходимость разрабатывать отдельные версии для разных платформ (iOS, Android) может потребовать больше времени и ресурсов.
2. Обновления нативных приложений должны пройти процесс утверждения в магазинах приложений, что может вызвать задержки.
3. Нативные приложения требуют скачивания и установки, что может отпугнуть часть пользователей.

Отдельно хочу остановиться на ограничениях базовых функций платформ на iOS и Android. Подчеркнуты ограничения и функции, недоступные на апрель 2023 года.

Speech recording

В заключение приведу ситуации, когда вам стоит обратить внимание именно на прогрессивные веб-приложения.

У вас ограниченное время и бюджет.

PWA требуют меньше времени и средств для разработки и публикации. Если разрабатывать PWA с использованием фреймворка Flutter, то бизнес получает целый перечень приложений: Web + Mobile + PWA. Это дешевле, чем содержать три команды разработки: Android — Kotlin, iOS — Swift, Web — JS.

Вы хотите простое приложение для ваших пользователей.

PWA не требует загрузки и позволяет взаимодействовать с пользователями с помощью пуш-уведомлений. К тому же PWA поможет вам охватить невовлеченных пользователей — тех, кто предпочитает взаимодействовать с веб-сайтами. Обычно такие пользователи неохотно переходят на мобильные приложения, вероятностью этого составляет ≈30–60%. Прогрессивные веб-приложения могут повысить вероятность того, что пользователь будет использовать и Web, и PWA.

Вам нужна независимость от платформы.

PWA собирается под любую платформу Android и iOS, используя браузер. Поэтому неважно, с какой платформы было установлено приложение.

В остальных случаях лучше выбрать нативную разработку или рассмотреть кросс-платформу. Как выбрать между ними, мы уже рассказывали. Еще об этом можно узнать больше в телеграм-канале моего коллеги Саши Ворожищева, он знает всё про Flutter. А если у вас остались вопросы, готов ответить в комментариях.

Комментарии и обсуждения статьи на habr.