1
\$\begingroup\$

I am quite new to programming with <canvas/> and WebGL, but very familiar in HTML5. So far, I have made to render some entities on the <canvas/>. Next would be to add a simple HUD to it.

I wonder, though, would it be a good idea to use HTML-tags for the HUD and UI elements? That would make them a lot easier to create, but perhaps that would have a big impact on performance. Is it worth to make a <canvas/>-Only HUD engine?

I'm even tempted to replace the sprites with <div/>-Elements, since they're only rotated and moved, so perhaps a css-rotation is better suited?

\$\endgroup\$

closed as too broad by Josh Jan 6 '14 at 16:31

Please edit the question to limit it to a specific problem with enough detail to identify an adequate answer. Avoid asking multiple distinct questions at once. See the How to Ask page for help clarifying this question. If this question can be reworded to fit the rules in the help center, please edit the question.

  • \$\begingroup\$ Questions like this are ones you really need to answer for yourself -- they are very broad and discussion oriented in general, and usually the only way to scope them down is to have extensive knowledge of the problem domain (that is, your project). Is there a specific problem you are having with using HTML for the UI? Perhaps consider asking about that instead. \$\endgroup\$ – Josh Jan 6 '14 at 16:32
  • \$\begingroup\$ Seconded. What performance problems are you seeing mixing DOM and canvas? Consider asking about those instead. \$\endgroup\$ – drhayes Jan 6 '14 at 16:35
1
\$\begingroup\$

I'd done some preliminary testing using Dojo UI floating over a canvas, and I found performance to be horrendous. This sparked some research into the availability of canvas-rendered UI toolkits. I was happy to come across Zebra UI, and have had great success with integrating it into my game's engine.

The author is quite in-touch with Zebra's user-base, and is very welcoming when it comes to working out issues and discussing new features. I'd strongly recommend using Zebra UI.

http://www.zebkit.com/

\$\endgroup\$

Not the answer you're looking for? Browse other questions tagged or ask your own question.