Справочная информация о прогрессивных веб-приложениях и мини-информационной панели
Прогрессивные веб-приложения (PWA) — это шаблон для создания веб-сайтов, похожих на приложения, с мгновенной загрузкой, надежных и удобных для установки.
Когда ваше PWA пройдет проверку на пригодность к установке на Android, в нижней части окна браузера появится системное диалоговое окно Chrome, называемое мини-информационной панелью.
Сегодня мини-информационная панель «Добавить на главный экран» отображается одновременно с событием beforeinstallprompt .
Изменения в Chrome 76
Мы прислушались к мнению нашего сообщества и узнали, что разработчики хотят иметь больше контроля над тем, когда предлагать пользователям установить PWA. Мы вас услышали!
Начиная с Chrome 76, вы можете отключить мини-информационную панель, вызвав preventDefault() для события beforeinstallprompt .
Событие beforeinstallprompt может помочь вам ускорить установку вашего прогрессивного веб-приложения, упрощая пользователям добавление его на главный экран. Наше сообщество отмечает, что пользователи, устанавливающие PWA на главный экран, демонстрируют высокую вовлечённость, чаще посещают приложение, проводят в нём больше времени и, при необходимости, демонстрируют более высокий показатель конверсии.
Чтобы продвигать веб-приложение без мини-информационной панели, дождитесь события beforeinstallprompt и сохраните его. Затем обновите пользовательский интерфейс, указав возможность установки вашего PWA, например, добавив кнопку установки, баннер с предложением установки, используя рекламные объявления в ленте новостей или пункт меню. Когда пользователь нажимает на элемент install, вызовите prompt() для сохранённого события beforeinstallprompt , чтобы отобразить модальное диалоговое окно добавления на главный экран.
Будущее мини-информационной панели «Добавить на главный экран»
Использование информационной панели «Добавить на главный экран» пока является временной мерой. Мы экспериментируем с новыми шаблонами пользовательского интерфейса, которые позволят пользователям Progressive Web App продолжать устанавливать приложения, и делаем это таким образом, чтобы уменьшить загромождение в процессе просмотра.