В течение многих лет нативные приложения были предпочтительным способом предоставления пользователям удобных мобильных устройств. Однако прогрессивные веб-приложения (PWA) становятся эквивалентной альтернативой.

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

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

Проект ФУГУ

Благодаря использованию интерфейсов прикладного программирования (API) этот пробел в функциях становится все меньше и меньше. Проект FUGU, также известный как Web Capabilities Project, является совместной инициативой Google, Microsoft и Intel. Это уже дало значительные результаты, такие как веб-версия Photoshop.

У проекта очень амбициозная цель:

Веб-приложения должны иметь возможность делать все то же, что и нативные приложения.

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

Вклад Accenture

Во время конференции Modern Frontends Live в 2022 году мне выпала честь представлять Accenture и вести беседы с лидерами отрасли, такими как Алекс Рассел, Томас Штайнер, Бен Леш и Кент Доддс. Демонстрация потенциала API для веб-приложений путем устранения пробела в функциях. Хотя эта тема допускает бесконечные дискуссии, в этой статье я решил сосредоточиться только на двух API из тех, что были представлены на конференции:

1. Окружающий свет (API датчиков)

Интерфейс AmbientLightSensor, как часть Sensor API, позволяет получать информацию, полученную хост-устройством, относительно уровня освещенности в окружающей области. Это может быть полезно несколькими способами. Например, мы можем автоматически переключать наше веб-приложение в темный режим, если уровень освещенности падает ниже предопределенного порога, или возвращаться к уровню по умолчанию при ярком освещении. Нативные приложения, такие как Google Maps, делают то же самое.

Поскольку эта функция все еще находится на экспериментальной стадии, нам необходимо включить флаг дополнительных классов универсального датчика в Chrome (chrome://flags/#enable-generic-sensor-extra-classes).

Фрагмент ниже предоставляет простой пример использования:

2. API выбора контактов

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

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

Фрагмент ниже предоставляет простой пример использования:

Есть много других API, которые мы можем внедрить в наши веб-приложения, чтобы использовать весь потенциал наших проектов. Закрывая пробел в функциях, мы даем нашим клиентам возможность улучшить взаимодействие с пользователем в своих приложениях.

Ссылка на мою демонстрацию веб-API.