CC BY
133РАЗРАБОТКА ПРОГРЕССИВНОГО ВЕБ-ПРИЛОЖЕНИЯ С ПОМОЩЬЮ ТЕХНОЛОГИИ PWA
DEVELOPING A PROGRESSIVE WEB APPLICATION USING PWA
TECHNOLOGY
УДК-004
Газизуллин Нафис Инсафович, студент, Казанского национального исследовательского технологического университета, Россия, г. Казань Плещинская Ирина Евгеньевна, к.ф.-м.н., доцент, Казанского национального исследовательского технологического университета, Россия, г. Казань
Gazizullin Nafis Insafovich, [email protected] Pleshchinskaya Irina Evgen'evna
АННОТАЦИЯ
Статья посвящена разработке прогрессивного веб-приложения с помощью технологии PWA (Progressive Web Application). Рассмотрены преимущества и недостатки данной технологии. Раскрыто понятие «прогрессивное веб-приложение». Приведена краткая история возникновения и развития данной технологии. В настоящее время несмотря на то, что технология PWA позволяет существенно облегчить разработку в сфере веб-приложений, немного разработчиков готовы использовать данную технологию в своих проектах.
Цель данной работы - краткое описание технологии PWA, анализ преимуществ и недостатков технологии.
ANNOTATION
The article discusses the development of a progressive web application using PWA technology (Progressive Web Application). The advantages and disadvantages of this technology are considered. The concept of a progressive web application is disclosed. A brief history of appearance and development of this technology is given. Currently, despite the fact that PWA technology can significantly facilitate development in the field of web applications, few developers are ready to use this technology in their projects.
The purpose of this paper is a brief description of the PWA technology, analysis of the advantages and disadvantages of the technology.
Ключевые слова: PWA; Service Worker, прогрессивное веб-приложение.
Key words: PWA; Service Worker, progressive web application.
Сегодня каждый крупный интернет-сервис имеет свой собственный вебсайт и разрабатывает приложения под различные операционные системы. При этом разработчики этих сервисов обязаны обеспечить работу своих приложений на различных устройствах, которыми пользуются их постоянные или потенциальные клиенты. Но для того, чтобы это осуществить, необходимы разработчики широкого профиля: разработчики веб-сайта, разработчики приложений под различные операционные системы (Android, IOS, и др.). Отсюда возникает проблема: где найти таких разработчиков? И что делать небольшим компаниям, которые не могут себе позволить разработать свое приложение для различных устройств. Технология PWA помогает решить эту проблему [1].
Прогрессивное веб-приложение (Progressive Web Application, PWA) — это технология веб-разработки, которая визуально и функционально трансформирует сайт в приложение для различных устройств.
В настоящее время несмотря на то, что технология PWA позволяет существенно облегчить разработку в сфере веб-приложений, немного разработчиков готовы использовать данную технологию в своих проектах.
Цель данной работы - краткое описание технологии PWA, анализ преимуществ и недостатков технологии.
Описание технологии PWA
Технология PWA создана в корпорации Apple в 2007 году и изначально была доступна в браузере Safari для операционных систем macOS и iOS. Однако, технология не впечатлила разработчиков и вскоре была забыта. Но в марте 2018 года произошли существенные изменения в области реализации веб-стандартов. В обновлённой операционной системе iOS корпорация Apple добавила поддержку технологии Service Worker в мобильную версию браузера Safar,i и после этого все остальные компании-разработчики софта в области веб-технологии начали активно внедрять технологию PWA в свои платформы.
Прогрессивное веб-приложение — это веб-страница, которую можно установить на домашний экран смартфона или же на рабочий стол компьютера, и в дальнейшим это приложение будет функционировать как нативное. (Нативное приложение - это прикладная программа, которая разработана для использования на специфической платформе или устройстве.) Процесс установки веб-приложения возможен благодаря загрузке информации в кэш и поддержке технологии Service Worker.
Технология Service Worker [2] представляет собой скрипт, который запускается в браузере в фоновом режиме. Ключевой особенностью технологии Service Worker является, то, что этот скрипт может перехватывать и модифицировать запросы навигации и ресурсов, гибко кэшировать ресурсы для обеспечения полного контроля над поведением приложения в определенных ситуациях (например, когда сеть не доступна). Перечислим основные функции технологии Service Worker:
• ответ на запросы от других источников;
• фоновая синхронизация данных;
• получение централизованного обновления для данных, использующих тяжелые вычисления;
• компиляция и управление зависимостями на клиентской стороне;
• улучшение производительности с помощью предварительной загрузки ресурсов.
Прогрессивность веб-приложения - это способность приложения работать на любых платформах и при любых условиях. Прогрессивное веб-приложение должен обладать следующими качествами:
• возможность использовать его на любом устройстве, независимо от размера экрана и других спецификаций;
• возможность быть установленным по запросу браузера на домашнем экране, если приложение соответствует критериям технологии PWA;
• быстрая установка, так как все компоненты, которые требует загрузки, уже загружены в кэш;
• моментальное обновление, не требующее длительной загрузки;
• работоспособность, независимо от наличия подключения к сети.
Преимущества технологии PWA
1. Прогрессивное веб-приложение обладает свойствами нативного приложения и, в то же время, позволяет использовать функционал браузера, что обеспечивает ему дополнительные возможности.
2. Одним из преимуществ технологии PWA является автономность ее приложений. Приложение кэшируется в памяти браузера и таким образом сохраняет работоспособность в автономном режиме.
3. PWA-технология обладает кроссплатформенностью. Разработанные с применением этой технологии приложения можно устанавливать на любые устройства независимо от платформы и операционной системы. Это является большим преимуществом по сравнению с д нативными приложениями [3].
4. Кроме того, прогрессивные приложения отличаются от нативных большей производительностью. Например, чтобы использовать прогрессивное приложение Twitter, нет необходимости заходить в магазин приложений Play Store или App Store. Для этого достаточно посетить официальный сайт разработчика. Когда обновляется приложение, пользователю не нужно устанавливать обновления, так как все новые функции и исправления доступны автоматически. Как показывает статистика, компании, выпускающие прогрессивные веб-приложения, получают меньше запросов в службу техподдержки от пользователей, так как им не приходится использовать старые версии приложений. Как следствие, компании-разработчики могут выпускать обновления так часто, как они могут себе позволить, при этом не раздражая пользователей постоянными предложениями обновления.
5. Клиентская часть разработки отделена от серверной части. Благодаря этому тратится меньше ресурсов и времени на разработку и доработку дизайна [4].
6. Главным преимуществом прогрессивного веб-приложения по сравнению с традиционным является объем, занимаемый им в памяти устройства. В качестве примера приведем известный факт: сеть Starbucks разработала прогрессивное веб-приложение как дополнение к своему обычному мобильному приложению. При одинаковом интерфейсе объем, занимаемый прогрессивным приложением, оказался меньше на 99,84%. Результатом этого стало удвоенное количества запросов через мобильный интернет.
7. С начала 2019 года появилось возможность добавлять прогрессивные веб-приложения в онлайн-магазины мобильных приложений App Store и Google Play. Это позволяет пользователям скачать приложение из привычного источника.
Недостатки технологии PWA
Технология PWA, как и любая технология, не универсальна и имеет ряд недостатков.
1. Одним из недостатков является то, что не все операционные системы поддерживает полный функционал прогрессивного веб-приложения. Это следствие того, что технология PWA, хоть и поддерживается наиболее популярными операционными системами, однако внедрена еще не во все платформы [5].
2. Невозможно наладить использование технологии в старых операционных системах. Технологии PWA не так много лет, поэтому неудивительно, что на устаревших устройствах она не может полноценно поддерживаться. Несмотря
на то, что проблема несомненно решится в будущем, на данный момент это может стать причиной жалоб клиентов.
3. По сравнению с нативными приложениями, прогрессивные веб-приложения не могут делать все, что могут обычные приложения. Сегодня по-прежнему отсутствует доступ к таким важным функциям устройства, как беспроводная технология Bluetooth, внешнее освещение, датчики приближения, возможность управления расширенными элементами камеры и другие. Так как технология PWA написана на языке программирования JavaScript, расход заряда батареи увеличивается в отличии от приложений, написанных на тех языках программирования, на которых написаны ОС.
4. Работа офлайн так же ограничена, потому что любое прогрессивное веб-приложении в первую очередь ориентирована на работу с доступом к интернету. Но этот недостаток не является серьезным, так как на сегодняшний день большинство устройств имеют постоянное подключение к сети интернет.
Вывод
Несомненно, технология PWA обладает огромным потенциалом. Однако, на данный момент технология не очень популярна из-за наличия небольших, но существенных недостатков. Несмотря на это, разработка прогрессивных веб-приложений является самым быстрым и при этом качественным способом создания приложения одновременно для многих устройств.
Литература
1. Medium [Электронный ресурс]. - Режим доступа: https://medium.com/ -(Дата обращения: 17.05.2020).
2. Service Workers: an introduction [Электронный ресурс]. - Режим доступа: https://developers.google.com/web/fundamentals/primers/service-workers/ -(Дата обращения: 20.05.2020).
3. Progressive Web App Checklist | Web [Электронный ресурс]. - Режим доступа: https://developers.google.com/web/progressive-web-apps/checklist/ - (Дата обращения: 20.05.2020).
4. Заяц, А.М. Проектирование и разработка WEB-приложений. Введение в frontend и backend разработку на JavaScript и node.js: Учебное пособие / А.М. Заяц, Н.П. Васильев. - СПб.: Лань, 2019. - 120 c.
5. Эспозито, Д. Разработка современных веб-приложений: анализ предметных областей и технологий / Д. Эспозито. - М.: Вильямс И.Д., 2017. - 464 c.
6. Павлов В., Намиот Д. Анализ и разработка системы pushуведомлений с использованием технологий Google //Internation
Literature
1. Medium [Electronic resource]. - Access mode: https://medium.com/ -(accessed: 17.05.2020).
2. Service Workers: an introduction [Electronic resource]. - Mode of access: https://developers.google.com/web/fundamentals/primers/service-workers/ -(accessed: 20.05.2020).
3. Progressive Web App Checklist | Web [Electronic resource]. - Mode of access: https://developers.google.com/web/progressive-web-apps/checklist/ (date of access: 20.05.2020).
4. Hare, A. M. Design and development of WEB applications. Introduction to frontend and backend development in JavaScript and node.js: textbook / A. M. Hare, N. P. Vasiliev. - Saint Petersburg: LAN, 2019. - 120 p.
5. Esposito, D. Development of modern web applications: analysis of subject areas and technologies. Esposito. - M.: Williams I. D., 2017. - 464 p.
6. Pavlov V., Namiot D. Analysis and development of push notification system using Google technologies / / International
