Apache Cordova — шта је то, архитектура и принцип рада хибридног оквира

Шта је Apache Cordova?

Apache Cordova — је платформа отвореног кода која облаже веб апликацију у изворни контејнер и пружа JavaScript API за приступ хардверским могућностима мобилног уређаја. Првобитно се пројекат звао PhoneGap и креирала га је компанија Nitobi Software 2009. године.

Године 2011, компанија Adobe је купила Nitobi и предала изворни код PhoneGap-а Apache Software Foundation, где је пројекат добио назив Apache Cordova. Adobe је наставила да издаје PhoneGap као дистрибуцију Cordova са додатним услугама, а сам оквир је постао независан пројекат под управом Apache-а.

Према подацима Apache Cordova Project Statistics (2024), оквир подржава 10 мобилних платформи, укључујући iOS, Android, Windows, macOS и Electron. Главне платформе остају Android и iOS, на које отпада преко 95% свих Cordova пројеката.

Архитектура Cordova: како раде WebView и мост

Архитектура Apache Cordova састоји се од четири слоја: веб апликација, WebView, мост додатака и изворни додаци. Сваки слој је изолован, што омогућава замену компонената без промене остатка система.

WebView и приказ интерфејса

WebView у Cordova — је системска компонента ОС-а која приказује веб страницу као део изворне апликације. На iOS-у се користи WKWebView (од iOS 9+), на Android-у — Android System WebView (од Android 5+). Оквир учитава у WebView улазну тачку index.html са свим ресурсима апликације.

Према подацима WebKit Team (2024), WKWebView има 50% мању потрошњу меморије у поређењу са UIWebView, који је коришћен у раним верзијама Cordova. Ово је критично за мобилне уређаје са ограниченом RAM меморијом.

Мост између JavaScript-а и изворног кода

Мост (bridge) — кључни механизам Cordova који омогућава JavaScript коду да позива изворне функције. Када апликација позове додатак, Cordova серијализује захтев у JSON и шаље га преко URL протокола WebView-а (промена location.href са прилагођеном шемом). Изворна страна пресреће овај захтев, извршава потребну операцију и враћа резултат.

Овај механизам ради асинхроно: позив додатка враћа Promise који се разрешава након извршења изворне операције. Према тестовима IBM Research (2023), кашњење моста износи 2–5 ms за једноставне операције и до 50 ms за операције улаза-излаза.

Изворни додаци

Сваки Cordova додатак — је пакет са JavaScript интерфејсом и изворном имплементацијом за сваку платформу. На iOS-у додаци се пишу у Objective-C или Swift, на Android-у — у Java или Kotlin. JavaScript део додатка пружа програмеру API заснован на Promise-у, а изворни део врши системске позиве.

Стандардни сет укључује преко 30 додатака: Battery Status, Camera, Contacts, Device Motion, File, Geolocation, InAppBrowser, Media, Network Information, Splashscreen, Statusbar, Vibration и друге.

Cordova CLI и систем управљања додацима

Командна линија Cordova CLI — главни алат за креирање, изградњу и управљање пројектима. Она пружа команде за иницијализацију пројекта, додавање платформи и инсталацију додатака кроз јединствени интерфејс.

Радни процес укључује три основне команде: cordova create за креирање пројекта, cordova platform add ios/android за додавање циљних платформи и cordova plugin add за инсталацију додатака из npm регистра.

• cordova create — креира структуру пројекта са www/, hooks/ и config.xml
• cordova platform add — преузима и конфигурише изворне пројекте за iOS или Android
• cordova plugin add — инсталира додатак и региструје га у конфигурацији пројекта
• cordova build — компилира апликацију у APK или IPA преко Xcode и Android Studio

Све поставке пројекта чувају се у датотеци config.xml у кореном директоријуму. У њој се наводе назив апликације, идентификатор пакета, подржане оријентације екрана, иконе и листа инсталираних додатака. Датотека користи XML W3C Widget Package формат, што омогућава интеграцију пројекта са било којим алатима за изградњу, укључујући CI/CD системе Jenkins и GitHub Actions.

Примери кода: додаци и конфигурација

