Preloading images? FPS issue

I'm having some performance issues that I feel are being caused by sprites loading on creation instead of being loaded at the start.

I have about 6 *heavy* sprites (heavy meaning over 100 frames of animation in a 128x128 dimension image) which seem to be causing me problems.

The thing is, my game runs at a nice steady framerate until these sprites need to be created. Then it nosedives for a couple of seconds until the sprite is "loaded". But doesn't Construct 2 load this stuff at the start?

Further evidence that the sprite creation is the problem, is that after a while, my game's framerate actually improves overall, even with more of these sprites on screen. Which tells me that now they are "loaded" and not causing stress on the hardware.

Is there some way to preload sprites or images? Is there a way to preload other things as well? I thought perhaps setting the sprites to global and putting them in another layout, they would be "preloaded" but this doesn't really seem to be working.

So what's the deal?

Are you using webgl? If so, c2 is using layout-by-layout loading - meaning anything not in the layout is dumped from memory. When you create an instance, it needs to be loaded again - resulting in a pause while it does so.

To eliminate the pause, either keep it in the game as a global object or create an instance at the beginning of the layout and keep it invisible instead.

I haven't tried it yet, but c2 also might not unload the sprite from memory when there are no instances if it was in the layout at from the start at edit time. That's just a thought though, I don't know if it's the case.

Well it's running on iOS in canvas2D... which is where the problem is, since it can't use webGL to let the GPU handle some of the load.

I have the sprites in game as a global object but they are on a layout that isn't accessed... Do I need to have it go to that layout first and then jump over to the main layout?

I think I was having worse results by having it destroy at start but remain in the main layout.

Do you think maybe creating the objects at start and then destroying them would load them while also removing them until I need them?

Hmm... Maybe it's safari unloading the textures on it's own. Browsers have their own memory management.

Global means the object is not destroyed when switching layouts. You need to go to the layout it's on first, or create it in the layout instead. You'll probably still have the problem if you destroy all instances of it at any point. There must always be an instance of it somewhere, even if it's invisible, or you're going to have a pause when loading the textures when creating an instance again.

In the canvas 2D renderer it is not possible to manually manage memory like we do with WebGL - it's entirely down to the browser. So in this case it's a problem with Safari rather than Construct 2. To preserve memory, Safari probably does not load any textures until they are actually drawn, which means the first time they are created and start playing an animation it's loading a texture for every new frame that appears. It's difficult to work around this, because you'd need to render every frame of every sprite you want pre-loaded before the game starts.

I would strongly recommend you do not use 100-frame animations in the first place. This is the fastest way to exhaust limited device memory on mobile and make your game unplayable on weaker devices.

Ashley - this is a slightly old thread, but I'm having trouble with this now, so I hope you don't mind the resurrection:

Would splitting a 100 frame animation into smaller chunks of animations within the same sprite help performance issues? Say, instead of 100 frames in one animation, doing 4, 25-frame animations (and then setting them to run one after the other).

All animations within a sprite are loaded when the sprite is loaded, so it would not help with this problem.

wretchedshark the only thing to do is try and make the animation with events, or perhaps try to reduce the framerate.

Arima - Thank you! Are there any other possible workarounds?

If it's quite large I assume making it a global object would probably cause problems for weaker devices since it would never be destroyed (from layout to layout) right?

sqiddster - thanks for the reply! Its for a project that is not mine, it's a gif to explain the "story" - given it's size I expected a delay (it's quite large and just over 100 frames) they are concerned about the delay, so I was looking for solutions.

The delay seems to happen every time whereas sound delays after first loading are no longer there, so it must be combination of the size and the browser loading it when it is first drawn.

Thanks again for the replies, I always like learning more about improving performance <img src="smileys/smiley1.gif" border="0" align="middle" />

Note this thread is out of date; we implemented preloading in canvas 2D via a hack, so even canvas 2D browsers like Safari should preload images layout-by-layout without loading anything during the game. So I am doubtful image loading is still causing any issues you're having.

Splitting up animations will have no effect whatsoever; if a sprite object is on a layout, the preloader will load every animation frame for it. As I said earlier in the thread I still strongly recommend you don't use such long animations, since it can be extremely wasteful for devices with limited RAM, like mobiles. We get a lot of support requests from people with "broken" games, when all they've done is given the device more images than it can fit in memory.

Is it not possible to show memory consumption somewhere in Construct 2?

It would probably save a lot of headaches if people could see just how much memory is being consumed.

Construct 2 shows an estimate in the status bar in the latest builds. At runtime some browsers can show you WebGL memory use, in Firefox you can check in about:memory IIRC.

Since images are loaded layout-by-layout my game "freezes" for some seconds, when switching layouts.

Is there a way to show the loading progress, or to enforce loading all images on game-start?

having same problem ... on ios for iphone 4 ... i dont understand why iphone 4 can run other complicated game with heavy animation on appstore (see a lot of 3d game on appstore it run normally) and my simple game is go to slow down

is using scale inner or outer cause that ? (personnaly i'm using scale inner and centrate / ajust the game)