Skaalautuvan grafiikka- ja käyttöliittymäkirjaston valinta ja hyödyntäminen reaaliaikaisessa web-sovelluksessa

Abstract

Skaalautuvien web-sivujen merkitys kasvaa nykypäivänä, koska web-sivuja katsotaan hyvin erikokoisilla ja -resoluutiosilla laitteilla. Sivujen skaalautuessa eri laitteille ei tarvitse erikseen tehdä mobiilisivuja tai perinteistä natiivia ohjelmistoa joka laitteelle, vaan yksi sivu toimii kaikilla laitteilla. Ongelmana on saada web-sovellukset toimimaan eri laitteilla, koska laitteiden selaimissa saattaa olla pieni eroja, joiden vuoksi on työlästä saada skaalautuva käyttöliittymä toimimaan kaikilla eri laitteilla. Skaalautuvien sivujen kehittämisen avuksi on luotu erilaisia käyttöliittymä- ja grafiikkakirjastoja, jotka auttavat sivun skaalautuvuuden toteuttamisessa. Kirjastoja käyttämällä säästetään kehitystyöhön käytettävää aikaa ja ulkoistetaan kirjaston ylläpito kolmannelle osapuolelle. Tällöin jää enemmän aikaa varsinaisten sovelluksen kehitystyölle.

Tässä työssä tutkitaan eri käyttöliittymä- ja grafiikkakirjastovaihtoehtoja käyttöliittymän toteuttamiseksi. Työssä toteutetaan yksinkertainen verkkoseurantajärjestelmän prototyyppi ja valitaan sille skaalautuva käyttöliittymä- ja grafiikkakirjasto. Järjestelmä koostuu kolmesta osasta: käyttöliittymästä, palvelusta ja tietolähteistä, joista palvelu kerää tietoa käyttöliittymälle näytettäväksi.

The importance of scalable web applications and pages are increasing because pages are viewed on devices with varying screen sizes and resolutions. With scalable web pages, it is not necessary to develop a separate mobile page or a traditional native application for a device. Instead, a single scalable page works on all devices. Subtle differences in device browsers make it hard to develop a scalable web page or an application. Scalable interface and graphics libraries have been made to help the development of scalable web pages. Using those libraries saves time and outsources the upkeep of a library to a third party which leaves more time to develop the actual application or web page.

This thesis studies different interface and graphics library choices to develop a web application with responsive layout. A prototype of a simple network monitoring system is made and an interface library and a graphics library is selected to aid the development of the application. The monitoring system consist of three components: a web interface, a service and data sources from which the service collects its data and sends it to the interface.