Benchmarking and comparison of open-source HTML5 game engine performance

Abstract

In this thesis a collection of open source HTML5 based game engines was selected to have their performance benchmarked and compared against one another. For this end a testing tool was created, and the benchmarking process involved simulating and Asteroids style video game with an ever increasing amount of sprites or objects. Engines were tested on both Google Chrome and Mozilla Firefox browsers, and on high and low end computers. Apple's Safari nor mobile performance could be tested. Game logic was drawn one frame at a time in order to accurately measure framerate and frame time. ProcessExplorer tool from Microsoft was also used to estimate CPU and GPU usages in the tests. Both 2D and 3D engines were selected, and if an engine could do wither both implementations were tested. In addition to this a comparison points with plain canvas element and plain WebGL were created. The results of the test show that engines utilizing WebGL greatly outperform engines still using canvas rendering. When it came to performance, in 2D implementations PixiJS and Babylon.js performed the best over other engines, and on 3D implementations Three.js was vastly superior to the others. Based on the results achieved with plain WebGL however there is still much room for potential growth for engines utilizing it.

Tässä tutkimuksessa valittiin kokoelma avoimen lähdekoodin HTML5 pelimoottoreita, joiden suorituskyky mitattiin ja vertailtiin toisiaan vastaan. Tätä varten rakennettiin testityökalu, jolla suorituskykyä pystyttiin mitattaamaan Asteroids -tyylisellä pelillä piirrettyjen kuvien tai kolmiulotteisten objektien määrän kasvaessa ajan myötä. Pelimoottoreita testatiin Google Chrome ja Mozilla Firefox verkkoselaimilla. Tämän lisäksi testit suoritettiin korkean ja matalan suorituskyvyn tietokoneilla. Applen Safari verkkoselainta tai mobiililaitteita ei tässä tutkimuksessa testattu. Testissä simuloitu peli piirreettin yksi kuva kerrallaan tarkan ruudunpäivitysnopeuden ja -ajan laskemiseksi. Tämän lisäksi Microsoftin tarjoamaa ProcessExplorer työkalua käytettiin tiotekoneiden prosessorien ja grafiikkakorttien kuormien arviointiin. Niin kaksi- kuin kolmiulotteisia pelimoottoreita valittiin tutkimukseen. Mikäli moottori tuki molempia, molemmat toteutukset testattiin. Tämän lisäksi puhtaat toteutukset canvas -elementillä sekä WebGL kirjastolla tuotettiin vertailun vuoksi. Tutkimuksen lopputuloksena todettiin että WebGL:ää tukevat pelimoottorit suoriutuvat pelkästään canvas elementtiä käyttäviä pelimoottoreita huomattavasti paremmin. Kaksiulotteisista pelimoottoreista PixiJS ja Babylon.js selviytyivät parhaiten, kolmiulotteisista Three.js. Puhtaan WebGL toteutuksen pohjalta on turvallista kuitenkin ennustaa että kaikkien WebGL:ää tukevien pelimoottoreiden suorituskyky tulee paranemaan tulevaisuudessa.