kaplayjs / kaplay

🦖 A JavaScript/TypeScript Game Library that feels like a game, fun
https://kaplayjs.com
MIT License
568 stars 38 forks source link

REALLY IMPORTANT BUG: much area() induces lag even if transform is never changed #538

Open dragoncoder047 opened 5 hours ago

dragoncoder047 commented 5 hours ago
kaplay({
    tagsAsComponents: true,
});

loadBean();

function recur(obj, level) {
    if (level < 0) return;
    const obj2 = obj.add([
        pos(rand(vec2(0), vec2(100))),
        scale(rand(vec2(2))),
        rotate(rand(0, 360)),
    ]);
    if (level === 0) {
        obj2.use(sprite("bean"));
        // obj2.use(area());
    }
    recur(obj2, level - 1);
}

for (var i = 0; i < 500; i++)
    recur(getTreeRoot(), 2);
var frames = 0;
onUpdate(() => {
    frames++;
    debug.log((frames / time()).toFixed());
});

This creates 500 objects with random transforms, with 3 objects nested in each, and on the lowest level, it just adds area(). (commented out above cause less laggy). The transforms are not changing, yet if area() is used it lags much.

Results from kaplyground

Browser FPS w/o area() FPS with area()
Chrome 131 120 2 (but it claims 6)
Firefox 132 119 1 (but it claims 5)
Safari 18.1.1 20 0.5 (but it claims 4)
dragoncoder047 commented 4 hours ago

The strange thing is that this only occurs in the kaplayground, I can't reproduce it when I copy it into a local example in my fork of kaplay, they all get max fps. Even the "export to html" opened via a file:// URL gets lag, but the localhost:8000 version from vs code does not lag.

dragoncoder047 commented 1 hour ago

I can't reproduce it when I copy it into a local example in my fork of kaplay

Turns out this is because the "new tag methods" broke something , if you change tagsAsComponents: true it lags like expected