В 2015 году Google представил новый подход к разработке веб-приложений для Android: прогрессивные веб-приложения . Можно создать приложение, которое будет выглядеть как собственное приложение, сможет использовать оборудование устройства, такое как камера и акселерометры, получать push-уведомления, иметь значок запуска, работать в автономном режиме, хранить локальные данные и т. Д.

На Android, какие функции предоставляют собственные приложения, которые прогрессивные веб-приложения не поддерживают, и наоборот.

TL; DR - По состоянию на февраль 2017 года прогрессивные веб-приложения являются достаточно мощной платформой, поэтому Twitter переместил весь свой мобильный веб-трафик на React PWA .

По состоянию на август 2016 года прогрессивные веб-приложения фактически предлагают больший доступ к оборудованию, чем обычно думают. Вот снимок экрана whatwebcando.today из моей стабильной версии Chrome 52 на Android:

Доступ к оборудованию включает

• геолокация - поддерживается в подавляющем большинстве браузеров
• камеру и микрофон через getUserMedia / Stream и предстоящие API MediaStream Image Capture
• вибрация устройства
• ориентация экрана и доступ к акселерометру , включая компас и гироскоп
• заряд батареи

Предстоящий доступ к оборудованию

Эти функции реализуются или уже работают в некоторых браузерах:

• Bluetooth через веб- интерфейс Bluetooth API
• NFC
• датчик внешней освещенности ( работает в Firefox 48+)
• датчик приближения ( работает в Firefox 48+)
• доступ к датчику акселерометра , магнитометра и гироскопа
• API определения формы

Еще один важный момент, на который следует обратить внимание, заключается в том, что Origin Trials Framework ( реализованная в Chrome ) позволяет производителям раскрывать и тестировать возможности оборудования (или программного обеспечения) без необходимости проходить процесс стандартизации. Например, производитель телефонов может предоставить API для считывания значений датчика давления, уточнить его, а затем отправить на рассмотрение W3C.

Помимо доступа к оборудованию, существуют также программные функции, традиционно используемые нативными приложениями, которые теперь доступны для веб-приложений.

Традиционно собственные функции, которые также могут использовать PWA

• всплывающее уведомление
• работа в автономном режиме
• добавление значка на главный экран
• Появление в списке приложений благодаря WebAPK - прогрессивные веб-приложения теперь можно упаковать в реальные устанавливаемые пакеты Android!
• запуск в полноэкранном режиме
• доступ к буферу обмена

• 2D / 3D-графика с аппаратным ускорением через HTML5 Canvas или WebGL - посмотрите некоторые демонстрации HTML5 Canvas , сайты WebGL или библиотеку three.js . 2014 эталоном кросс-платформенный игровой движок Unity по сравнению нативную производительность рендеринга по сравнению с WebGL, и пришел к выводу , что

  «Самый важный вывод заключается в том, что, хотя есть еще области, в которых WebGL значительно медленнее, чем собственный код, в целом вы уже можете ожидать очень приличную производительность, и в будущем она может только улучшиться».

  Разрыв действительно сокращается .

• чтение выбранных пользователем файлов в любом браузере
• гладкий, плавный интерфейс с анимацией 60 кадров в секунду

Эти функции охватывают множество вариантов использования, и многие популярные в настоящее время нативные приложения можно переписать как PWA. Возьмем, к примеру, Slack. Его альтернатива с открытым исходным кодом, Rocket.Chat, создает версию PWA . Дополнительные демонстрации PWA см. На https://pwa.rocks .

Нативные функции, которые появятся в PWA

• обработка намерений  - например, совместное использование страницы в другом приложении или возможность совместного использования , например, приложение чата PWA, которое получает изображение для установки в качестве аватара пользователя

Родные функции Android пока недоступны для PWA

• доступ к дактилоскопическому датчику ( в разработке )
• доступ к контактам, календарю и закладкам браузера (отсутствие доступа к ним может рассматриваться как особенность пользователей, заботящихся о конфиденциальности)
• будильники
• функции телефонии - перехват SMS или звонков, отправка SMS / MMS, получение номера телефона пользователя, чтение голосовой почты, выполнение телефонных звонков без диалога Dialer
• низкоуровневый доступ к некоторым аппаратным функциям и датчикам: фонарик, датчик атмосферного давления
• доступ к системе: управление задачами, изменение настроек системы, журналы

Прогрессивные веб-приложения предлагают функции, которых нет в собственных приложениях

