NOTE: I said that Firefox 4 beta 6 shipped with WebGL on by default. That’s not true. One needs to go into about:config, search for ‘webgl’ and switch “webgl.enabled_for_all_sites” to ‘true’. Hopefully beta 7 will ship with WebGL on by default.

UPDATE: excellent overview video by Mozilla engineer Vlad Vukićević:
WebGL: Bringing 3D to the Web – 2010 GPU Technology Conference

Introduction to WebGL: 3D on the web
BarCamp Bangkok 4 (2010), Sripatum University

Presenter

• Gen Kanai
• “The Cost of Monoculture” (Microsoft monopoly in Korea)

What is WebGL?

• Web platform API for accelerated 3D rendering
• OpenGL ES in JavaScript
• available in Firefox 4 beta, Chromium, Webkit nightly

History of WebGL

• early prototype by Vladimir Vukićević (Mozilla) in 2006
• March 2009 – Khronos Working Group: Mozilla, Google, Apple, Opera
• December 2009 – WebGL draft

Architecture

• Web browser: WebGL
• OS drivers: OpenGL, OpenGL ES, Direct3D
• Graphics Hardware

Mobile?

• Firefox on Android, Maemo/Meego
• Webkit? (Android?)

Applications of WebGL

• gaming
• visualization
• marketing
• other?

WebGL developer libraries

• WebGLU
• GLGE
• C3DL
• Copperlicht
• SpiderGL
• SceneJS
• Processing.js
• XB PointStream
• others?

Demos

• WebGL-Particles-Demo
• WebGL Walker
• ChemDoodle
• Shader Toy v0.2
• SpiderGL – Streaming LoD Terrain
• SpiderGL – HDR Texture
• many others

Thank you

• Vladimir Vukićević (Mozilla)
• WebGL community

References

• http://www.khronos.org/webgl/
• http://planet-webgl.org/
• http://learningwebgl.com/blog/
• https://developer.mozilla.org/en/WebGL

NOTE: this content is only available in Japanese.  (English JavaScript users have a LOT more resources to learn JavaScript than Japanese users…)

マンガで分かる JavaScriptプログラミング講座 (The manga guide to JavaScript Programming Course) is an online web manga (Japanese style comic) for novice programmers to study JavaScript programming language by themselves. In a story, three high-school students learn JavaScript from a teacher in a year. 4 Chapters, 23 sections, 153 pages this manga covers the basics of JavaScript, objects, array, regular expression, DOM, event handler, style sheet, cookies, jQuery, bookmarklet, WSH, HTA, etc.

Firefox Developers Conference 2009 – アドオンで Web の未来を切り開く！

The theme of this year’s developer conference is Add-ons, including Jetpack. The event is free but registration is required. Mozilla’s Aza Raskin and Chris Blizzard’s keynotes will be in English, but the rest of the presentations will be in Japanese.

If you would like to attend but do not read/write Japanese, please leave a comment here and I can help get you registered.  Hope to see you there!

UPDATE: for review, also take a look at the Firefox Developer Conference Summer 2007.

Ubiquity: Command the Web with Language 言葉で操作する Web from mitcho on Vimeo.

Slides here on SlideShare

Before most of popular browsers start to support canvas “3d” context, we JavaScript developers have struggled how to implement to enable 3D by JavaScript without any extensions like Java, Flash, etc. Here is a part of the history of JavaScript’s 3D tech development.

Kawasaki-san also covered Satoshi Ueyama‘s recent work on 3D in JS and Canvas back in February, if you had missed it: Incredible JavaScript+Canvas 3D demos from Japan!

Ueyama-san, the programmer who made those 3D demos, is the same programmer who did those Gecko reflow videos (Japanese) that were widely blogged about and discussed at Doug Turner’s blog: What is a reflow?

EDIT: Unfortunately those reflow videos are no longer available at Google Video (grrr). I’ll see if Ueyama-san can upload them to a different video hosting site.

EDIT 2: Gecko reflow videos have been moved to Youtube thanks to Ueyama-san!

Gecko Reflow Visualization – google.co.jp

Gecko Reflow Visualization – mozilla.org

Gecko Reflow Visualization – Wikipedia

If the future interviews in this new Tech Luminaries series are as good, it wll be a great podcast.

More info here: Canvas in full 3D

via Mona Nomura

More details at Brendan’s blog post.
UPDATE: Andreas Gal and Mike Shaver also share comments on TraceMonkey.

Today, I’ll be speaking about Firefox 3.1, the new TraceMonkey announcement, and will do a quick overview of the major Mozilla Labs efforts. Tomorrow I’ll speak about Fennec, Mozilla’s mobile project.

Hope to see you there!