Меня зовут Максим, я веб-разработчик. Каждый третий клиент, который приходит ко мне за сайтом, рано или поздно задаёт вопрос: «А может, нам ещё и мобильное приложение сделать?» И в 80% случаев я отвечаю: «Вам не нужно приложение. Вам нужно PWA». Progressive Web App — технология, которая превращает сайт в приложение: с установкой на главный экран, push-уведомлениями, работой оффлайн. А благодаря Project Fugu — инициативе Google по расширению возможностей веба — PWA в 2026 году умеют то, что раньше было доступно только нативным приложениям. Расскажу, что именно.
Что такое PWA и почему это не «просто сайт»
PWA — это веб-приложение, которое выглядит и ведёт себя как нативное мобильное приложение:
Установка. Пользователь нажимает «Добавить на главный экран» — и на рабочем столе телефона появляется иконка вашего приложения. Запускается в отдельном окне, без адресной строки браузера — как настоящее приложение.
Оффлайн. Через Service Worker PWA кэширует ресурсы и может работать без интернета. Каталог товаров, расписание, контакты — доступны даже в метро.
Push-уведомления. Отправляйте уведомления на телефон пользователя — как из нативного приложения. «Ваш заказ отправлен», «Новая акция», «Напоминание о записи».
Быстрая загрузка. При повторном визите PWA загружается мгновенно — из кэша, без ожидания сети.
Автоматические обновления. Новая версия разворачивается на сервере — и при следующем запуске пользователь автоматически получает обновление. Без App Store, без модерации, без ожидания.
Project Fugu: новые возможности веба
Project Fugu — совместная инициатива Google, Microsoft и Intel по расширению Web API. Цель: дать веб-приложениям те же возможности, что и нативным, при этом сохраняя безопасность и приватность.
Что уже доступно в 2026 году:
File System Access API. Веб-приложение может открывать, редактировать и сохранять файлы на устройстве пользователя. Не загрузка через `<input type="file">`, а полноценная работа с файловой системой. Для документ-редакторов, IDE, графических редакторов — раньше это было невозможно без нативного приложения.
Web Bluetooth. Подключение к Bluetooth-устройствам: фитнес-трекерам, IoT-датчикам, принтерам. Для бизнеса: веб-приложение кассира подключается к Bluetooth-принтеру чеков — без нативного приложения.
Web USB. Подключение к USB-устройствам: принтерам этикеток, сканерам штрихкодов, электронным весам. Складской PWA работает с периферией через браузер.
Web NFC. Чтение и запись NFC-меток. Для логистики: сканирование NFC-меток на товарах через телефон, прямо из веб-приложения.
Contact Picker API. Доступ к контактам телефона (с разрешения пользователя). Для реферальных программ: «Пригласить друга» — выбрать контакт из телефонной книги.
Barcode Detection API. Распознавание штрихкодов и QR-кодов через камеру. Для складских и логистических PWA — сканирование без сторонних библиотек.
Web Share API. Нативное меню «Поделиться» — как в обычных приложениях. Пользователь нажимает «Поделиться» — и может отправить ссылку через Telegram, WhatsApp, email.
Badging API. Бейдж с числом на иконке приложения: «3 новых сообщения». Как у нативных приложений.
Когда PWA лучше нативного приложения
Я рекомендую PWA вместо нативного приложения, когда:
Ваша аудитория не будет скачивать приложение из стора. Факт: средний пользователь устанавливает 0 новых приложений в месяц. Барьер установки из App Store/Google Play — огромен. PWA устанавливается в один клик с сайта или по QR-коду.
Бюджет ограничен. Нативное приложение (iOS + Android) стоит 2–5 миллионов рублей. PWA — в 3–5 раз дешевле, потому что это один код для всех платформ (и для десктопа тоже).
Нужны быстрые обновления. Обновление нативного приложения: разработка → тестирование → загрузка в стор → модерация (1–3 дня для App Store) → пользователь обновляет. PWA: разработка → тестирование → деплой → пользователь получает обновление автоматически при следующем запуске.
Не нужны тяжёлые нативные функции. Если вашему приложению не нужен доступ к GPS-трекингу в фоне, Bluetooth LE в фоне, сложная обработка видео или ARKit/ARCore — PWA достаточно.
Когда нативное приложение всё-таки нужно
Требуется фоновая работа. GPS-трекинг для курьеров, фоновая синхронизация данных, фоновое воспроизведение аудио — PWA ограничено в фоновом режиме.
Сложная нативная функциональность. Продвинутый AR (ARKit), работа с HealthKit (Apple), интеграция с Apple Watch/WearOS.
Присутствие в сторе критично. Для массовых потребительских продуктов (такси, еда, банкинг) — присутствие в App Store и Google Play всё ещё важно для обнаружимости.
iOS-ограничения. Apple сознательно ограничивает PWA на iOS: нет push-уведомлений в фоне (только когда PWA открыто), нет Badging API, ограниченная поддержка Service Worker. Для аудитории с преобладанием iPhone — это серьёзное ограничение.
Как я создаю PWA
Технический стек
Next.js — основа. Серверный рендеринг для SEO, React для интерактивности, API Routes для бэкенда.
next-pwa или Serwist — библиотека для автоматической генерации Service Worker и manifest.json. Настройка кэширования, стратегии обновления.
Web Push API + Push-сервис. Для push-уведомлений: VAPID-ключи, подписка пользователя через Service Worker, отправка уведомлений с сервера. Для отправки использую web-push (Node.js-библиотека) или сервисы вроде OneSignal.
Manifest.json
Файл, который описывает PWA для браузера:
- `name` и `short_name` — название приложения
- `icons` — иконки для разных размеров экрана
- `start_url` — URL, который открывается при запуске
- `display: "standalone"` — запуск в отдельном окне (без адресной строки)
- `theme_color` — цвет системного бара
- `background_color` — цвет при загрузке
Service Worker
Скрипт, который работает в фоне и управляет кэшированием и push-уведомлениями. Стратегии кэширования:
- App Shell: структура приложения (HTML, CSS, JS) кэшируется при первом визите — последующие запуски мгновенны
- Runtime caching: данные (товары, расписание) кэшируются при запросе с выбранной стратегией (Cache First, Network First, Stale While Revalidate)
- Precaching: критические ресурсы загружаются в кэш при установке
Установка PWA
Браузер автоматически предлагает установить PWA, если соблюдены условия: HTTPS, manifest.json, Service Worker. Дополнительно я добавляю кастомный баннер «Установите наше приложение» с инструкцией.
Для iOS — отдельная инструкция: «Нажмите кнопку "Поделиться" → "На экран Домой"». К сожалению, iOS не показывает автоматический промпт установки.
Реальные проекты на PWA
Складское PWA для логистической компании
Мобильное приложение для кладовщиков: приёмка товара, перемещение, инвентаризация. Работает через браузер на бюджетных Android-смартфонах.
Что умеет:
- Сканирование штрихкодов через камеру (Barcode Detection API)
- Работа оффлайн (операции записываются локально и синхронизируются при появлении связи)
- Push-уведомления о новых поставках
- Подключение к Bluetooth-сканеру для быстрого сканирования
Стоимость: 600 тысяч рублей (vs 2,5 миллиона за нативное приложение). Срок: 2 месяца.
PWA для сети кофеен
Программа лояльности: QR-код при оплате → баллы → бесплатный кофе. Плюс: меню с ценами, ближайшая кофейня на карте, push с персональными акциями.
Стоимость: 350 тысяч рублей. Срок: 6 недель. Установили 4 200 клиентов за 3 месяца (vs прогноз 1 500 скачиваний для нативного приложения).
PWA для застройщика
Публичная часть: ход строительства, планировки, ипотечный калькулятор. Личный кабинет дольщика: документы, платежи, камеры строительства. Push-уведомления: «Ваш дом достроен до 7-го этажа».
Стоимость: 800 тысяч рублей. Работает на всех устройствах — от iPhone 15 до бюджетного Redmi.
Стоимость разработки PWA
Базовое PWA (установка, оффлайн, push, кэширование). Надбавка к стоимости обычного сайта: +50–150 тысяч рублей.
PWA с продвинутым функционалом (сканер штрихкодов, Bluetooth, оффлайн-синхронизация). Срок: 1,5–3 месяца. Бюджет: 400–900 тысяч рублей.
Полноценное PWA-приложение (замена нативного, с программой лояльности, личным кабинетом, интеграциями). Срок: 2–4 месяца. Бюджет: 600 тысяч — 1,5 миллиона рублей.
Сравните с нативным: iOS + Android = 2–5 миллионов + ежегодные 100$ за Apple Developer Account + модерация + поддержка двух кодовых баз.
Если хотите обсудить PWA для вашего бизнеса — обращайтесь.