• Обнаруживаемость - контент в прогрессивных веб-приложениях может быть легко найден поисковыми системами, но ориентированное на контент собственное приложение, такое как StackOverflow, не будет отображаться среди результатов поиска в магазине приложений для контента, к которому оно предлагает доступ, например «pwa vs. native». Это проблема таких сообществ, как Reddit, которые не могут выставлять свои многочисленные подсообщества в магазине приложений как отдельные «приложения».
• возможность ссылки - любая страница / экран может иметь прямую ссылку, которой можно легко поделиться
• возможность закладок - сохраните эту ссылку для прямого доступа к представлению приложения
• всегда свежие - не нужно заходить в магазины приложений, чтобы отправлять обновления
• универсальный доступ - не регулируется магазинами приложений, иногда произвольными политиками или (непреднамеренными) географическими ограничениями
• значительная экономия данных , что чрезвычайно важно на развивающихся рынках с дорогим и / или медленным доступом в Интернет. Например, веб-сайт электронной коммерции Konga сократил использование данных на 92% при первой загрузке за счет перехода на PWA .
• низкое трение распространения - если ваше прогрессивное веб-приложение подключено к сети, оно уже доступно для пользователей Android (и других мобильных устройств).
  • 65,5% пользователей смартфонов в США не скачивают новых приложений каждый месяц.
  • PWA избавляют от необходимости заходить в магазин приложений, искать приложение, нажимать «Установить», ждать загрузки и открывать приложение. Каждый из этих шагов теряет 20% потенциальных пользователей.

Последнее замечание: PWA работают с одной и той же кодовой базой как на настольных компьютерах, так и на большинстве мобильных устройств. В настольных средах (ChromeOS и более поздние версии Mac и Windows) они запускаются так же, как и другие приложения, и запускаются в обычном окне приложения (без вкладки браузера).

Основным преимуществом собственных приложений является то, что они могут получить доступ ко всем собственным API-интерфейсам, которые может предложить платформа (контакты, вспышка камеры, SMS, телефония, сеть, Bluetooth, датчики, необработанные сокеты ...), в то время как прогрессивное веб-приложение не может (пока) поскольку они ограничены возможностями Standard Web.

Цель прогрессивных веб-приложений - расширить эти возможности для охвата наиболее критических случаев. В таком настроении взгляните на Progressive Web Apps: Escaping Tabs Without Loosing Our Soul, где вы можете найти список того, что должно предлагать прогрессивное веб-приложение:

• Отзывчивый: подходит для любого форм-фактора
• Независимость от подключения: постоянно расширяются сервисные работники, позволяющие им работать в автономном режиме
• Взаимодействия, подобные приложениям: воспользуйтесь моделью приложения Shell + Content для создания удобной навигации и взаимодействия.
• Свежий: прозрачная и всегда актуальная информация благодаря процессу обновления Service Worker
• Безопасно: обслуживается через TLS (требование Service Worker) для предотвращения слежки
• Обнаруживаемость: идентифицируются как «приложения» благодаря манифестам W3C и области регистрации Service Worker, что позволяет поисковым системам находить их.
• Возможность повторного вовлечения: может получить доступ к пользовательским интерфейсам повторного вовлечения ОС; например, Push-уведомления
• Возможность установки: на главный экран через подсказки браузера, позволяющие пользователям «сохранять» приложения, которые они считают наиболее полезными, без хлопот, связанных с магазином приложений.
• Возможность связывания: это означает, что они не требуют трения, не требуют установки и легко распространяются. Социальная сила URL-адресов имеет значение.

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

Но особого упоминания заслуживает комбинация свежий + устанавливаемый, поскольку она представляет одно из основных преимуществ Интернета как платформы по сравнению с собственными альтернативами. Здесь устанавливаемый означает, что он появляется на вашем домашнем экране. Это не значит, что вам необходимо пройти этапы загрузки и установки. Вы открываете URL-адрес или обнаруживаете службу во время просмотра, и все готово: она появляется на главном экране .

Fresh относится к тому, как работает обычный Интернет, предлагая мгновенную загрузку и плавные обновления. Вас не просят установить обновление из сети YouTube, оно развернуто, и вы потребляете его при следующем посещении.

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

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

В качестве заключительных примечаний я рекомендую вам посетить сайт www.flipkart.com с мобильного телефона с Chrome. Это довольно круто: никаких ошибок, плавная навигация, ощущение приложения. Перейдите в автономный режим, и он продолжит работу. Поистине реальный пример этого поста. Добавьте приложение на главный экран, и в следующий раз, когда вы откроете его, работа станет еще лучше.

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