question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Talk about `renderChildren` again.

See original GitHub issue

One year ago , I created a PR https://github.com/pixijs/pixi.js/pull/3108/ .

I want to add the standalone methods about rendering & updating children. The reason is that user could override them for controlling which sprite/how render the sprite by themself . example:

There is a DisplayObject-Tree:

containerA |_____ spriteA |_____ spriteB |_____ spriteC |_____ subContainerA |_____ … some other sprites else …

Sometimes , I want to decide that render which sprite/how render the sprite by myself, like this :

if ( condition1 ) {
    spriteA.renderWebGL(renderer);
    spriteB.renderWebGL(renderer);
} else if ( condition2 ) {
    spriteB.renderWebGL(renderer);
    spriteC.renderWebGL(renderer);
    spriteA.renderWebGL(renderer);
} else  if ( condition3 )  {
    spriteC.renderWebGL(renderer);
    subContainerA.renderWebGL(renderer);
} else {
    subContainerA.renderWebGL(renderer);
}

The logic above can’t be solved by children.sort. If we extract the method about rendering children , user could override the renderChildrenWebGL & renderChildrenCanvas, it’s easy. there is another use case for custom remove :

container.renderChildrenWebGL = function(renderer) {
    // In one game loop , the render is the last thing about an entity normally.
    // So we could remove the entity in render function.
    var i = 0,
        len = this.children.length;
    while (i < len) {
        var child = this.children[i];
        if (child._toRemove) {
            len--;
            this.removeChildAt(i, child);
            continue;
        }
        child.renderWebGL(renderer);
        i++;
    }
};

If no standalone renderChildren , users have to override renderWebGL , renderCanvas, renderAdvancedWebGL , it’s complex , in especial renderAdvancedWebGL. And if the logic in Container.prototype.renderWebGL/renderAdvancedWebGL changed , users have to re-override them again.

But the logic of renderChildrenWebGL & renderChildrenCanvas is very clear , and they won’t be changed.

One year ago , @englercj refused my PR , the reason is performance . In the past year , I’ve tested many games (more than 20 games , and more than 100 test-cases) , I found this PR is not the hotspot of performance, even never affected performance. (BTW, I found the updateTransformChildren is needless , I and my friends never used it).

In the real game , we could use many sprites , but the count of container is not big at the same time( in one game tick), so the 1 function-call won’t take the performance down.

So I hope you could think the PR again, please, thank you.

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Comments:7 (3 by maintainers)

github_iconTop GitHub Comments

1reaction
ivanpopelyshevcommented, Jul 5, 2018

@finscn im working on a way to override pixi container methods in a plugin, and your input is significant. Lets close this one, I’ll address it later 😃

0reactions
lock[bot]commented, Jul 5, 2019

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Why does React re-render children when the parent changes?
React achieves a fast and responsive UI by re-rendering components on every state change (using setState) or from changes of props, ...
Read more >
The mystery of React Element, children, parents and re-renders
Looking into what is React Element, exploring various children vs parents relationship in React, and how they affect re-renders.
Read more >
render children - General Support - ProcessWire
As im statring to use $config->useMarkupRegions = true; I'm starting to run in things I can't figure out. In body field I have...
Read more >
DevTools: Fix or silence "cannot find fiber with ID" warnings ...
Sometimes I see "cannot find fiber with ID" when hovering over the tree. They are sporadic. I'll need to dig into why they...
Read more >
A (Mostly) Complete Guide to React Rendering Behavior
After the initial render has completed, there are a few different ways to tell React to queue a re-render: Function components: useState setters ......
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found