CODEWITHSUNDEEP
javascripthtmlcsshtml5-canvas
sv94
sv94

Reputation: 131

Multiple Canvas Board Game vs. Single Canvas

I am new to programming games. I'm just wondering, so for a simple board game (let's say Tic Tac Toe or Checkers), would it be a good idea to use multiple canvas for the board? I mean, each canvas could represent each square on the board.

I feel that many people tend to do it like this because it keeps the logic simple. You let the CSS do all the spacing and annoying square separation. But I don't know if it's good practice to do it like that.

Since I am new, I feel that avoiding shortcuts now will be beneficial when I create something complex. So, what's your take on separate canvas for each board square?

Upvotes: 1

Views: 1072

Answers (1)

user1693593
user1693593

Reputation:

The most important thing is to find a balance and understand why you would use one canvas versus layered canvases.

For a tic-tac-toe game only one is needed as there is nothing there that needs constantly updates. If would be easier to maintain as well. Event-driven (ie. nothing happens until you click/do something) games/apps such as this would typically not benefit from several layers.

When you use more than one canvas it is usually because you have a static or complex background (or foreground for that matter), and some objects moving over it that needs to move smoothly. This would be a good candidate for layering canvases as this allow you to clear and redraw only the region of the moving object instead of rendering the background as well (particular in cases where the background is a composite).

It's not much more complex to handle layered canvases than one, but you would need to keep track of where you do the draw operations. You can use objects with embedded information to do this, or for extra performance use arrays/variables.

Upvotes: 3

Related Questions