How do I disable loading all PNG files on start of the game

Get help using Construct 2

Post » Wed Mar 19, 2014 2:22 pm

Hi there!

I have 20 images in my game which are used in a gallery and on the score screen. They are quite memory consuming on my iPhone 4 (via CocoonJS Launcher App, using Canvas 2D/WEBGL).

my layout buildup is like this:
title screen -> game screen -> score screen -> game screen or title screen
gallery screen (via menu button on title screen)
option screen (via menu button on title screen)
hidden layout to initial spawn all highscore screens, otherwise I cant let them spawn in my gallery

currently the game loads every single file (*.png) on start of the game, even if the highscore images arent used in the first 2 layouts (title screen -> game).
This makes the game extremely laggy. If I remove all highscore images from the game it runs smoothly, so the problem is definitely with the images. strangely enough the gallery navigates without lag.

Is there an option, that the game only loads the images when it is supposed to do it? ( gallery and score screens, NOT the beginning of the game)

I also placed a "On Start of Layout => HighscoreParent -> Destroy" to every layout, but nothing changed (as expected)

gallery image usage:
Image

score screen image usage
Image

thanks in advance for help! (=
B
8
S
1
G
1
Posts: 29
Reputation: 735

Post » Wed Mar 19, 2014 3:15 pm

What I've heard about some weakness about CocoonJS is that CocoonJS has been designed to load all the files when application starting. So I think there's nothing you can do unless Ludei updates their system.
However, you can try resizing your images to be smaller, dropping the quality of them(like converting PNG-32 to PNG-8), or optimizing your game in other ways(Event optimizing, grouping, etc)
B
23
S
8
G
1
Posts: 172
Reputation: 2,780

Post » Wed Mar 19, 2014 3:41 pm

shaircast wrote:What I've heard about some weakness about CocoonJS is that CocoonJS has been designed to load all the files when application starting. So I think there's nothing you can do unless Ludei updates their system.
However, you can try resizing your images to be smaller, dropping the quality of them(like converting PNG-32 to PNG-8), or optimizing your game in other ways(Event optimizing, grouping, etc)


thanks for the answer.
I allready resized the images, since my first version was really unoptimized, with an approx. download of ~25mb and memory usage of ~280mb (according to construct 2) Now I'm down at 3.1MB download and 46.1mb memory usage. I don't think I can minimize the images any further, otherwise they would have a very bad quality on iPhone and iPad.

I'll look into the conversion from PNG-32 to PNG-8, although I've currently no idea what "PNG-Version" my images have.
When I thought about minimizing images I always gone straight for the resolution/pixels
B
8
S
1
G
1
Posts: 29
Reputation: 735

Post » Wed Mar 19, 2014 3:57 pm

does loading images from url work in cocoonjs? this could potentially be a workaround (if its supported)
edit: ignore, would only work online ofcourse :oops:
ImageImage
B
71
S
22
G
7
Posts: 827
Reputation: 10,177

Post » Thu Mar 20, 2014 7:46 am

thanks vtrix, but the game should work completely offline ;)

back to the PNG32/8 issue.
All(!) of the images are in PNG-24, which is at least for 80% of them not needed, since they look the same in PNG-8, we tried it yesterday and are going to convert every image from 24 to 8 now, on an original image (still with 7016x4961px) the size was reduced from 2.2MB to 900KB.

I'll post here the final result after all image reductions are in place

/edit: ok, looks like construct 2 saves all images always in png-32, but has an option to change that at export
for all who might stumble upon something similar:
(https://www.scirra.com/manual/129/image-format)
(https://www.scirra.com/manual/48/image- ... ons-editor)
(https://www.scirra.com/blog/66/image-co ... onstruct-2)
B
8
S
1
G
1
Posts: 29
Reputation: 735

Post » Thu Mar 20, 2014 7:48 am

Hey genbatzu,

I'd really like to find a solution for that, too!
If you have any news, please tell me. It's really annoying that the game loads so many images in the beginning.
B
14
S
3
G
1
Posts: 255
Reputation: 2,027

Post » Thu Mar 20, 2014 8:53 am

Thanks for the infos. This will come in handy, as soon as I'm into the optimizing state.
B
11
S
1
G
1
Posts: 81
Reputation: 892

Post » Thu Mar 20, 2014 11:19 am

Changing the image format has no effect on memory use. All images are decompressed to 32-bit BMP upon loading. The memory issue on loading is specific to CocoonJS: in every browser in existence, they only download the images on startup, and don't load them in to memory. CocoonJS goes ahead and loads them in to memory even though none of them are needed yet. I have explained the problem to Ludei over and over again and I'm baffled as to why they have still not fixed it.

Try Crosswalk - it doesn't have the same problem. Also we'll be looking in to an Ejecta exporter for iOS soon.
Scirra Founder
B
403
S
238
G
89
Posts: 24,654
Reputation: 196,155

Post » Thu Mar 20, 2014 1:39 pm

thanks for the infos Ashley!

I got the Approx. Download down from 3.3MB to 1.3MB thanks to changing it to png8 and jpg. However, as you said, it had no impact on the memory usage.

I had a (very) quick look at Crosswalk and it seems to only supports Android?
Ejecta looks really interesting, do you have an estimate, when "soon" is for this exporter? =)
How is PhoneGap? In one of your tutorials you said that Games can be very slow with it
B
8
S
1
G
1
Posts: 29
Reputation: 735

Post » Fri Mar 21, 2014 6:32 am

PhoneGap IS really slow. I exported a very simple project with PhoneGap, CocoonJS and IntelXDK. The game was running with 10 FPS on PhoneGap and 60 FPS on CocoonJS and IntelXDK.

I chose CocoonJS over IntelXDK cause of the shop handling.
B
14
S
3
G
1
Posts: 255
Reputation: 2,027

Next

Return to How do I....?

Who is online

Users browsing this forum: JonnaBunn and 23 guests