I'm thinking about using CAAT as a part of a HTML5 game engine. One of it's features is the ability to render to Canvas and WebGL without changing anything in the client code. That is a good thing, but I haven't found precisely: what are the differences between those two technologies?

I would specially like to know the differences of Canvas and WebGL in the following regards:

  • Framerate
  • Desktop browser support
  • Mobile browser support
  • Futureproofability (TM)
  • 1
    \$\begingroup\$ I would imagine this varies from project to project and platform to platform. I would guess it's not answerable with a definitive answer. \$\endgroup\$
    – House
    Oct 1 '12 at 2:29
  • 2
    \$\begingroup\$ Technically, you need a canvas element to render with WebGL, so it's better to refer to the Canvas 2D Context. \$\endgroup\$ Oct 1 '12 at 8:56
  1. Framerate varies by browser. A few still do not support accelerated canvas rendering, others don't support WebGL at all. Best bet is to profile actual code on actual target hardware/browsers to determine which performs best for your specific needs and user demographics.

  2. WebGL is only supported on IE in version 11+ but canvas has been supported for several versions. Consider the current market share of older versions of IE.

  3. WebGL support is sometimes blacklisted by the browser on older hardware or drivers. When it comes to support, you need to consider this in addition to the minimum browser versions, and clearly communicate these requirements to customers.

  4. Few mobile browsers support WebGL today. They mostly all support canvas.

  5. Both canvas and WebGL are around to stay. Neither is more future proof than the other.

  • 2
    \$\begingroup\$ I'm curious what game did you ship? I'm always interested in WebGL related topics and I've seen very view commercial WebGL games. \$\endgroup\$
    – Anton
    Oct 1 '12 at 4:03
  • \$\begingroup\$ More info on WebGL support: caniuse.com/webgl. \$\endgroup\$
    – jcora
    Oct 1 '12 at 12:52
  • 2
    \$\begingroup\$ Since this reply was given, WebGL support has grown a lot. It's supported in the latest version of Internet Explorer, works in Chrome, Firefox (although you have to use "experimental-webgl"), and Opera. It's also supported in Safari, although it's disabled by default. \$\endgroup\$
    – Notch
    Dec 23 '13 at 11:38
  • \$\begingroup\$ @Notch: Right. Two years is a long time for the Web. Mobile is the big issue right now, particularly on the ever-important iOS, but that'll surely come around before too long. I'll update the answer for the IE part though as I clearly failed to predict that one. :) \$\endgroup\$ Dec 23 '13 at 18:10
  • 1
    \$\begingroup\$ Can someone update this answer for 2018? Thanks \$\endgroup\$
    – demiculus
    Nov 16 '18 at 12:39

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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