HTML5-pohjaiset mobiilisovellukset

Abstract

Insinöörityössä tutkittiin asiakasyrityksen toimeksiantona, miten HTML5-, CSS3- ja Ja-vaScript-tekniikoita hyödyntävät Apache Cordova- ja Adobe PhoneGap -sovelluskehykset soveltuvat mobiilisovellusten kehittämiseen. Tarkoituksena oli selvittää, mitä vahvuuksia ja heikkouksia näihin sovelluskehyksiin liittyy. Samalla insinöörityön tarkoitus oli tutkia sitä, miten HTML5-, CSS3- ja JavaScript-tekniikoilla toteutetaan yksinkertainen sovellus, joka hyödyntää Wikitude-liitännäistä lisätyn todellisuuden toiminnollisuuden toteuttamiseen. Insinöörityössä tutkittiin, mitä tämä kehitysprosessi pitää sisällään. Vertailua tehtiin myös sen suhteen, miten hybridisovellus Apache Cordova- ja Adobe PhoneGap -sovelluskehyksen päälle rakennettuna vertautuu natiivisovellukseen.

Mobiilisovellusten kehittäminen on usein hankalaa ja hidasta. Osaavien kehittäjien löytäminen ei ole helppoa. On helpompaa löytää kehittäjiä, joilla on jo taustaa HTML5-, CSS3- ja JavaScript-tekniikoista. Useimmiten projektien luonne ei välttämättä ole sellainen, että natiivisovellus olisi kaikkein järkevin lähestymistapa.

Insinöörityön tuloksena selvisi tarkemmin myös se, miten natiivisovellus eroaa hybridisovelluksesta esimerkiksi suorituskyvyn suhteen. Suorituskykyerot ovat merkittäviä, mutta näitä eroja voidaan kaventaa, kun huomioidaan WebView-komponentin rajoitteet piirto- ja reflow-tapahtumien suhteen. Insinöörityön tuloksena saatiin myös tietoa siitä, mitä asioita pitää ottaa huomioon, kun suunnitellaan hybridisovellusta Apache Cordova- tai Adobe PhoneGap -sovelluskehysten päälle, mitä kirjastoja voidaan käyttää hybridisovelluksen kanssa ja mitä kirjastoja on saatavilla vain natiivisovelluksiin.

Insinöörityön lopputuloksena saatu tutkimustieto hyödynnetään jatkossa asiakasyrityksen toiminnan kehittämisessä, ja se tulee vaikuttamaan siihen, mitä tekniikoita valitaan erilaisiin projekteihin. Insinöörityön tutkimuksen kohteena olleet tekniikat ovat yleiskäyttöisiä myös selainsovellusten kannalta, joten tämän insinöörityön tuloksena saatua tutkimustietoa näistä eri mahdollisuuksista hyödynnetään myös tulevissa selainsovellusprojekteissa.

The thesis studied how to use HTML5-, CSS3-, and JavaScript -technologies with Apache Cordova and Adobe PhoneGap application frameworks, which are suitable for mobile ap-plication development. The aim was to find out the strengths and weaknesses of these application frameworks. The thesis explores how HTML5-, CSS3- and JavaScript -technologies are used to implement a simple application that uses Wikitude augmented reality plugin. The thesis describes the development process and methods of said prototype mobile application. Comparisons were also made in terms of how hybrid application built on top of Apache Cordova or Adobe PhoneGap frameworks compares to native application.

Mobile Application development is often difficult and slow. Finding skilled developers to develop native applications is not easy. It is easier to find developers who already have a background in HTML5-, CSS3- and JavaScript -technologies. In many cases, the nature of the project may not be such that a native application would be the most sensible approach.

The thesis also describes in more detail how native application and hybrid applications are differ, for example, in terms of performance. Performance differences are significant, but they can be minimized, given the constraints of the WebView-component in the paint and reflow events. As a result of this thesis, information was obtained about the things to consider when designing a hybrid application built with Apache Cordova or Adobe PhoneGap frameworks.

The information obtained from the research will be utilized in the client company, and the results influence what techniques are selected for various projects. Techniques described in this thesis are widely applicable to different fields beyond mobile application development since the technologies used are also used in web application development.