WebGL enables 3D graphics and hardware-accelerated rendering within web browsers without plugins. This allows for rich 3D graphics and gaming experiences to be developed for the web. There are many experiments underway with WebGL across areas like science visualization, graphics demos, and games. Over the next few years, best practices are expected to emerge from a variety of approaches, lowering barriers to entry while also pursuing high performance. WebGL has the potential to significantly expand the scope of web development.

1. 기술동향
2011.8.18
@erucipe
최승준

2. WEB 3D http://en.wikipedia.org/wiki/Web3D
3DMLW
Adobe Shockwave
Burster
Cult3D
Java 3D
JOGL
LWJGL
O3D
ShiVa
TurnTool
Unity
Virtools
VRML : the first ISO-standard format for 3D browsing
Viewpoint
Web3D Consortium
WebGL
WireFusion
X3D (extension of VRML)
AMF - Additive Manufacturing File Format

3. http://www.slideshare.net/victorporof/web3d-semantic-standards-webgl-hci
TILT를 만든 Victor Porof의 발표자료
1990

4. http://blog.vlad1.com/canvas-3d
CANVAS 3D
Vladimir Vukićević : http://en.wikipedia.org/wiki/Vladimir_Vukićević
1979
In 2007, he began work on an prototype OpenGL 3D context for
the <canvas> HTML element which he called Canvas 3D.[1] This work led to the
creation of a "Accelerated 3D on the Web" working group within the Khronos
Group in order to create a royalty free standard API for OpenGL and OpenGL ES 2.0
capabilities,[2] which produced the WebGL specification.

5. 2.0
OpenGL ES 2.0 was publicly released in March 2007,[2] eliminates most of the fixed-function
rendering pipeline in favor of a programmable one. Almost all rendering features of the
transform and lighting pipelines, such as the specification of materials and light parameters
formerly specified by the fixed-function API, are replaced by shaders written by the graphics
programmer. As a result, OpenGL ES 2.0 is not backward compatible with OpenGL ES 1.1.
OpenGL ES 2.0
• Supported by the iPad, iPhone 3GS or later, and iPod Touch 3rd generation and later
• Supported by the Android platform since Android 2.2[10]
• Supported by the Android platform NDK since Android 2.0[11]
• Supported by the BlackBerry PlayBook
• 3D Library of the Pandora console
• Chosen for WebGL: OpenGL for web browsers[12]
• Supported by some new Nokia mobile phones, such as the Maemo based Nokia N900[13] and the Symbian^3
based Nokia N8.
• Supported by various Samsung mobile phones, including the Galaxy S and Wave
• Supported for Palm webOS, using the Plug-in Development Kit[9]
• Supported by the Archos Internet tablets: Archos 70 IT, Archos 101 IT

6. FIXED FUNCTION PIPELINE
PROGRAMMABLE PIPELINE

7. WebGL impl
Desktop Browsers
Mozilla Firefox - WebGL has been enabled on all platforms that have a capable graphics card
with updated drivers since version 4.0.[4]
Google Chrome - WebGL has been enabled by default since version 9.[5]
Safari - Safari 5.1 has support for WebGL but is disabled by default.[6]
Opera - WebGL is not implemented in the latest Opera 11.50 release. However, a
development build of Opera 11.50 with WebGL support is available for Windows platforms. [7]
Internet Explorer - Microsoft has not announced any plans to officially support WebGL.
The Chrome Frame and IEWebGLplugins provide options to add support for WebGL to Internet
Explorer.
Mobile Browsers
Nokia N900 - WebGL is available in the PR1.2 firmware update.[8]

8. http://www.khronos.org/registry/webgl/specs/latest/

9. TILT & DOM
http://blog.mozilla.com/tilt/
https://github.com/victorporof/Tilt

10. The Making of RO.ME by Mr.doob @ Assembly Summer 2011
http://www.youtube.com/watch?v=D8mOtkuN864

11. LIBRARY
Mr. doob
http://mrdoob.com
http://www.youtube.com/user/r08028

12. GAME
3rd March, 2011 – Game Developers Conference, San Francisco – The Khronos™ Group today released
the final WebGL™ 1.0 specification to enable hardware-accelerated 3D graphics in HTML5 Web browsers
without the need for plug-ins. WebGL defines a JavaScript binding to OpenGL® ES 2.0 to allow rich 3D
graphics within a browser on any platform supporting the industry-standard OpenGL or OpenGL ES
graphics APIs
http://www.youtube.com/watch?v=rkwozILNf3E
GDC 2011: WebGL and HTML5 as Casual Game Development Vectors
Abstract
This IDC Insight considers the likely impact of a pair of software innovations, WebGL and HTML5, on casual PC and
portable/mobile game development in the 2012–2013 time frame. A summary of existing video game development
processes, and associated software providers, is included for contextual purposes.
Table of Contents
IDC Opinion
In This Insight
Situation Overview
Video Game Development Engines and Tools
Where Do WebGL and HTML5 Fit?
Future Outlook
WebGL and HTML5' s Likely Impact
http://www.amazon.com/GDC-2011-Casual-Development-Vectors/dp/B004WYYHEU

