CODEWITHSUNDEEP
javascripthtml
Christian F
Christian F

Reputation: 259

Rebuilding tables from the ground up or updating the content?

I'm building a browser based game in JavaScript. It contains a lot of Information visualized via tables. The game is turn-based, so whenever a turn is completed, I need to adjust a lot of innerHTML of those tables.

My question is:

Is it smarter to give IDs to all the <td> and update the innerHTML or is it smarter to wrap the tables inside a div, clear the div and rebuild all tables from scratch, then append them?

Upvotes: 1

Views: 74

Answers (2)

Adrian Thompson Phillips
Adrian Thompson Phillips

Reputation: 7158

It depends on how long a view stays active, if the view is shared, how many cells change and how frequently.

If you have a high number users looking at different views/pages that stay active for a long time, then it might produce less load on your servers if you can make infrequent updates to individual cells.

If the changes happen less frequent and a high proportion of cells change, then it may be best to refresh the whole table. This would be 'less chatty' and use less network bandwidth overall.

However if you have a high number of users, all looking at the same view/page, you may wish to look into CQRS and caching your views or view data.

Upvotes: 1

user1740375
user1740375

Reputation:

Rather replace the innerHTML, the code will look nicer and it will be a lot more effortless, because instead of recreating the whole thing you would just be replacing a string in an object, which is obviously a lighter task. So in most cases it makes sense to do that. Consider using a framework or templates, though.

Upvotes: 0

Related Questions