Godot WebGL -sovelluksen upotus ja optimointi reaktiivisessa web-ympäristössä

Abstract

Tämän työn toimeksiantajana toimi Pesmel Oy. Työn tavoitteena oli tutkia, testata ja kehittää optimointeja yrityksen varastonhallintajärjestelmän 3D-näkymään parantaakseen suorituskykyä sekä varmistaakseen sovelluksen vakaus pitkissä käyttöjaksoissa. Työn aihe syntyi yrityksen halusta modernisoida varastonhallintajärjestelmän käyttöliittymää lisäämällä interaktiivinen kolmiulotteinen näkymä, joka näyttäisi koko varaston tilan reaaliajassa.

Työ tehtiin olemassa olevaan 3D-näkymäprojektiin, joka oli integroitu varastonhallinnan verkkosovelluksen näkymään. Tätä näkymää ei ollut vielä otettu käyttöön sovelluksen julkaisuversiossa.

Työ tehtiin kolmessa vaiheessa: taustatutkimus mahdollisista tekniikoista, jotka parantaisivat sovelluksen suorituskykyä, optimointitekniikoiden testaus ja hyötyjen arviointi, sekä lopuksi tekniikoiden implementointi sovellukseen. Työn aikana testattiin myös tekniikoita, jotka eivät tuottaneet tarpeeksi hyötyä. Raportissa käsitellään myös tekniikoita, jotka mahdollisesti parantaisivat suorituskykyä, mutta joita ei vielä tueta uusimmassa Godotin julkaisussa.

Lopputuloksena oli versio käyttöliittymästä, jossa 3D-näkymää pystyi käyttämään sulavasti, ja joka latautui tehokkaasti. Näkymä voitiin asettamaan jäädytettyyn tilaan käyttöliittymän näkymää vaihdettaessa, ja johon pystyi palaamaan välittömästi ilman tarvetta ladata uudelleen.

Opinnäytetyö toimii myös ohjeena optimointien toteutukseen samantyylisissä projekteissa reaktiivisessa web-ympäristössä.

This thesis was commissioned by Pesmel Oy. The aim of the work was to research, test and develop optimizations for a warehouse management system’s 3D view to ensure smooth user experience and ensure long runtimes. The topic of this work came from the company’s desire to modernize the user interface of the warehouse management system by adding an interactive three-dimensional view of the warehouse, displaying the warehouse state in real time.

The work was done on an existing 3D view project integrated into the warehouse management web app’s view, which has not been taken into use in a release build of the app.

The work was done in three stages: background research on possible optimization techniques that would improve the application’s performance, testing of optimization techniques and evaluation of benefits, and finally implementing the techniques into the application. During the work, techniques were tested that did not provide enough benefit. The report also discusses possible techniques that could potentially improve performance but are not yet supported in the latest Godot release.

The result was a version of the user interface where the 3D view could be used smoothly, and which loaded efficiently. The view could be set to a frozen state when changing the user interface view, and to which it could be returned at once without the need to reload.

The thesis serves as a guide for implementing optimizations in similar projects in a reactive web environment.