WebGL

Web浏览器中opengl的JavaScript绑定

WebGL是一種JavaScript API,用於在不使用外掛程式的情況下在任何相容的網頁瀏覽器中呈現交互式2D和3D圖形[2]。WebGL完全整合到瀏覽器的所有網頁標準中,可將影像處理和效果的GPU加速使用方式當做網頁Canvas的一部分。WebGL元素可以加入其他HTML元素之中並與網頁或網頁背景的其他部分混合[3]。WebGL程序由JavaScript編寫的控制代碼和OpenGL Shading Language(GLSL)編寫的著色器代碼組成,該語言類似於CC++,並在電腦的圖形處理器(GPU)上執行。WebGL由非營利Khronos Group設計和維護[4]

WebGL
原作者Mozilla基金会
開發者WebGL Working Group
首次发布2011年3月3日 (2011-03-03)[1]
当前版本2.0(2017年1月17日 (2017-01-17)
操作系统跨平台
类型API
网站www.khronos.org/webgl/

設計

编辑

WebGL 1.0基于OpenGL ES 2.0,並提供了3D圖形的API[5]。它使用HTML5 Canvas并允许利用文档对象模型接口。WebGL 2.0基于OpenGL ES 3.0,確保了提供許多選擇性的WebGL 1.0擴充功能,並引入新的API[6]。可利用部分Javascript实现自动記憶體管理[4]

歷史

编辑

WebGL起源於Mozilla員工弗拉基米爾·弗基西維奇一項稱為Canvas 3D的實驗計畫。2006年,弗基西維奇首次展示了Canvas 3D的原型。2007年底在Firefox[7]和Opera[8]被實作。

在2009年初,非營利技術聯盟Khronos Group啟動了WebGL的工作組,最初的工作成員包括AppleGoogleMozillaOpera[4][9]。2011年3月發布WebGL 1.0規範[1]。截至2012年3月,工作組的主席由肯·羅素(Ken Russell,全名「Kenneth Bradley Russell」)擔任。

WebGL的早期應用包括Zygote Body[10][11]

WebGL 2規範的發展始於2013年,並於2017年1月完成[12]。該規範基於OpenGL ES 3.0[13]。首度實作在Firefox 51、Chrome 56和Opera 43中[14]

支援

编辑

目前,WebGL在最新的瀏覽器中被廣泛支援。然而,其可用性取決於其他因素,如GPU支援。WebGL官方網站提供了一個簡單的測試頁[15]。而第三方網站提供了更詳細的訊息(如瀏覽器使用的渲染器以及可用的擴展)[16][17]

桌面瀏覽器

编辑
  • Google Chrome – 從9.0開始支援預設啟用了 WebGL [18][19]。在Windows上,默認情況下,Chrome使用ANGLE渲染器將OpenGL ES轉換為Direct X 9.0c或11.0,後者具有更好的驅動程序支援[20]。在Linux和Mac OS X上,默認渲染器是OpenGL[21],也可以強制OpenGL作為Windows上的渲染器[20]。2013年9月起,Chrome還推出了更新的Direct3D 11渲染器,但需要更新的顯卡[22][23]。 Chrome 56+支援WebGL 2.0。
  • Internet Explorer – 从11开始支持[24]。Internet Explorer 11 最初未能通過大多數官方的WebGL一致性測試,但微軟後來發佈了幾個更新,最新的0.94 WebGL引擎目前通過了約97%的Khronos測試。較舊的版本可以安裝第三方外掛程式來支援,如IEWebGL[25]
  • Mozilla Firefox – 從4.0開始支援預設啟用[26]。Firefox也通過ANGLE在Windows平臺上使用DirectX。Firefox 51+ 支援 WebGL 2.0。
  • Safari – 在Mac OS X Snow Leopard上的Safari 5.1、OS X Mountain LionMac OS X Lion上的Safari6.0或較新版本開始支援WebGL,預設情況下禁用[27][28][29][30][31]。Safari版本12(在MacOS Mojave中可用)支援WebGL 2.0,目前作為"實驗性"功能。
  • Opera – 需自行啟用[32][33]。Opera 43+支援WebGL 2.0
  • Microsoft Edge – 對於Microsoft Edge Legacy,初始穩定版本支援WebGL版本0.95(context名稱:"experimental-webgl"),並帶有開源GLSL到HLSL轉譯器。 版本 10240+ 支援以 WebGL 1.0 為前綴。最新的基於Chromium的Edge支援WebGL 2.0

行動瀏覽器

编辑

参考文献

编辑
  1. ^ 1.0 1.1 Khronos Releases Final WebGL 1.0 Specification. [2015-05-18]. (原始内容存档于2016-11-08). 
  2. ^ Gregg Tavares. WebGL Fundamentals. HTML5 Rocks. 2012-02-09 [2015-12-27]. (原始内容存档于2022-02-08). 
  3. ^ Parisi, Tony. WebGL: Up and Running. O'Reilly Media, Incorporated. 2012-08-15 [2017-06-11]. (原始内容存档于2013-02-01). 
  4. ^ 4.0 4.1 4.2 WebGL - OpenGL ES 2.0 for the Web
  5. ^ WebGL Specification. Khronos.org. [2011-05-14]. (原始内容存档于2012-04-12). 
  6. ^ WebGL 2.0 Specification. Khronos.org. [2017-02-27]. (原始内容存档于2017-01-28). 
  7. ^ Canvas 3D: GL power, web-style. Blog.vlad1.com. [2011-05-14]. (原始内容存档于2011-07-17). 
  8. ^ Taking the canvas to another dimension. My.opera.com. 2007-11-26 [2011-05-14]. (原始内容存档于2007-11-17). 
  9. ^ Khronos Details WebGL Initiative to Bring Hardware-Accelerated 3D Graphics to the Internet. Khronos.org. 2009-08-04 [2011-05-14]. (原始内容存档于2012-04-12). 
  10. ^ Google Body – Google Labs. Bodybrowser.googlelabs.com. [2011-05-14]. (原始内容存档于2011-05-13). 
  11. ^ Bhanoo, Sindya N. New From Google: The Body Browser. Well.blogs.nytimes.com. 2010-12-23 [2011-05-14]. (原始内容存档于2015-02-06). 
  12. ^ WebGL 2 Specification. khronos.org. 2013-09-26 [2013-10-28]. (原始内容存档于2017-08-08). 
  13. ^ 存档副本. [2017-06-11]. (原始内容存档于2017-01-28). 
  14. ^ 存档副本. [2017-06-11]. (原始内容存档于2017-08-28). 
  15. ^ WebGL test page. webgl.org. [2015-12-27]. (原始内容存档于2015-04-18). 
  16. ^ WebGL Report. webglreport.com. [2017-06-11]. (原始内容存档于2015-05-28). 
  17. ^ WebGL Browser Report — WebGL Detection — WebGL Tester — BrowserLeaks. browserleaks.com. [2017-06-11]. (原始内容存档于2015-05-20). 
  18. ^ Paul Mah. Google releases Chrome 9; comes with Google Instant, WebGL – FierceCIO:TechWatch. FierceCIO. February 8, 2011 [2012-03-20]. (原始内容存档于2011-10-25). 
  19. ^ WebGL in Chrome Stable! - Learning WebGL. learningwebgl.com. [2015-12-27]. (原始内容存档于2015-05-28). 
  20. ^ 20.0 20.1 (WebGL) How to Enable Native OpenGL in your Browser (Windows) | Geeks3D. [2022-03-24]. (原始内容存档于2022-04-17) (美国英语). 
  21. ^ Introducing the ANGLE Project. Chromium Blog. [2022-03-24]. (原始内容存档于2022-04-22) (英语). 
  22. ^ WebGL around the net, 17 Oct 2013 | Learning WebGL. web.archive.org. 2014-08-08 [2022-03-24]. 原始内容存档于2014-08-08. 
  23. ^ Brandon Jones. At last! Chrome D3D11 day has come!. [2022-03-24]. (原始内容存档于2022-04-19) (英语). 
  24. ^ WebGL (Windows). 微软. [2014-03-05]. (原始内容存档于2015-03-24). 
  25. ^ IEWebGL. Iewebgl. [2014-08-14]. (原始内容存档于2022-02-08). 
  26. ^ Mozilla Firefox 4 Release Notes. Mozilla.com. 2011-03-22 [2012-03-20]. (原始内容存档于2011-03-23). 
  27. ^ New in OS X Lion: Safari 5.1 brings WebGL, Do Not Track and more. Fairerplatform.com. 2011-05-03 [2012-03-20]. (原始内容存档于2012-03-19). 
  28. ^ Enable WebGL in Safari. Ikriz.nl. 2011-08-23 [2012-03-20]. (原始内容存档于2012-03-04). 
  29. ^ Getting a WebGL Implementation. Khronos.org. 2012-01-13 [2012-03-20]. (原始内容存档于2015-05-28). 
  30. ^ Implementations/WebKit. Khronos.org. 2011-09-03 [2012-03-20]. (原始内容存档于2015-03-21). 
  31. ^ WebGL Now Available in WebKit Nightlies. Webkit.org. [2012-03-20]. (原始内容存档于2012-03-08). 
  32. ^ WebGL and Hardware Acceleration. My.opera.com. 2011-02-28 [2012-03-20]. (原始内容存档于2011-03-03). 
  33. ^ Introducing Opera 12 alpha. My.opera.com. 2011-10-13 [2012-03-20]. (原始内容存档于2011-10-15). 
  34. ^ 34.0 34.1 Mobile HTML5 compatibility on iPhone, Android, Windows Phone, BlackBerry, Firefox OS and other mobile devices. [2015-09-16]. (原始内容存档于2022-04-15). 
  35. ^ iclkevin. WebGL on Mobile Devices. iChemLabs. 2011-11-12 [2011-11-25]. (原始内容存档于2013-03-12). 
  36. ^ Kersey, Jason. Chrome Beta for Android Update. Chrome Releases Blog. Google. [2013-08-23]. (原始内容存档于2015-04-03). 
  37. ^ Opera Mobile 12. Opera Software. [27 February 2012]. (原始内容存档于2012年3月1日). 
  38. ^ HTML5test - How well does your browser support HTML5?. [2015-09-16]. (原始内容存档于2022-04-15). 
  39. ^ Cunningham, Andrew. iOS 8, Thoroughly Reviewed. Ars Technica. 2014-09-17 [2014-09-19]. (原始内容存档于2014-09-20). 

外部链接

编辑

參見

编辑