0 Favourites

Correct the background application - performance

  • My game has a 1280 x 720 resolution and is for mobile devices.

    The game features a background image in the same ratio 1280 x 720.

    What would be the best way to apply this fund without losing performance?

    It's just a background art.

    Sry my bad english! Thanks

    This would be an example:

  • Since it is static background.... I suggest having each object as sprites and make the repeating images as tiled background.

    For example:

    Sprites:

    *Castle Body - Make only 1 body. (Mirror it on the upper part to save memory.)

    *Castle Head - Make 1 with 2 animations. First animation : Red , Second Animation : Blue.

    *Trees - You can make 2 or you can have only one and just duplicate & tilt the one in-front for the background tree.

    *Mountains & Hills : You can just duplicate them all to different instances and use the z-order, opacity & size to make and effect like that (with the same single sprite image).

    *Clouds - Have one in sprite and manipulate opacity & size to make that effect, just make sure to have the Blue Sky Tiled BG.

    *etc... You get the idea.

    TiledBackground:

    *Blue Sky (2x2) Blue Color

    *etc... You get the idea.

    In C2 games, Backgrounds like these are not made in a single image, they are from separate images (sprites / tiledbackground) that are repeated, duplicated, rotated, resized, faded, & tiled to optimize the game as much as possible. So I hope you get the idea .

    Reference :

  • inser the whole image as a tiled background if it's a static image.

  • If the whole 1280x720 background is drawn, it will probably perform the same regardless of how you display it (one object, multiple tiles, sprite vs tiled background, etc).

    A bigger concern is the memory usage, which the blog post chadorireborn linked to talks about.

  • Since it is static background.... I suggest having each object as sprites and make the repeating images as tiled background.

    Thanks for the answer!

    I read this post (https://www.scirra.com/blog/112/remember-not-to-waste-your-memory) and I understood that the same images should be separated and placed as background. And unique images should be separated and placed as sprites. But I still have this doubt ->

    Would I be wrong to create a tile map 1280 x 768 and separate it into 256x256 blocks? And mount the background with 256 blocks as a puzzle. Or it would be like to play the whole picture?

  • But I still have this doubt ->

    Would I be wrong to create a tile map 1280 x 768 and separate it into 256x256 blocks? And mount the background with 256 blocks as a puzzle. Or it would be like to play the whole picture?

    It would still consume the same amount of memory regardless if you use tilemaps, tiledbackgrounds or sprite if the whole image is imported.

    The only optimization in separating images is that you can use 1 image for similar objects. For instance, there are 2 castles but the body are both the same, only the

    head is different because it differs in color. So we can have 2 castle heads (red & blue) but only 1 body which will be cloned into 2 instances. Now you saved a few memory from the castle body.

    For Example Explanation:

    The Background Parts: (2 Castle Body & 2 Castle Head)

    Whole Image

    1 Castle Head = 500 KB

    1 Castle Body = 500KB

    Needed Castle Head : 2

    Needed Rotated Castle Body : 1

    Needed Non-Rotated Castle Body: 1

    Imported Castle Head : 2

    Imported Castle Body : 2

    Total Memory Usage: (500KB * 2) + (500KB * 2) = 2,000 KB or 2MB

    Separated Image

    1 Castle Head = 500 KB

    1 Castle Body = 500KB

    Needed Castle Head : 2

    Needed Rotated Castle Body : 1

    Needed Non-Rotated Castle Body: 1

    Since the actual Castle Body image is the same for both Castle, we only need one. We'll just clone the 1st Castle Body image to make a 2nd instance and modify it's angle to fit our need.

    Imported Castle Head : 2

    Imported Castle Body : 1

    Total Memory Usage: (500KB * 2) + (500KB * 1) = 1,500 KB or 1.5MB

    I hope that explains it.

    Reference:

  • It would still consume the same amount of memory regardless if you use tilemaps, tiledbackgrounds or sprite if the whole image is imported.

    Perfect! Now I understand. Thank you so much!

  • Construct 3

    Buy Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Buy Now Construct 3 users don't see these ads
  • Thank you all for answers!

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)