Skip to content

Performance issue with ScrollBox addItems #244

@Gnomcho

Description

@Gnomcho

Issue
When adding a large number of items (e.g., ~500), performance issues occur on some mobile devices. I was also able to reproduce the same issue on the desktop when adding around 5000 sprites.

Code to reproduce the issue:

const scrollBox = new ScrollBox({
    width: 100,
    height: 300,
    elementsMargin: 5,
  });

  let sprites = [];

  for (let i = 0; i < 5000; i++) {
    const s = new Sprite(Texture.WHITE);
    s.setSize(20, 20);

    sprites.push(s);
  }

  scrollBox.addItems(sprites);

Suggestion
Introduce an internal check so that resize is executed only once when adding many items at once.

    {
        if (!items?.length) return;

        items.forEach((item) => this.addItem(item, {skipResize: true}));
        this.resize();
    }

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions