WebGL around the net, 18 May 2011

I’m a bit behind with my link backlog, so here’s the highlights:

  • So if you’ve been watching WebGL at all over the last week or so, you can’t have missed the demos from Google’s IO conference:
    • ROME, a “3D Interactive Music Experience”, largely built on top of three.js. Well worth a look! (sadly Chrome-only, apparently [UPDATE alteredq explains that it should work in other browsers, but might have problems. I can confirm that it crashed Firefox on Win7/ATI graphics for me, but YMMV])
    • Angry Birds, using WebGL. You can play it at the Chrome store, but you can play it in other WebGL-enabled browsers at the slightly oddly-named chrome.angrybirds.com. I don’t know if the latter is using WebGL — if not, it’s a little disappointingly-named, and I must admit I’m a bit sad to see something that could be cross-browser being so tightly bound, at least in its marketing message, to Chrome. OTOH, it’s Angry Birds, so just try not to spend too much of the next few days stuck on the site :-)
    • Gregg Tavares talk on optimising WebGL is also well worth your time. It’s got a nice introduction to how WebGL, then takes off into how to animate scenes with tens of thousands of objects, and some nice stuff on post-processing (including how to simulate 3D textures even though WebGL doesn’t support it) and Things To Not Do in your WebGL code. TL;DW version — if you’ve got lots of objects to draw, use particle simulation tricks — flatten 3D textures into 2D ones (watch the video for how to create the 3D textures in the first place) — persistence is easy with multiple frame buffers — don’t call gl.getXXX when in your render loop — use the fact that a canvas’s width and height are its number of pixels but the CSS style sets its actual on-screen size (so you can make it 512×512 pixels but display at 1024×1024 on-screen) — and whatever you do, always make sure you run Windows Update before you give a talk :-)
  • An official response from Khronos about last week’s reports of WebGL security vulnerabilities [UPDATE: corrected the link].
  • A very cool raycasting demo from Paulo Falcão — click on the “Auto” text in the top right to take control and use WASD and the mouse to change the viewpoint manually. You can also switch it into Canvas 2D (non-WebGL) mode, which gives an interesting demonstration of the kind of extra performance hardware acceleration brings.
  • If you’re interested in WebGL, you might be interested in WebCL, its upcoming sister standard for highly parallel computation in the browser (think physics modelling for games). Evgeny Demidov has some samples — you’ll need to download some extensions to get them to work, though.
  • SceneJS 0.8 has been released, with some serious performance enhancements from compiling the scene graph, geometry morphing, a new COLLADA importer, and much more.
  • This looks like a great introduction to three.js, by Paul Lewis.
  • From Bartek Drozdz, a WebGL-based 3D engine that can run scenes exported from Unity3d. Demos here.
  • More from Andor Salga: building a generic WebGL camera library.
  • Want to know what WebGL extensions your browser supports? Philip Rideout has the answer, at least for Chrome (Firefox won’t tell).
  • Texture lookup in vertex shaders doesn’t currently work in WebGL implementations based on ANGLE — basically, on Windows if you’re not forcing your browser to use the desktop GL implementation. But as of r645, that’s fixed. That version’s built into the current nightly Chromium builds, and I’m sure Mozilla won’t be far behind, at least for Firefox 6 (coming soon!)
You can leave a response, or trackback from your own site.

11 Responses to “WebGL around the net, 18 May 2011”

  1. OpiF says:

    Firefox 6? The FF5 beta 1 was just recently released… ;o

  2. alteredq says:

    ROME is not Chrome-only, it does run also in Firefox, just not so well as in Chrome (ROME pushes browsers to limits, for example there is noticeable improvement in performance between stable and canary versions of Chrome).

    If it doesn’t work for you in FF, chances are you have ATI graphics card.

    There are troubles with video sections with certain ATI cards on Windows when running old version of ANGLE (which is unfortunately default on both current stable FF 4 and CH 11). There is some texturing bug which got fixed in later ANGLE versions, CH canary should be ok.

  3. drojf says:

    He didn’t mention using this ‘trick’ for calculating the sin values:

  4. Lars Gunther says:

    Angry birds at the url chrome.angrybirds.com is using 2d canvas.

    Putting browser names in url’s is so 1995. I thought we’d learne dby now that it is really, really bad….

  5. giles says:

    @OpiF — I think that they’ve frozen the ANGLE version for FF5, so it’s not going to be updated to this new version until #6. However, they’re increasing the update frequency — after all, FF4 was only just released and they’re already doing the #5 beta.

    @alteredq — interesting. When I went there in FF the other day, I could have sworn that it wouldn’t let me even try it. Now I see that it will allow me, though it warns that it might not work. Crashed the browser, though :-S

    @drojf — nice link, thanks!

    @Lars — are you sure? It looked like WebGL when I looked, I could be wrong though. Agreed re: browser names in URLs.

  6. Benoit Jacob says:

    The Mozilla bug for upgrading our ANGLE copy is
    We really want this in Firefox 6.

  7. Benoit Jacob says:

    Regarding Angry Birds, my understanding what that the ‘SD version’ was Canvas 2D, while the ‘HD version’ was WebGL. I could be wrong.

  8. giles says:

    @Benoit — right, that’s what I thought on both counts.

  9. mariuz says:

    For the next update:
    iOS RAGE rendered with WebGL and the file format notes
    The movie
    and the Tech talk for this demo


  10. aa says:

    Important for WebGL and JavaScript performance overall: Chromium has soon (probably tomorrow)Float64Array support!

  11. giles says:

    @mariuz — yup, saw those — tojicode’s very much on my RSS feed list. Thanks for passing it on, though!

    @aa — thanks for the heads-up!

Leave a Reply

Subscribe to RSS Feed Follow Learning WebGL on Twitter