How to load all images in a BOOT mode in an optimal way?

[weratius]

Hi, everybody!

 

I load all my images in a BOOT mode (ALL MY IMAGES)

 

The total size of all images was about 200MB, after using GULP the total size decreased to 107MB, as you can see it was still to much)

 

I'd like to know how is it better to load all of them?

 

There is an image of the structure of files (each of them has it's own images) in attach files 

 

Thank you =)

Any help is appreciated =)

[Skeptron]

I think your problem is not really how to load them but how to improve them. 107MB is an awful lot, loading will take ages (and I'm not even talking about shitty edge connection for mobiles). So you should definitely consider improving your images.

 

What format do you use? Make sure you use lightweight format like JPG or GIF, and compress your images as much as possible (find a good balance between compression and precision loss). 

 

You can also try to use conditional loading : for a racing game, you don't need all car images every game. Only load the cars that will actually run the game. Try not to load any unnecessary image. If you don't use the connection while the game is running (solo game), you could try to load some assets while the game is playing (like, the end-level assets, while the player is just starting). But it might decrease the performances.

 

Also, try to use spritesheets : it can save a little space, and it also reduces the number of calls to the server (which slightly improves performance).

 

This is a difficult topic, as we all want to create magnificent games with breathtaking art. But we also have to keep in mind that web games load assets every time (or almost : thank you caching), thus this part has to be optimised.

 

If anyone has some more advice to share I'd be happy to know.

[weratius]

I think your problem is not really how to load them but how to improve them. 107MB is an awful lot, loading will take ages (and I'm not even talking about shitty edge connection for mobiles). So you should definitely consider improving your images.

 

What format do you use? Make sure you use lightweight format like JPG or GIF, and compress your images as much as possible (find a good balance between compression and precision loss). 

 

You can also try to use conditional loading : for a racing game, you don't need all car images every game. Only load the cars that will actually run the game. Try not to load any unnecessary image. If you don't use the connection while the game is running (solo game), you could try to load some assets while the game is playing (like, the end-level assets, while the player is just starting). But it might decrease the performances.

 

Also, try to use spritesheets : it can save a little space, and it also reduces the number of calls to the server (which slightly improves performance).

 

This is a difficult topic, as we all want to create magnificent games with breathtaking art. But we also have to keep in mind that web games load assets every time (or almost : thank you caching), thus this part has to be optimised.

 

If anyone has some more advice to share I'd be happy to know.

Thank you for such a detailed answer.

 

I thought about using conditional loading, that's right.

 

It is such called a lazy loading, isn't it?

[Skeptron]

Yes you're right, I think lazy loading is the perfect name for this situation! If the player ever dies or quits before the end of the level, then you don't load the final boss. You save broadband and efforts =)

[weratius]

Yes you're right, I think lazy loading is the perfect name for this situation! If the player ever dies or quits before the end of the level, then you don't load the final boss. You save broadband and efforts =)

got it =)