14. https://github.com/toji/webgl-ios-rage
http://blog.tojicode.com/2011/05/ios-rage-rendered-with-webgl.html
http://media.tojicode.com/md5Mesh
http://media.tojicode.com/q3touch
Brandon Jones
http://blog.tojicode.com/2011/08/frameworks-are-awesome-heres-why-i-dont.html
So, the final question: Why don't I use any of the frameworks available out there? I have nothing against them, I
promise, nor do I feel that I'm "above" the need for them. For me it comes down to two simple things: On the one
hand Some of my demos (Quake/Rage) are built specifically to eek out every last drop of performance I can get, to
really show what WebGL is capable of. Performance is the whole point of said demos, so it's worth it to be bare
bones. Secondly, I personally enjoy the challenge! I've been coding OpenGL for a while, and it's fun for me to see
how much I can optimize this scenario or that. But if I were to go back and do, say, my Spore or Hellknight demos
again? Yeah, I'd be jumping on three.js in a heartbeat.

15. DEMOSCENE culture
http://traction.untergrund.net/slamdown (firefox only)
http://js1k.com
http://demoseen.com/windowpane/magister.html
http://nooshu.com/the-developing-webgl-demoscene
이 문화에서 관심을 가진다는 의미는 여기에 리얼타임 그래픽스,오디오,최적화 관
련하여 재미있게 실험 해볼 것이 많이 있다는 증거

16. SCIENCE (edu) culture
http://web.chemdoodle.com
http://metamolecular.com/blog/2011/03/07/webgl-for-chemistry-part-1-introduction/

17. CG culture
http://madebyevan.com
http://fractal.io
http://www.pixelnerve.com/webgl/sss/sss_singlelight.html

18. Web Audio
http://chromium.googlecode.com/svn/trunk/samples/audio/index.html
https://dvcs.w3.org/hg/audio/raw-file/tip/webaudio/specification.html
https://wiki.mozilla.org/Audio_Data_API

19. GPGPU
WebCL
http://www.khronos.org/webcl
http://code.google.com/p/webcl
http://webcl.nokiaresearch.com
https://wiki.mozilla.org/Platform/GFX/WebCL
http://mchouza.wordpress.com/2011/02/21/gpgpu-with-webgl-solving-laplaces-equation/
http://gfx.parapluie.org/2011/webcl-in-firefox
http://www.nshatter.com/ CG분야에서 OpenCL이 활용되는 예시

20. Security issues
WebGL was shown to have fundamental security vulnerabilities in May 2011 enabling both denial
of service and cross scripting attacks

21. MOBILE issues
nokia, xperia
http://www.engadget.com/2009/12/03/no
kia-n900-impressively-demos-webgl-3d-
graphics/

22. 개발 진입문턱을 낮추는 하이레벨에서의 접근과 최적화와 퍼포먼스를 더 추구하는 로우레벨에
서의 접근의 양방향에서 다양한 실험들이 이루어지는 실험의 시대가 향후 몇 년 간 이어지고,
그 과정에서 몇몇 베스트 프랙티스들이 정착하리라 예상됨. OpenGL ES 2.0 으로 할 수 있는 일
들은 이미 그래픽스의 장르에서 90년대말 부터 2000년대의 처음 10년 동안 많은 베스트 프랙
티스들이 정립된 상황이기 때문에 WebGL을 매개로 로열티 프리의 안정적인 기술들이 손쉽고
빠르게 브라우져 기반 기술로 이전해올 조짐이 있음. 단, UX 문제는 별도. 3D는 3D에 적합한 사
용자 경험을 가능하게 하는 다른 부수적 기술들이 필요한데, 다양한 맞물린 이슈들이 있을 가능
성이 높음. 또한, 이는 웹을 더욱 확장하여 개발의 영역과 경계를 모호하게 하는 추세를 가속시
키며 크고 작은, 그리고 위험을 내포 하기도 한 다양한 실험의 시대의 문을 열고 있다고 봅니다.
문턱을 낮추는 시도인 VPL 접근 : http://vvvvjs.quasipartikel.at/
Developer issues
https://sites.google.com/a/chromium.org/dev/developers/design-
documents/rendering-architecture-diagrams
https://sites.google.com/a/chromium.org/dev/developers/design-
documents/gpu-accelerated-compositing-in-chrome
barriers, asset management, business logic etc

23. What is going on?
대실험 시대