Jump to content

[Garbage Collection] Broken? Adding sprites inreases GC activity for no "apparent" reasons?


imshag
 Share

Recommended Posts

I am having big issues with Phaser in regards to garbage collection (GC).

See for yourself.

 

post-6764-0-47751400-1396725126_thumb.pn

 

DEMO

http://knostara.de/prototypes/gc/

 

JSFIDDLE

http://jsfiddle.net/dWws9/

 

 

ISSUE

Currently i am adding 30x30 (900) sprites in order to simulate a isometric tile map.

This causes an immense increase in the GC activity.

We are talking about a GC cycle roughly every 400 ms.

 

By decreasing the tile number and therefore the sprite number the GC activity drops proportionately.

 

 

QUESTIONS

1. Is this a known issue?

2. Is this how it is supposed to work? If yes, can someone explain why?

3. Is my approach flawed?

4. Is this a problem with pixi.js? (I didn't experience such trouble with the pixi.js demos)

5. Are there any solutions to this problem? Other approaches?

 

 

 

Thanks for your time!

 

CODE

GAME = new Phaser.Game(1280, 720, Phaser.CANVAS, 'gameWindow', {    preload: preload,    create: create});function preload() {    GAME.load.image('grass_tile', 'assets/gt_7.png');}var randomInt;var posY;var x;var y;var TILE_SIZE_WIDTH = 64;var TILE_SIZE_HEIGHT = 32;var TILE_OFFSET_MODULO = -TILE_SIZE_WIDTH / 2;var TILE_MAP_WIDTH_TILES_COUNT = 30;var TILE_MAP_HEIGHT_TILES_COUNT = 30;var TILE_MAP_OFFSET_Y = 200;var group;function create() {    group = GAME.add.group();    for (y = 0; y < TILE_MAP_HEIGHT_TILES_COUNT; y++) {        for (x = 0; x < TILE_MAP_WIDTH_TILES_COUNT; x++) {            // Create some random noise, so the ground doesn't look leveled            randomInt = ((Math.random() * 4) + 0) | 0;            if (randomInt % 2) {                randomInt = -randomInt;            }            posY = TILE_MAP_OFFSET_Y + (y * TILE_SIZE_HEIGHT / 2) + randomInt | 0;            if (y % 2 === 0) {                group.create((x * TILE_SIZE_WIDTH), posY, 'grass_tile');            } else {                group.create(TILE_OFFSET_MODULO + (x * TILE_SIZE_WIDTH), posY, 'grass_tile');            }        }    }}
Link to comment
Share on other sites

Hi,

 

I'm afraid this is a Pixi.js level issue, although I completely agree it would be great to resolve - so I'll have a dig into doing that for them. Just to prove my point here is a timeline of 900 sprites running in pure Pixi canvas mode, no Phaser anywhere:

 

post-1-0-96612700-1396779590.png

 

And here is the code:

window.onload = function () {    // create an new instance of a pixi stage    var stage = new PIXI.Stage(0x66FF99);    // create a renderer instance    var renderer = new PIXI.CanvasRenderer(1280, 720);    // add the renderer view element to the DOM    document.body.appendChild(renderer.view);    requestAnimFrame(animate);    // create a texture from an image path    var texture = PIXI.Texture.fromImage("wip/gt_7.png");    for (var i = 0; i < 900; i++)    {        var bunny = new PIXI.Sprite(texture);        bunny.position.x = Math.random() * 1280;        bunny.position.y = Math.random() * 720;        stage.addChild(bunny);    }    function animate() {        requestAnimFrame(animate);        renderer.render(stage);    }}

However it's worth adding:

 

1) This doesn't happen in WebGL. The timeline does do a saw tooth but it's much less severe, for me it took nearly 2 minutes and the memory drop was less than a meg, which is nominal imho.

 

2) 900 sprites will never render on mobile in canvas fast enough to add a game on-top of this. Desktop should be ok if the hardware is good enough, but if you're targeting desktop you should target WebGL by default too really. This doesn't excuse what happens, but it's still worth noting.

 

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...