Construct 2

Game loading time optimization

Construct 2


Game loading time optimization

Game takes too long while loading (common problem)

This is usually a problem for mobile apps since mobile devices are simply weaker than PCs. However big projects can take quite a while to load even on decent PCs.

One of the common problems due to long loading time is the infamous "Black Screen" which may last for several seconds on mobile games wrapped with Cocoon.io.

What loads on initial app loading?

Construct 2 initially loads all the components needed to run the project smoothly, they are: engine, data, cordova (for mobile apps), plugins (and related libraries), images and sounds.

We can't optimize all of them, for instance make a change to the engine or cordova, but still there's a lot that can be done!

Image assets

If you read the Construct 2 manual then you know that at start of each layout C2 loads all the image assets that are on the layout into the memory. The images are first decompressed from PNG/JPG to BMP and the BMP version of the asset is stored in the memory.

The PNG/JPG weight does not impact the amount of memory the asset will consume as the BMP weight is based on the image dimensions. No matter how well your 100x100px image is compressed, it will always consume around 39KB (100 * 100 * 4 / 1024) of memory.

At first glance it looks like compressing image assets is pointless right? When it comes to memory use then yes, it is pointless, however compressing the images is important when it comes to the final size of the project and initial app loading. What may surprise you is that Construct 2 loads ALL the image assets at start! The images are however not decompressed on initial load, but are loaded as (PNG/JPG). Even though they are not decompressed, they are downloaded  whichtakes time. The heavier the images are the more time it takes to load them. Only assets which are on the very first layout of your app will be additionally decompressed to BMPs on initial app loading.

The conclusion, in order to speed up the initial app loading time you should compress the images as much as you can and use as few sprites as possible on the very first layout of your app.

Sound assets

Sound assets load at start of the project by default and this may seriously affect load time if you have a lot assets in your project. A quick and simple "fix" for that is the "Preload sounds" project property. You may want to set it to "no" (sounds will not be preloaded at start) and then manually preload sounds later in app.

Note that the initial preloader loads only sound files. Music files are streamed once you play them. Remember to put music files under "Music" folder in your project.

Project components

Game is not only a set of images and sounds. There are other components like layers, layouts, objects, plugins, variables, etc. All of the mentioned also impact the game loading time. Each data or parameter has a value which is stored in data.js file. This file obviously must be loaded at the start of the app. All the plugins you use in your project are simply JavaScript files so again it is something to load.

However, even though the components affect load time, it is highly recommended not to optimize this part at all as there is no noticeable difference compared to sounds or images not to mention you will probably end up with a cluttered project (ex. Reducing number of layers or event sheets). Keep in mind that the code architecture (in most cases) is the most important - even more important than the performance itself. But that's a story for another article!

 DO YOU LIKE THIS ARTICLE? 

Stay updated! Follow us on Twitter and like us on Facebook