Прогрессивные веб-приложения

Введение #

• Что такое прогрессивные веб-приложения?
• Как прогрессивные веб-приложения помогают добиться успеха в бизнесе
• Как сделать хорошее прогрессивное веб-приложение?

Обеспечение возможности установки #

• Что нужно для возможности установки?
• How to define your install strategy

Как обеспечить возможность установки #

• Add a web app manifest
• Создание резервной страницы для автономного режима
• Как предоставлять собственный процесс установки в приложении
• Шаблоны для продвижения установки PWA
• Использование прогрессивного веб-приложения в приложении для Android
• PWAs in app stores

Проекты Codelabs #

• Да установится сайт!

Создание интерфейса, имитирующего приложение #

• Как сделать PWA-приложение похожим на обычное
• Progressively enhance your Progressive Web App

Функции, эксклюзивные для PWA #

• Get things done quickly with app shortcuts
• Поддержка адаптивных иконок в PWA благодаря маскируемым иконкам
• Customize the window controls overlay of your PWA's title bar

Дополнительные способы повысить удобство пользователя #

• Установлено ли ваше приложение? getInstalledRelatedApps() покажет!
• Интеграция с пользовательским интерфейсом обмена ресурсами ОС с помощью Web Share API

Продвинутые темы #

• How Chrome handles updates to the web app manifest
• Progressive Web Apps in multi-origin sites
• Building multiple Progressive Web Apps on the same domain
• Offline UX design guidelines

Разборы конкретных случаев #

• Deprecating Excalidraw Electron in favor of the web version
• Clipchamp's video editor PWA installs see a 97% monthly growth
• PWA users are 2.5x more likely to purchase Gravit Designer PRO
• JD.ID improves their mobile conversion rate by 53% with caching strategies, installation, and push notifications
• Rakuten 24’s investment in PWA increases user retention by 450%
• How ZDF created a video PWA with offline and dark mode
• How Goibibo's PWA improved conversions by 60%
• Building a PWA at Google, part 1