PWA не для всех

    В комментах к моей предыдущей статье о service worker'ах была высказана мысль, что PWA на десктопах - вещь малополезная. Примерно полгода назад я разбирался с тем, как прикрутить PWA Vue Storefront к магазинам на платформе Magento и мне понравилось, как шустро крутилось в моём компьютере это приложение по сравнению с оригинальным web-интерфейсом. Мой персональный опыт показывал, что PWA на десктопах имеет неплохую перспективу, но дальнейшее углубление в тему показало, что коллега @sumanai со своим отрицанием PWA на десктопах был прав.

    Offline

    Какая основная "фишка" прогрессивных web-приложений?

    Способность работать в режиме offline.

    Эта способность прежде всего актуальна для мобильных устройств (смартфоны и планшеты), и, в какой-то мере, для ноутбуков. Десктопы же практически всегда находятся в зоне стабильно работающего интернета.

    Ввод-вывод

    По способу ввода ("сенсорный экран" против "клавиатура + мышь") и отображения информации (размер дисплея в дюймах) устройства можно разделить на две больших группы:

    • смартфоны и планшеты

    • ноутбуки и десктопы

    Web-интерфейсы

    Современные браузеры предлагают разнообразный API для web-приложений, большая часть которого работает для обеих групп устройств. Тем не менее вот эти три интерфейса актуальны именно для смартфонов/планшетов:

    IndexedDB

    Для "осознанного" кэширования запросов (например, на уровне service worker'ов) современные браузеры предоставляют Cache API, но основным хранилищем данных при работе в режиме offline является IndexedDB. Серверная база данных общего пользования (MySQL, Postgres, Oracle, MongoDB, ...) в этот момент заменяется базой данных персонального пользования (IndexedDB).

    В online-режиме самым очевидным поведением является как можно быстрее передать данные в центральное хранилище на сервере или получить из него наиболее актуальные данные. Для условий стабильного интернет-соединения IndexedDB - это пятое колесо в телеге. Для offline режима - жизненная необходимость, позволяющая кэшировать получение данных от пользователя до момента установления соединения с сервером.

    SEO

    В моей статье "Влияние service worker'ов на web-приложения" я пришёл вот к такой схеме работы PWA:

    При общении браузера с сервером возникают два потока информации:

    • статика: это код (HTML/CSS/JS) и медиа-файлы (в основном изображения), которые могут кэшироваться service worker'ом;

    • API: это пользовательские данные, которые так или иначе должны мигрировать между серверным хранилищем (DB) и персональным хранилищем (IndexedDB);

    PWA - это прежде всего альтернатива native apps для мобильных устройств. Native apps также можно рассматривать с позиции, что статика (код + медиа) сворачивается в один пакет и распространяется через App Store или Google Play, а данные передаются между приложением и сервером через API (с учётом offline/online состояния подключения). И при этом никто не ожидает, что поисковики должны индексировать API-запросы native apps. От web-приложений же наоборот ждут, что любой адрес (страница) на сервере должен иметь возможность быть собранным на стороне сервера, в том числе и для индексации поисковиками.

    Резюме

    PWA - это, в первую очередь, альтернатива native apps для мобильных устройств.

    PWA должны обеспечивать работу в режиме offline, что сильно усложняет разработку клиентской части, но является бесполезным функционалом для десктопов с их стабильным online-режимом работы сети.

    Особенности взаимодействия пользователя со смартфоном/планшетом (ввод-вывод, гео-позиционирование) достаточно сильно отличаются от особенностей взаимодействия пользователя с десктопом/ноутбуком. Создание универсального решения ("амфибии") добавляет сложности по отношению к двум решениям - отдельно для смартфонов/планшетов и отдельно для ноутбуков/десктопов. Причём не столько с точки зрения кодирования, сколько с точки зрения UX.

    PWA хорошо подходят для мобильных пользователей, но очень плохо подходят для поисковых роботов, что бы там себе ни думал по этому поводу Google.

    Похожие публикации

    AdBlock похитил этот баннер, но баннеры не зубы — отрастут

    Подробнее
    Реклама

    Комментарии 15

      0
      Вполне очевидно, что на десктопах и так можно почти всё делать «оффлайн», просто залив всё в один html. Не будет «красивого» доступа к файловой системе, но всё остальное — будет. А уж если прибавить к этому Electron, то и упаковывать всё в html не придётся, и доступ к файловой системе будет какой угодно.

      Естественно, что при таких вводных PWA на десктопе особо никому не впился.
        +2
        На Windows PWA может получить доступ к UWP API, если будет распространяться пакетом через стор.
          0

          Еще PWA работает в песочнице — не может повредить компьютеру. Т.е. безопасность веб приложений + своя иконка тема, окно, офлайн и так далее.

          +3
          Тут больше вопрос — какого рода у вас приложение и что вы от него хотите в на десктопе и в оффлайне. Мне нравится то, что PWA работает как визуально почти нативное приложение. У него есть иконка, он запускается отдельно. И если вдруг нет сети — оно будет работать и хотя бы говорить, что сети нет. Обычный веб-сайт такого не умеет, хотя если добавить сервис воркеры, то будет почти что то же самое.
            0
            Вообще-то умеет, сообщение об отсуствии интернета от самого браузера? Ну и потом, сайт может быть закэширован и работать оффлайн, в чём собственно проблема?
              +1
              Ну и потом, сайт может быть закэширован и работать оффлайн, в чём собственно проблема
              Никаких проблем, это часть технологии под названием PWA
                0
                тут можно поспорить, так кэширование доков появилось гораздо раньше, чем идеи об ПВА и сделанно это было в целях экономии трафика, а не как не для создания «приложений» из сайтов. Тем более закэшированный сайт имеет ограничения перед ПВА
                  0
                  Если под кешированием имеется ввиду сохранение вебстраницы — да, оно появилось давно, но в современном вебе применимо только в статьям и собственно разработчик сайта тут сделать ничего не может
                    0
                    чего? Только в статьях? Активно используется вообще-то, ради интереса, попробуй отключить кэш в браузере на денёк — увидишь как сильно изменится картина всего веба.
            0

            У меня главным ограничением стало 10мб хранилища. Я рад делать приложеньки, которые выглядят как нативные для юзера, но невозможность сохранить кусочек контента (скачать урок, статью, видео) это прям беда.


            Кстати про полный онлайн для десктопа — я бы не был уже так уверен. Лэптоп как основной рабочий девайс сегодня не редкость, да, дома/в офисе он в сети всегда, но его берут с собой на встречи, сидят с ним в кафе, в переговорке или может появится время в дороге — это тот момент когда оффлайн очень помогает. Конечно это редкие, но, как говорится "меткие" моменты.

              0

              Для IndexedDB ограничения размера хранилища в 10Mb нет. Поведение зависит от браузера. В общем случае есть уровень (10Mb, 50Mb, ...) после которого браузер запрашивает у пользователя разрешение для приложения использовать больше пространства для хранения данных, после чего можно сохранять сотни мегабайт, гигабайты и даже десятки гигабайт (если размер памяти устройства позволяет). Для Safari ограничение на размер IndexedDB — 500Mb на одно приложение (origin).


              Кстати про полный онлайн для десктопа — я бы не был уже так уверен.

              Да, ноутбуки (лэптопы) относятся к мобильным устройствам и могут попадать в offline mode. Но у них другой интерфейс взаимодействия с пользователем, по сравнению со смартфонами (основная целевая аудитория для PWA) и планшетами. Можно заморочиться и сделать PWA и для них, и для десктопов (которые практически всегда online), просто это будет гораздо сложнее из-за разницы интерфейсов устройств (размеры дисплея и методы ввода информации), придётся учитывать разный User Experience. Но да, если ресурсы позволяют, то можно и для ноутов запилить PWA. Просто эффективность PWA для смартфонов выше, чем для ноутбуков.

                0

                Ого. Я это пропустил. Уже даже начинаю сомневаться что верно в прошлый раз нашел ограничение...


                С разными интерфейсами согласен, да, нужно делать интерфейс адаптивным. Но в принципе это как раз не сама страшная проблема — адаптивная верстка это не так уж и сложно.

              +1

              Вы кажется ни разу не выходили из дома с ноутбуком, не уезжали в командировки, не сидели в кафе с перегруженным вайфаем. Иначе бы вы такие странные вещи про офлайн для десктопных PWA не говорили. Тот же Squoosh.app у меня на десктопе всегда под рукой, а не только когда есть сеть. И это много раз спасало.

                +1

                Так у автора ноутбуки относятся к мобильным устройствам

                0
                Нашли для себя прекрасное применение PWA и на десктопе. Была задача отображать демографическую аналитику на разных планшетах и десктопах. Аналитика, хоть и берется из оперативной базы, но и если возьмется из кеша, то ничего страшного не произойдет (на годовые данные 1-2 дня существенно не влияют). А с адаптивностью вполне себе справляется js-фреймворк.

                Только полноправные пользователи могут оставлять комментарии. Войдите, пожалуйста.

                Самое читаемое