Введение в Cordova: Основы

В этой статье я познакомлю вас с фреймворком для веб-разработчиков — Cordova, который позволяет разрабатывать мобильные приложения сразу для нескольких платформ.


Мы запускаем серию статей — Введение в мобильную разработку веб-приложений на Cordova, и начнем с основ.
Если вы не знаете что такое Cordova и хотите разобраться, пригодиться ли данный инструмент для вашего следующего проекта, здесь я постараюсь ответить на часто задаваемые вопросы:

• Что такое Cordova?
• Как работает под капотом?
• Что я смогу создавать с Cordova?
• Как мне начать работать с Cordova и что мне понадобится?

Что такое Cordova?

Cordova — платформа разработки мобильных приложений, которая прежде всего предназначена для веб-разработчиков. Она позволяет веб-разработчикам использовать веб-технологии, такие как HTML, CSS, и JavaScript, для создания мобильного приложения. Как и у любой другой технологии, у Cordova есть свои плюсы и минусы.

Достоинства

• Простая в изучении, если вы являетесь веб-разработчиком, то вам не составит труда разобраться в работе данного фреймворка. Вы сможете легко применить свои навыки как веб-разработчик, чтобы создать собственное мобильное приложение с Cordova. Все что вам понадобиться, это ознакомиться с командной строкой.
• Доступ к нативному функционалу, у вас будет доступ к большинству функциям устройства, таким как камера, контакты, геолокация, медиа, SMS и многое другое.
• Бесплатность, фреймворк полностью бесплатный.
• Открытый исходный код, любой сможет внести свои изменения в исходный код Cordova, чтобы сделать его еще лучше. Дополнительные плагины также имеют открытый исходный код, благодаря этому у вас будет возможность свои собственные.
• Большое сообщество, большое количество разработчиков используют Cordova, на Stack Overflow есть около 40,000 вопросов по Cordova. Это означает что вам всегда смогут помочь решить какую-либо проблему (если они у вас вообще появятся).
• Напишите один раз, разверните в любом месте, Cordova компилирует Ваше приложение в специальный файл пакета, который подойдет для большинства магазинов приложений. Это означает, что приложения, которые вы разработаете с Cordova, можно легко добавить в любой App Store на ваш выбор. Если вы разрабатываете под Android, Cordova создает APK (Пакет приложений Android) файл. Если вы разрабатываете под iOS, Cordova скомпилирует IPA. Для Windows это — APPX.

Недостатки

• Плохая документация, трудно найти информацию о конкретных вещах, например, какие пакеты нужно установить вместе с менеджером по SDK Android. И когда вы ищете что-то, результаты будут на разные версии Cordova. Это иногда сбивает с толку новичков, поскольку у них установлена одна версия Cordova, а они смотрят на документацию для другой версии.
• Медленнее чем нативные приложения, так как приложения, созданные с Cordova — в основном веб-приложения, которые работают с web-view, они не настолько быстрые как нативные приложения. Это означает, что есть определенные ограничения при создании приложений. Например, приложение редактирования видео лучше сделать нативным, так как для работы, оно больше расходует CPU и GPU.
• Фреймворки, поскольку Cordova — просто обертка для веб-приложения, в ней нет компонентов пользовательского интерфейса, анимаций и других полезный инструментов, которые пригодились бы для большинства приложений. Это означает, что вы должны будете реализовать их самостоятельно. Поэтому многие разработчики пользуются Ionic или Onsen UI для создания пользовательского интерфейса в своих приложениях.
• Ошибки в плагинах, не все плагины работают идеально, в некоторых есть ошибки и они работают не так как ожидалось.

Cordova и PhoneGap

При работе с Cordova вы часто будете сталкиваться с термином PhoneGap. PhoneGap — бесплатный open-source, созданный Nitobi Software приблизительно в 2009 году. В 2011 году компания была приобретена Adobe.
Обратите внимание, что Adobe не покупал саму разработку, а только имя и людей, которые работали в Nitobi. Сам проект с открытым исходным кодом был передан в Apache Software Foundation, который теперь известен как Cordova.
На практике PhoneGap и Cordova — в основном одно и то же. Вы можете выбрать PhoneGap или Cordova при создании проекта. Единственная разница — CLI (Интерфейс командной строки). CLI PhoneGap интегрирован с Adobe PhoneGap Build. Эта служба позволяет разработчикам компилировать свои приложения, загружая его на веб-сайт PhoneGap Build.

Как работает Cordova под капотом?

