How taxation of the game card grid will be in a web browser?

Suppose we make a strategy game (think Civilization) in a web browser. The game has a visible part of the map - say, 30 x 30 squares. Each square is 30x30px and has several overlays - terrain, resources, units, roads, etc. The classic way of drawing will be huge <table>, where each cell will contain absolutely positioned images. This will probably be shown in Javascript to reduce traffic. But these are several thousand more images and a huge table.

Can the browser take it? Will performance drop below acceptable limits? Alternatively, I could save the image with a pre-processed map with as many overlays as possible, but I think it will be more work.

+3
source share
2 answers

You should really explore the canvas element , which does not require the browser to save and calculate the entire layout and other DOM materials.

, FishIETank. - - . , , , , div position:relative; absolute absolute ly .

+1

-, grepolis, - , ​​ , .

+1

Source: https://habr.com/ru/post/1790194/


All Articles