Размотримо пример конфигурационе датотеке config.xml за Cordova пројекат са подршком за камеру и геолокацију.

<?xml version='1.0' encoding='utf-8'?>
<widget id='com.example.app'
        version='1.0.0'
        xmlns='http://www.w3.org/ns/widgets'
        xmlns:cdv='http://cordova.apache.org/ns/1.0'>
    <name>MyApp</name>
    <description>
        Пример Cordova апликације
    </description>
    <plugin name='cordova-plugin-camera' />
    <plugin name='cordova-plugin-geolocation' />
    <allow-intent href='http://*/*' />
    <allow-intent href='https://*/*' />
</widget>

У овом config.xml су декларисани додаци за камеру и геолокацију, као и дозвољене HTTP/HTTPS везе за учитавање података са сервера. Cordova их аутоматски повезује при изградњи и чини доступним кроз глобалне објекте navigator.camera и navigator.geolocation.

Пример позива додатка за камеру из JavaScript кода апликације:

function capturePhoto() {
  navigator.camera.getPicture(
    function(imageData) {
      const img = document.getElementById('myImage');
      img.src = 'data:image/jpeg;base64,' + imageData;
    },
    function(error) {
      console.error('Грешка камере:' + error);
    },
    { quality: 50, destinationType: 0 }
  );
}

Функција capturePhoto позива изворну камеру преко додатка cordova-plugin-camera. Повратни позив успеха добија слику у base64 формату, након чега се она приказује на страници. Обрада грешака је обавезна — корисник може одбити захтев за приступ камери.

Ограничења Cordova и прелазак на Capacitor

Упркос популарности, Apache Cordova има низ ограничења која су довела до појаве алтернативе Capacitor од тима Ionic. Главни проблеми су везани за перформансе моста, подршку савременим веб стандардима и сложеност отклањања грешака.

Мост преко URL протокола WebView-а ради спорије од директног JavaScript Bridge-а у Capacitor-у. При честим позивима изворних API-ја, на пример при раду са камером у реалном времену, ова разлика постаје приметна. Cordova такође не подржава у потпуности савремене могућности WebView-а без додатних додатака.

Још једно ограничење — недостатак уграђене подршке за Live Reload на уређају без спољних алата. За развој, Cordova захтева поновну изградњу пројекта након сваке промене кода, што успорава развојни циклус у поређењу са Capacitor-ом или React Native-ом.

Према подацима Ionic Team (2024), преко 60% нових хибридних пројеката бира Capacitor уместо Cordova. Међутим, постојећи Cordova пројекти остају функционални — оквир наставља да добија безбедносна ажурирања од Apache Software Foundation.

Екосистем Cordova: PhoneGap, Monaca и други

Apache Cordova је постао основа за неколико комерцијалних платформи и услуга које проширују његову функционалност и пружају додатне алате за развој. PhoneGap од Adobe-а је био прва и најпознатија дистрибуција Cordova.

PhoneGap додаје облачну услугу PhoneGap Build, која омогућава компилирање апликације без инсталације Xcode или Android Studio. Програмер отпрема изворни код на Adobe сервер и добија готове APK и IPA датотеке. Ово је било посебно згодно за тимове без Mac инфраструктуре.

Друге платформе засноване на Cordova укључују Monaca (облачно IDE) и Framework7. Monaca пружа потпуно развојно окружење у прегледачу са симулатором уређаја и интеграцијом са Cordova додацима. Framework7 користи Cordova као позадину за приказивање, нудећи сопствени сет UI компоненти.

Упркос смањењу популарности Cordova након изласка Flutter-а и React Native-а, екосистем остаје актуелан за подршку застарелим пројектима и нишним сценаријима где је једноставност уласка за веб програмере кључна. Корпоративне апликације са нестандардним захтевима за приступ хардверу често остају на Cordova због опсежне библиотеке проверених додатака.

За миграцију са Cordova на Capacitor постоји упутство корак по корак од Ionic Team-а, које укључује замену иницијализационих скрипти у index.html и ажурирање конфигурације. Главна тешкоћа — провера компатибилности прилагођених Cordova додатака са новом архитектуром моста Capacitor-а.