haku: @keyword JavaScript / yhteensä: 50
viite: 4 / 50
Tekijä:Yrjänäinen, Tuomas
Työn nimi:HTML5 Canvas -ohjelmointikirjastot
HTML5 Canvas software libraries
Julkaisutyyppi:Diplomityö
Julkaisuvuosi:2016
Sivut:63 s. + liitt. 5      Kieli:   fin
Koulu/Laitos/Osasto:Perustieteiden korkeakoulu
Oppiaine:Mediatekniikka   (IL3011)
Valvoja:Vuorimaa, Petri
Ohjaaja:Aalto, Aleksi
Elektroninen julkaisu: http://urn.fi/URN:NBN:fi:aalto-201610124917
Sijainti:P1 Ark Aalto  4628   | Arkisto
Avainsanat:software library
performance
memory usage
HTML5
Canvas
JavaScript
ohjelmointikirjasto
suorituskyky
muistin käyttö
Tiivistelmä (fin):Verkkosivujen tekninen kehitys on siirtymässä vahvasti ilman selainliitännäisiä toimiviin sivustoihin.
HTML5-standardin mukana kehitetty Canvas-elementti tarjoaa ne graafiset ominaisuudet, jotka oli aiemmin mahdollista toteuttaa vain selainliitännäisten avulla.

Tässä tutkimuksessa tarkastellaan HTML5 Canvas-elementin ohjelmointiin tarkoitettuja ohjelmointikirjastoja.
Tavoitteena on löytää tehokas, kaupalliseen käyttöön soveltuva kirjasto, joka täyttää tutkimuksessa asetetut vaatimukset.

Tutkimuksessa tarkasteltiin 42 ohjelmointikirjastoa, jotka on julkaistu kaupallisen käytön sallivalla avoimen lähdekoodin lisenssillä.
Kirjastoista seitsemän täytti tutkimuksessa asetetut, teknisiä ominaisuuksia ja kehitysprojektin laatua koskevat vaatimukset.
Näille kirjastoille tehtiin suoritustehokkuutta ja muistinkäyttöä mittaavat testit.Teknisessä testauksessa ohjelmointikirjastoilla koostettiin vektori- ja bittikarttagrafiikkaa piirtävät vertailuohjelmat.
Testiohjelmilla mitattiin ruudunpäivitysnopeus sekä varatun muistin määrä.
Testit suoritettiin sekä pöytätietokoneella että mobiiliympäristössä varioiden ruudulle piirrettävän grafiikan määrää.

Tutkimuksessa saadut tulokset osoittavat, että HTML5 Canvas-ohjelmistokirjastoilla on selviä eroja suoritustehokkuudessa sekä muistinkäytössä.
Tutkituista ohjelmointikirjastoista parhaiksi valikoituivat Easel.js ja Pixi.js.
Tiivistelmä (eng):The development of websites is heading towards plugin-free architecture.
HTML5 specification introduced a new Canvas element that includes graphical properties which could previously only be achived by using browser add-ons.

This thesis examines software libraries that are geared towards development of HTML5 Canvas applications.
The aim of this study is to identify a software library that is efficient, suitable for commercial use and meets the other requirements presented in this study.

This study analysed 42 software libraries, which were published using open source license that enables commercial use.
Seven libraries met the requirements of this study regarding technical features and qualifications that were required from the development project of the software library.
These seven libraries were selected for performance and memory usage testing.The performance tests were done using sample programs that drew vector and bitmap graphics on HTML5 Canvas.
The sample programs were measured for redraw speed of the graphics and memory usage.
These tests were carried out on desktop and mobile environments with various number of graphical elements.

In conclusion results of the study showed that there are clear differences between HTML5 Canvas libraries regarding performance and memory usage.
Out of all libraries Easel.js and Pixi.js libraries were selected as the best HTML5 Canvas libraries.
ED:2016-10-16
INSSI tietueen numero: 54649
+ lisää koriin
INSSI