Progressive Web Apps для InstantCMS

ВАЖНО: Компонент не работает без SSL сертификата (https)

Компонент поможет подготовить ваш сайт к работе с Progressive Web Apps (PWA).

Progressive Web Apps (Прогрессивные веб приложения) — это приложения, которые работают через веб внутри браузера, но при этом выглядят и ведут себя как нативные приложения. Google акцентирует три основных особенности PWA:

• Надежность – мгновенная загрузка и никаких сообщений об ошибке даже при нестабильном соединении
• Скорость – высокая отзывчивость, плавная анимация и никакого тупого скроллинга
• Привлекательность – сайт ощущается как нативное приложение для платформы с продуманным интерфейсом

Установка и настройка

После установки зайдите в админку — компоненты — PWA инструмент и выполните 3 шага.

Загрузка иконки — иконки отображается в списке приложении в телефонах.

Манифест — хранить данные о вашем сайте, имя приложение,

После этого посетители вашего сайта (если их браузер поддерживает), увидят запрос на установку сайта и будет работать как приложение. При посещение страниц через приложение, они кэшируются и потом можно посмотреть их даже если нет интернета.

Возможные проблемы и вопросы

1) Расширение Lighthouse показывает оценку меньше 100. Такая проблема возникает при повтором сканирование сайта. т.е. первый раз показывает 100, потом расширение перестает увидит манифест и другие скрипты, не знаю с чем это связано, но помогает только полная очистка кэш браузера.

2) Сайт без интернета криво отображается. Такая проблема возникает когда вы не указали какой то необходимый скрипт для кэширование (см. настройки Service worker), воспользуйтесь подсказкой при указанны файлов на кэширования.

3) Как остановить/перезагрузить работу Service worker? — для этого в Хроме нажмите F12 — вкладка Application — Service Workers — нажмите кнопку Unregister