Need some help with performance issue on dynamic tiled map

[shellohunter]

Hi guys, many thanks to the simplest game engine I've ever seen.

I'm trying to made a game demo with ebiten these days, and I run into a serious performance issue. Need some help.

The game scene is 800x600 in pixels. it only displays a viewport of the map. the full map is a huge world, made of 1000x1000 tiles, while each tile has the size of 48x32. I cannot load them all into mem. so they are dynamically loaded in to mem while the player moves around.

Here's what I did: in each Draw(), I calculate those tiles need to be drawn (about 20 x20 tiles), load them into memory, and draw them
one by one to make the scene. I have a feeling that something is wrong... and yes, the FPS drops down to 5, or even lower.

Is there any better way of doing it?

[tinne26]

If you have performance problems with that type of game, yes, you are probably doing something wrong. If you could share the actual code that would be the easiest, but in the meantime, here is the general idea of what you should be doing and common pitfalls:

• You should have a single tileset loaded as an *ebiten.Image.
• When you have to draw a section of the map, you don't "load" anything into memory, what you do is draw the relevant tile at the relevant position using SubImage(). For example, you could have a Tile struct, which contains information about its ID, and its position within your tileset. Then, to draw it, you basically do: tileImage := tileset.SubImage(image.Rect(tile.ox, tile.oy, tile.ox + TileWidth, tile.oy + TileHeight), and then draw that tile image at the desired position in the screen.
• Make sure you aren't creating new images on each frame. You should reuse the tiles after the initial load.

This is similar to what this example does: https://ebitengine.org/en/examples/tiles.html. This example is a bit more raw, but that's the general idea.

For further performance tips, you might also be interested in https://ebitengine.org/en/documents/performancetips.html.

[shellohunter]

Thanks for your advice. I just checked the tile example (https://ebitengine.org/en/examples/tiles.html). As I could understand, it has a small number of tiles. and all tiles can be spliced together in order to load them into mem an once. the Draw() function can pave the screen with sub image. I read some similar guides before. But with 1000*1000 tiles, I still cannot follow the way.

I debugged into my code again. I made a small set of tiles cached in memory as *ebiten.Image, so all the io work were eliminated. the FPS went higher, but still not acceptable.

I guess those 20x20 DrawImage calls is the key problem. the guide (https://ebitengine.org/en/documents/performancetips.html#Make_similar_draw_function_calls_successive) says:

One drawing function like DrawImage or Fill is usually treated as one (internal) draw command, but there is an exception. Successive drawing commands are treated as one draw command when all the below conditions are satisfied:

I'll dig into it and have a try.

[tinne26]

It sounds like you are confusing tilemaps with tilesets. Even if you have a 1000x1000 world, you don't have 1 million different tiles, right? Or do you? (That would be extremely unusual and then you would have to explain better what are you exactly trying to do)

20x20 draw calls is definitely not a problem. If you test https://ebitengine.org/en/examples/sprites.html, you will see that even on WASM, which is far less efficient than desktop, you can have multiple thousands of moving and rotating sprites without FPS falling under 60.

[shellohunter]

ah, it's not as much as 1000*1000, but definitely more than 10000. I decompiled the map out of an mmorpg . it has complicated terrain, and lots of decoration objects on it. some tiles were reused, but still a lot were not. I guess it was created using tools like photoshop, then cropped into small tiles.

the same problem happened when I tried to merge those tiles to made a overview picture. it seems golang's image lib has very poor performance on jobs like that.

[tinne26]

This is a problem with your approach: the original MMORPG probably doesn't have that many tiles, but more likely it's mixing multiple layers of tiles, or using some larger images for terrain or other techniques that could be reproduced with shaders and noise, but not tiles. You should do more research first on what the original game did. It's also possible that globally the "unique tile count" is very high, but that internally most unique tiles appear only in "local regions", which vastly simplifies the problem, or using other tricks like simple color variations that rely on shaders but still use the same underlying tiles.

That being said, it's not like it's impossible to manage +10k tiles. First of all, 10k tiles would actually fit in a 4096x4096 texture... but there are valid approaches even if that wasn't the case, like having a cache of 1024 tiles and looking ahead for what you can potentially need in the surrounding area and load it very progressively, like, 1 tile per tick, and without creating new images, but using WritePixels or similar. I'm not saying you should do this, only that it's possible. What you should do is understand that you are approaching the problem in the wrong way because, most likely, you are using an inappropriate representation for the underlying map data.

[shellohunter]

I think you are right, I'm in the wrong way in the beginning,
I studied the MMORPG's behavior when the character enters a new map, it did load tiles to draw the map. but i noticed something else.
The map contains mostly static stuff. Keep the FPS around 60 for the map layer is not necessary at all.
I don't have to repaint the scene in every Draw(). there must be a way to making it work, I'll give it a try.

[setanarut]

My chunk loading system that I posted on the Discord channel yesterday. I think there is a bug in your code. In the video 2000 tiles are drawn without dropping FPS, it can draw more tiles but there is no need.

chunks.mov

[shellohunter]

this is exactly what I'm trying to do. but your tiles looks the same. are those tiles shares the same ebiten.Image instance, like the sprites example? (https://ebitengine.org/en/examples/sprites.html). what if they are all different?

[setanarut]

this is exactly what I'm trying to do. but your tiles looks the same. are those tiles shares the same ebiten.Image instance, like the sprites example? (https://ebitengine.org/en/examples/sprites.html). what if they are all different?

Yes. Blocks of the same type share the same *ebiten.Image. At the same time each block is a Chipmunk physical body and a Donburi entity. The whole map is stored as *image.Gray. Image.Gray can store 256 types of blocks (pixel value). The map size can be as large as the image.Image size limit.

[setanarut]

If I tried to draw 256 different *ebiten.images, there would be no difference in drawing performance. What matters is the number of images drawn in a single tick update.

[shellohunter]

that's impressive. will you share the demo code somewhere? it can be quite useful。

[setanarut]

that's impressive. will you share the demo code somewhere? it can be quite useful。

https://github.com/setanarut/kar