Прогрессивные веб-приложения – https://web.dev/progressive-web-apps/
Learn PWA – https://web.dev/learn/pwa/
What PWA Can Do Today – https://whatpwacando.today/
Helping developers build and publish PWAs – https://www.pwabuilder.com/
PWA APP ICON GENERATOR – https://tools.crawlink.com/tools/pwa-icon-generator/
Lighthouse – https://chrome.google.com/webstore/detail/lighthouse/blipmdconlkpinefehnmjammfjpmpbjk
PWA для WordPress: простая настройка прогрессивного веб-приложения (5 сентября, 2021) – https://bforbloggers.com/ru/progressive-web-application-pwa-for-wp/
Вот список сайтов, которые используют PWA — https://pwa.rocks
How To Convert Your WordPress Site into a PWA (March 16, 2020) – https://www.agiratech.com/how-to-convert-your-wordpress-website-into-a-pwa
How to build a PWA from scratch with HTML, CSS, and JavaScript – https://www.freecodecamp.org/news/build-a-pwa-from-scratch-with-html-css-and-javascript/
Progressive Web Apps – что это такое и для чего оно нужно – https://medium.com/maddevs-io/progressive-web-apps-prakticheskoe-rukovodstvo-cc2cd02bc6fe
Add a web app manifest (Jun 20, 2022) – https://web.dev/add-manifest/
Web App Manifest – https://developer.mozilla.org/ru/docs/Web/Manifest
Progressive Web Apps в WordPress (17.08.2018) – https://ivannikitin.com/2018/08/17/pwa-in-wordpress/
Минимальное PWA (16 марта 2021) – https://habr.com/ru/post/547436/ – (Я возьму пустой HTML-файл и буду постепенно добавлять к нему артефакты, превращающие его в PWA)
Превращаем веб-сайт в PWA – https://medium.com/nuances-of-programming/превращаем-веб-сайт-в-pwa-fe54a03f89bb
PWA — это просто – https://habr.com/ru/post/418923/
PWA — это просто. Hello Habr – https://habr.com/ru/post/419585/
PWA — это просто. Hello Joomla – https://habr.com/ru/post/419879/
habr-pwa – https://github.com/altrusl/habr-pwa#readme
Как запустить мобильное приложение за две недели с помощью PWA (15 августа 2022) – https://habr.com/ru/post/682526/
ReactPWA · An extendable boilerplate built on top of PawJS – https://www.reactpwa.com/
Starbucks смогли в два раза увеличить количество ежедневных пользователей – https://www.pwastats.com/2020/02/starbucks/
Как сделать из сайта приложение и выложить его в Google Play за несколько часов. Часть 1/2: Progressive Web App – https://habr.com/ru/company/vk/blog/450504/
Как сделать из сайта приложение и выложить его в Google Play за несколько часов. Часть 2/2: Trusted Web Activity – https://habr.com/ru/company/vk/blog/450506/
Офлайн-приложения: сборник рекомендаций – https://web.dev/offline-cookbook/
Обновление вашего PWA в продакшене – https://habr.com/ru/post/535428/
Я сделал PWA и выложил в трёх магазинах приложений. И вот что я выяснил (31 мая 2018) – https://habr.com/ru/company/nix/blog/412769/
PWA не для всех (20 сентября 2020) – https://habr.com/ru/post/519880/
для Node.js – https://github.com/web-push-libs/web-push
Плагины
Super Progressive Web Apps – https://wordpress.org/plugins/super-progressive-web-apps/
PWA – https://wordpress.org/plugins/pwa/
Progressive Web Apps – https://ru.wordpress.org/plugins/progressive-web-apps/ (не поддерживается)
PWA for WP & AMP – https://wordpress.org/plugins/pwa-for-wp/
Как интегрировать PWA в сайт
1. Добавить файлы manifest и serviceworker
- Инструкция по добавлению файла manifest в проект. Пояснение по полям файла – https://pwa-workshop.js.org/1-manifest/
- Ресурс для генерации файла manifest – https://app-manifest.firebaseapp.com/
- Документация по manifest от разработчиков Mozilla. Примеры файла manifest, пояснение по полям, совместимость с браузерами – https://developer.mozilla.org/en-US/docs/Web/Manifest
- Инструкция по добавлению файла serviceworker, его регистрация, жизненный цикл – https://pwa-workshop.js.org/2-service-worker/
- Документация по serviceworker от разработчиков Mozilla. Примеры файла, архитектура, жизненный цикл, кеширование, запросы – https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API/Using_Service_Workers
2. Подключить и настроить библиотеки workbox
- Документация по всем способам и вариациям подключения workbox – https://developer.chrome.com/docs/workbox/the-ways-of-workbox/
- Все возможные фреймворки и библиотеки, интегрированные с workbox – https://developer.chrome.com/docs/workbox/framework-integrations/
3. Добавить кнопки на сайте для установки приложения
- Инструкция по добавлению кнопки установки приложения – https://web.dev/customize-install/
- Инструкция по добавлению кнопки установки приложения – https://javascript.plainenglish.io/creating-a-browser-agnostic-pwa-install-button-41039f312fbe
4. Запросить разрешения на отправку push-уведомлений
- Документация о push-уведомлениях со всеми тонкостями – https://web.dev/notifications/
- Инструкция от разработчиков Mozilla по добавлению push-уведомлений – https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps/Re-engageable_Notifications_Push
Последующие пункты необязательны, но могут пригодиться для дополнительных этапов интеграции.
5. Настроить различные стратегии кэширования для статичных файлов
- Инструкция по настройке стратегий кеширования с примерами и пояснением – https://pwa-workshop.js.org/4-api-cache/
- Вариации стратегий кеширования, пояснение каждой – https://intercom.help/progressier/en/articles/5703064-what-s-a-caching-strategy
6. Настроить показ уведомлений при обновлении кеша
Документация от разработчиков Mozilla по событию обновления кеша – https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerRegistration/updatefound_event
7. Запись и чтение данных в IndexedDB
- Документация от разработчиков Mozilla по IndexedDB, интерфейсам, спецификацией – https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API
- Документация по IndexedDB с примерами использования – https://web.dev/indexeddb/