PWA vs мобильный веб: чем отличаются и что выбрать

Мы уже писали про PWA вот тут и тут. В этой статье рассмотрим эту технологию ещё с одной стороны — сравним его с мобильным веб-сайтом.

Веб-приложение — это программа, которая отвечает определённому запросу пользователя. Например, сервис поиска билетов: на сайте пользователь вводит данные, в это время веб-сервис обращается к компаниям, которые продают билеты. В результате пользователю отображаются подобранные по его запросам варианты.

Мобильная версия сайта (мобильный веб) — версия сайта, адаптированная для смартфонов, открывается с помощью мобильного браузера.

PWA (Progressive Web App) — один из способов реализации мобильного веба, технология, с помощью которой сайт преобразуется в веб-приложение визуально и функционально. Мы уже писали об этой технологии подробнее в этой статье.

Все эти технологии не стоит путать с мобильными приложениями — это отдельный продукт, который устанавливается из сторов.

Мобильные веб-приложения создаются с помощью технологий для реализации frontend: HTML, CSS, JavaScript — и backend: Ruby, PHP, Python и т. д. С точки зрения backend реализация не отличается от обычного веб-сайта. Любой мобильный веб можно превратить в PWA, если доработать под определённую цель. И это играет на руку бизнесу, который некогда развивал мобильный веб, но забросил. Теперь из мобильной версии сайта можно сделать PWA и запустить новый канал продаж.

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

Прежде чем выбрать технологию, нужно определиться с целью и дальнейшими планами проекта. Если нужен только мобильный веб, то подойдёт React, если в будущем возможен рост проекта и его дистрибуция для всех платформ, то Flutter.

У Flutter есть ещё преимущества, о которых мы подробно писали:

Чтобы установить PWA, достаточно зайти в браузер на сайт, который использует настройки для отображения в режиме «нативного приложения». В PWA приложении доступна ровно такая же функциональность, которая доступна для браузера. Например, доступ к камере или геолокации. Однако некоторые нативные функции могут быть недоступны. Например, доступ к батарее или графическому процессору.

Но это тоже решаемо:

Проблема №1 — в PWA невозможно встроить СКЗИ (средство криптографической защиты информации), нет готовых решений, согласованных с регулирующим органом. Это является одним из стоп-факторов применения PWA для банков.

Решение. На смартфоне пользоваться СКЗИ или электронной цифровой подписью можно. Ограничения есть только при использовании в мобильном браузере.

Проблема №2 — что выбрать: «приложение-зеркало» или PWA? Многие крупные компании и банки после удаления из сторов нашли быстрое решение: разместили свои нативные приложения, но под другими названиями.

Решение. Этот ход в краткосрочной перспективе позволил компаниям вернуться на площадки, однако в долгосрочной — после модерации многие были удалены. Кроме того, быстро создать приложение не получится, даже если каждая итерация тщательно записывалась в бэклог. На поднятие и развёртывание «приложения-зеркала» потребуется почти столько же ресурсов, сколько на написание с нуля. Экстремально короткие сроки обязательно скажутся на работоспособности приложения и отзывах пользователей.

Долгосрочное решение в виде разработки PWA будет эффективнее, чем впопыхах сделанное «зеркало». Если компания реализует бесшовную миграцию пользователей, ей удастся сохранить большую часть аудитории, и переход на PWA не повлияет на метрики.

Мобильные версии официальных сайтов — не новинка, а скорее «хорошо забытое старое». Многие крупные компании в своё время развивали их вслед за десктопными версиями сайтов. Однако после роста популярности мобильных приложений отказались от их активного развития.

В мобильных версиях можно легко отразить визуальный код бренда, но формат будет всегда ограничен только самым необходимым: значком авторизации, лаконичным меню, поиском, корзиной (в e-commerce).

Технология PWA — не новинка на рынке, однако стремительный рост показала относительно недавно. Многие компании создают прогрессивные веб-приложения для замены нативным или в качестве дополнительного канала продаж. PWA пользуют ритейлеры: Спортмастер, DNS; Тинькофф банк; сервисы: aviasales.ru, ivi.ru и соцсеть «В Контакте».