I’m creating an HTML 5 chess game. Server side is socket.io / node.js / backbone.js.
I’m now beginning to write the view for the game board. Would it be easier to represent a chess board in canvas or DOM elements (aka divs)? Disregard browser compatibility.
Really comes down to your motives.
If you know game developement well, and you’re comfortable with dividing screens into segments for purposes of collision-detection or otherwise, and you can easily create your own custom click events, per square/unit, based on where on the canvas the player clicked, then go with the canvas, as you’ll open more doors to advanced animations and graphical-interactions that way.
If you aren’t comfortable with that, and would like a straightforward way of knowing which square was clicked, and would like a clean-cut way of knowing if there was a unit in the square you landed on, without having to figure it out based on the X and Y where you clicked inside the game window, then go with the DOM — really, those are the benefits and most everything else is a side-effect of picking one or the other.
Canvas for animation and “polish”, DOM for event-listeners and array-based (or attribute-based) notification of square clicked.