Replies: 1 comment 1 reply
-
I don't know about the best approach but I'm using a technique that seems to scale pretty much infinitely unless your level is just ridiculously huge and won't fit in memory. Get your viewport bounds, translate to world coordinates, divide by your tile size (if you're not using tiles then use a broadphase system that partitions areas into tiles/chunks). Then you directly have the tile coordinates you want to display. Before you loop through your tiles though create another bounds that is slightly larger and mark anything outside of the viewport bounds for culling. Then when looping over the actual tile cells keep the id of everything you want to render in a Set. Next time you render you can check this Set if a cell/object is in the Set and do nothing, otherwise add it to stage and put it in the Set. Use an object pool for everything (Sprites, game data objects). I've tested it up to 2048x2048 which is over 4 million tiles and it runs just as fast as 100x100 tiles. Really only limited by how much you can have on a screen and how far you can zoom out. You only ever add Sprites that are actually displayed and you only ever have to loop through the cells you can actually fit on the screen. |
Beta Was this translation helpful? Give feedback.
-
Hello all! I am working on a web game, https://wizardwars.online. The game uses pixi.js for rendering.
I've struggled to answer this question by Googling:
What is the best approach for Culling in 2023?
Beta Was this translation helpful? Give feedback.
All reactions