Пользовательский интерфейс Cordova — это веб-представление (web-view). Веб-представление, это наподобие вкладки в браузере. Когда вы компилируете приложение, Cordova не работает с вашим HTML, CSS, и JavaScript кодом, а преобразовывает его в собственный код, который в последствии будет определен для каждой платформы.
Cordova действует как контейнер для приложения, в котором вы используете веб-технологии. Когда приложение скомпилировано, ваш код остается неизменным. Компилятор просто берет Ваш код и делает его доступным для рендеринга в веб-представлении.
Это практически тоже самое что открыть HTML файл в браузере. Но имейте в виду, что веб-представление реализовано по-разному на каждом устройстве. Это означает, что есть определенные функции, которые будут не доступны на некоторых платформах, или они реализованы по-другому.

Нативные функции устройства

С Cordova, при помощи плагинов, у вас будет доступ к нативной функциональности устройства. Плагины — это дополнения, которые представляют JavaScript API для собственных компонентов. Они позволяют вам получать доступ к нативным возможностям устройства, используя JavaScript API.
Вы конечно уже догадались, что плагины создаются отдельно. Это означает, что сначала нужно установить SDK для нужной платформы, только тогда вы можете начать разработку под нужную платформу. Затем вызываете собственный код через JavaScript API, чтобы к нему можно было получить доступ в веб-представлении.
Есть два типа плагинов, которые вы можете найти в Cordova. Первые — официальные плагины. Они находятся в сообществе Cordova. Все официальные плагины имеют префикс cordova-plugin.
Другой тип плагина — пользовательские плагины. Их создают разработчики такие как вы и я. Часто их создают, для решения определенной проблемы, например интеграция приложения с Facebook или Ionic Keyboard Plugin, для простого взаимодействия с клавиатурой.
Больше информации по плагинам вы можете посмотреть на сайте Cordova Plugins.

Что я смогу создавать с Cordova?

При помощи Cordova, Вы можете создать в значительной степени любой вид приложения, конечно есть некоторые ограничения, о которых мы поговорим позже. Давайте посмотрим на демонстрационные приложения, которые вы можете создать с Cordova.

• TripCase — приложение для путешествий.
• FruitSalad — игра-головоломка.
• Panasonic World Heritage Calendar — календарное приложение, которое показывает вам красивые фотографии объектов Всемирного наследия.
• HealthTap — вопросы о здоровье на Stack Overflow.
• Wikipedia — официальное приложение Википедии создано на Cordova.

Теперь у вас будет примерное представление вашего приложения, которое вы сможете создать с Cordova. Если вы — разработчик, то скорее всего заметили, что все приложения используют Интернет. Они все связываются с удаленным сервером, для сбора данных. Это одна из функциональных особенностей Cordova, сбор данных от сервера, отображение их пользователю и передача обратного ответа от пользователя.
Это не означает что вы не сможете создавать автономные приложения с Cordova. Есть множество решений для клиентской базы данных, которые можете свободно использовать в своем приложении. Самый популярный — LokiJS, быстрое, документо-ориентированное хранилище данных в памяти для Node.js, браузеров и Cordova. Например для приложения фотогалереи, вы могли бы воспользоваться этой библиотекой, чтобы сохранить путь фотографий, а затем сграбить при необходимости.
С Cordova Вы сможете воспользоваться любой CSS или JavaScript библиотекой, так как весь код выполняется в браузере. Но будьте осторожны, не все браузеры одинаковые. И это переносит нас к следующему разделу.

Ограничения

Как и во многих технологиях, всегда есть ограничения. Cordova не исключение. В этом разделе я расскажу о некоторых ограничениях Cordova.

Производительность

Cordova предоставляет доступ к устройствам благодаря плагинам, которые расходуют ресурсы, такие ресурсы которые нативные приложения не затрагивают. Как упоминалось ранее в этом учебном руководстве, плохая идея создавать приложение с Cordova которое будет сильно полагаться на CPU или GPU. Такие приложения не будут производительны, по сравнению с нативными.

Наличие плагинов

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

Веб-представление (Web view)

По умолчанию Cordova использует веб-представление платформы для рендеринга пользовательского интерфейса, это означает, что вы взаимодействуете с разными веб-представлениями в каждой платформе.
Кроме того, у разных версий операционной системы платформы, может быть разное веб-представление или одинаковое, но с разным набором функций. Например, современные Android устройства имеют поддержку функцию WebRTC, в то время как в более старых версиях Android нет такой функции.
Поэтому приходят на помощь новые проекты, такие как Crosswalk. Crosswalk позволяет Вам использовать пользовательское веб-представление в приложениях Cordova, нормализуя различия между платформами.

Автор: Siteacademy

Источник ^[1]