WebGL (Veb Grafik kutubxonasi) — plaginlardan foydalanmasdan har qanday veb-brauzerda interaktiv 2D va 3D grafiklarni koʻrsatish uchun JavaScript API.[2] WebGL boshqa veb-standartlar bilan toʻliq integratsiyalashgan boʻlib, fizika va tasvirni qayta ishlash va veb-sahifalar sifatida effektlardan GPU tomonidan tezlashtirilgan foydalanish imkonini beradi. WebGL elementlari boshqa HTML elementlari bilan aralashtirilishi va sahifaning boshqa qismlari yoki sahifa foni bilan birlashtirilishi mumkin.[3]

WebGL
Turi API, web API, dasturiy ta'minot va programmalash tili[1]
Qachon asos solingan 2011-yil 3-mart
Vebsayti https://www.khronos.org/webgl/
Til(lar)i Ingliz tili

WebGL dasturlari JavaScriptda yozilgan va C yoki C++ ga oʻxshash OpenGL ES Shading Language (GLSL ES) tilida yozilgan va kompyuterning grafik ishlov berish blokida (GPU) bajariladigan kodidan iborat. WebGL notijorat Khronos Group tomonidan ishlab chiqilgan va yuritiladi.

2022-yil 9-fevralda Khronos Group barcha asosiy brauzerlar uchun WebGL 2.0 foydalanishini eʼlon qildi.[4]

Dizayn

tahrir

WebGL 1.0 OpenGL ES 2.0 ga asoslangan va 3D grafika uchun API taqdim etadi. U HTML5 kanvas elementidan foydalanadi va unga Document Object Model (DOM) interfeyslari yordamida kirish mumkin.

WebGL 2.0 OpenGL ES 3.0 ga asoslangan va WebGL 1.0 ning ko‘plab kengaytmalari mavjudligini kafolatlaydi va yangi API’larni taqdim etadi. Avtomatik xotira boshqaruvi JavaScript tomonidan bilvosita taqdim etiladi.

OpenGL ES 2.0 kabi WebGL ham OpenGL 1.0 da kiritilgan va OpenGL 3.0 da eskirgan funksiyali API larga ega emas. Agar kerak boʻlsa, ushbu funksiya shader kodini taqdim etish va JavaScriptda maʼlumotlar ulanishlarini sozlash orqali oxirgi dasturchi tomonidan amalga oshirilishi kerak.

WebGLdagi shaderlar toʻgʻridan-toʻgʻri GLSLda ifodalanadi va WebGL APIga matnli satrlar sifatida uzatiladi. WebGL ilovasi ushbu shader koʻrsatmalarini GPU kodiga kompilyatsiya qiladi. Ushbu kod API orqali yuborilgan har bir tepalik uchun va ekranga rasterlangan har bir piksel uchun bajariladi.

Tarixi

tahrir

WebGL Mozillaʼda Vladimir Vukićević tomonidan boshlangan Canvas 3D tajribalaridan kelib chiqadi. Vukićević birinchi marta 2006-yilda Canvas 3D prototipini namoyish qilgan. 2007-yil oxiriga kelib, Mozilla[5] va Opera[6] ham oʻzlarining alohida dasturlarini yaratdilar.

2009-yil boshida Khronos Group notijorat texnologiya konsorsiumi Apple, Google, Mozilla, Opera va boshqalar ishtirokida WebGL ishchi guruhini boshladi. WebGL spetsifikatsiyasining 1.0 versiyasi 2011-yil mart oyida chiqarilgan. 2012-yil mart oyidan boshlab ishchi guruh rahbari Ken Rassell hisoblanadi.

WebGL ning dastlabki ilovalariga Zygote Body kiradi.[7][8] 2012-yil noyabr oyida Autodesk oʻz ilovalarining koʻpchiligini mahalliy WebGL mijozlarida ishlaydigan tizimga oʻtkazganligini eʼlon qildi. Bu dasturlarga Fusion 360 va AutoCAD 360 kiradi.[9] WebGL 2 spetsifikatsiyasini ishlab chiqish 2013-yilda boshlangan va 2017-yil yanvarida yakunlangan.[10] Ushbu spetsifikatsiya OpenGL ES 3.0 ga asoslangan.[11] Birinchi ilovalar Firefox 51, Chrome 56 va Opera 43 da mavjud edi.[12]

Amalga oshirish jarayoni

tahrir

Native Graphics Layer Engine

tahrir

Native Graphics Layer Engine (ANGLE) WebGL 1.0 (ES 3.0 ga chambarchas mos keladigan 2.0) va OpenGL ES 2.0 va 3.0 standartlarini amalga oshiradigan ochiq kodli grafik mexanizmidir. Bu Windows platformalarida Google Chrome va Mozilla Firefox uchun ishlatish imkonsiz boʻlib, WebGL va OpenGL chaqiruvlarini mavjud platformaga xos API’larga tarjima qilish orqali ishlaydi. ANGLE hozirda OpenGL ES 2.0 va 3.0 dan ish stoli OpenGL, OpenGL ES, Direct3D 9 va Direct3D 11 API lariga kirish imkonini beradi.[13] ″(Google) Chrome Windows tizimidagi barcha grafik tasvirlar, jumladan Canvas2D mukammallashtirilgan ilovasi va Native Client sinov muhiti uchun ANGLEdan foydalanadi.″[14]

Dasturiy taʼminot

tahrir

WebGL zamonaviy brauzerlar tomonidan keng qoʻllab-quvvatlanadi. Biroq, uning mavjudligi uni qoʻllab-quvvatlaydigan GPU kabi boshqa omillarga bogʻliq. Rasmiy WebGL veb-sayti oddiy test rejimini taqdim etadi.[15] Batafsil maʼlumot (masalan, brauzer qaysi render qiluvchi dasturdan foydalanishi va qanday kengaytmalar mavjudligi) uchinchi tomon veb-saytlarida taqdim etiladi.[16][17]

Ish stoli brauzerlari

tahrir
  • Google Chrome — WebGL 1.0 2011-yil fevral oyida chiqarilgan 9-versiyasidan boshlab yangilangan drayverlarga ega qobiliyatli grafik kartaga ega barcha platformalarda ishlaydi.[18][19] Windows tizimida sukut boʻyicha Chrome OpenGL ES ni drayverlarni yaxshiroq qoʻllab-quvvatlaydigan Direct X 9.0c yoki 11.0 ga tarjima qilish uchun ANGLE (Native Graphics Layer Engine) render qiluvchi dasturidan foydalanadi.[20] Linux va Mac OS X da standart render qiluvchi dastur OpenGL hisoblanadi.[21] Windowsda render sifatida OpenGLni majburlash ham mumkin.[20] 2013-yil sentabr oyidan boshlab Chrome yangiroq Direct3D 11 renderiga ega, ammo bu yangiroq grafik kartani talab qiladi.[22] Chrome 56+ WebGL 2.0 ni qo‘llab-quvvatlaydi.
  • Firefox — WebGL 1.0 4.0 versiyasidan boshlab yangilangan drayverlarda sifatli grafik kartaga ega barcha platformalarda yoqilgan.[23] 2013-yildan beri Firefox ham ANGLE orqali Windows platformasida DirectX dan foydalanadi.[20] Firefox 51+ WebGL 2.0 ni qoʻllab-quvvatlaydi.
  • Safari — Safari 6.0 va OS X Mountain Lion, Mac OS X Lion va Mac OS X Snow Leopard’dagi Safari 5.1 da o‘rnatilgan Safari 6.0 va undan keyingi versiyalari Safari 8.0 dan oldin o‘chirib qo‘yilgan (ishlatish imkonsiz) WebGL 1.0 ni qo‘llab-quvvatladi.[24][25][26][27][28] Safari 12-versiyasi (MacOS Mojaveda mavjud) hozirda „Eksperimental“ sifatida WebGL 2.0 uchun mavjud.
  • Opera — WebGL 1.0 2014-yilda oʻchirib qoʻyilgan boʻlsada, Opera 11 va 12-da joriy qilingan.[29][30] Opera 43+ WebGL 2.0 ni qoʻllab-quvvatlaydi.
  • Internet Explorer — WebGL 1.0 qisman Internet Explorer 11 da qoʻllab-quvvatlanadi.[31][32][33][34] Dastlab u rasmiy WebGL muvofiqlik testlarining aksariyatida muvaffaqiyatsizlikka uchradi, ammo Microsoft keyinchalik bir nechta yangilanishlarni chiqardi. Eng soʻnggi 0,94 WebGL mexanizmi hozirda Khronos sinovlarining ~97 % dan oʻtadi.[35] WebGLni qoʻllab-quvvatlash, shuningdek, IEWebGL kabi uchinchi tomon plaginlari yordamida Internet Explorerning oldingi versiyalariga qoʻlda qoʻshilishi mumkin.[36]
  • Microsoft Edge — Microsoft Edge Legacy uchun dastlabki barqaror versiya WebGL 0.95 versiyasini (kontekst nomi: „eksperimental-webgl“) ochiq manbali GLSL dan HLSL transpilyatoriga qo‘llab-quvvatlaydi.[37] 10240+ versiyasi WebGL 1.0 ni prefiks sifatida qoʻllab-quvvatlaydi. Eng soʻnggi Chromiumga asoslangan Edge WebGL 2.0ni qoʻllab-quvvatlaydi.

Mobil brauzerlar

tahrir
  • BlackBerry 10 — WebGL 1.0 BlackBerry qurilmalari uchun OS 10.00[38] versiyasidan beri mavjud.
  • BlackBerry PlayBook — WebGL 1.0 WebWorks va brauzer orqali PlayBook OS 2.00[39] da mavjud.
  • Android brauzeri — asosan qoʻllab-quvvatlanmaydi, ammo Sony Ericsson Xperia qator Android smartfonlari proshivka yangilanganidan keyin WebGL imkoniyatlariga ega boʻldi.[40] Samsung smartfonlarida WebGL ham yoqilgan (Galaxy SII (4.1.2) va Galaxy Note 8.0 (4.2) da tasdiqlangan). Koʻpgina telefonlarda Android brauzerini almashtirgan Google Chrome brauzerida qoʻllab-quvvatlanadi (lekin yangi standart Android brauzeri emas).
  • Internet Explorer — Prefiksli WebGL 1.0 Windows Phone 8.x (11+) da mavjud.
  • Mobil uchun Firefox — Firefox 4dan beri WebGL 1.0 Android va MeeGo qurilmalari uchun mavjud.[41][42]
  • Firefox OS[42]
  • Google Chrome[43]
  • Maemo — Nokia N900 da WebGL 1.0 PR1.2 mikrodastur yangilanishidan boshlab birja microB brauzerida mavjud.[44]
  • MeeGo — WebGL 1.0 „Web“ birja brauzerida qo‘llab-quvvatlanmaydi. Biroq, u Firefox orqali ishlaydi.[42]
  • Microsoft Edge — Prefiksli WebGL 1.0 Windows 10 Mobileda mavjud.[45]
  • Opera Mobile — Opera Mobile 12 WebGL 1.0 ni qoʻllab-quvvatlaydi (faqat Androidda).[46]
  • Sailfish OS — WebGL 1.0 standart Sailfish brauzerida qoʻllab-quvvatlanadi.[47]
  • Tizen — WebGL 1.0 qo‘llab-quvvatlanadi.[48]
  • iOS — WebGL 1.0 mobil Safari uchun iOS 8 da mavjud.[49]

Xususiyatlar va tizim

tahrir

Foydalanish

tahrir

Oʻz-oʻzidan kerakli 3D grafikalarni tezda ishlab chiqarishni taʼminlaydigan WebGL API ning past darajadagi turi odatda 3D grafikalarda narsalarni yaratish uchun foydalaniladigan toʻplamlarni yaratishga yordam berdi (masalan, shaderlar uchun koʻrish oʻzgarishlari, view frustum va boshqalar). Ommabop sanoat formatlarida sahna grafiklari va 3D obyektlarni yuklash kabi asosiy vazifalar qoʻshimcha funksiyalarni taʼminlash uchun kutubxonalar tomonidan (ularning baʼzilari boshqa tillardan JavaScriptga koʻchirilgan) mavhumlashtiriladi. Koʻpgina yuqori darajadagi xususiyatlarni taʼminlovchi kutubxonalarning toʻliq boʻlmagan roʻyxatiga A-Frame (VR), BabylonJS, PlayCanvas, three.js, OSG, JS va CopperLicht kiradi. X3D shuningdek, X3D va VRML kontentini WebGL da ishlaydigan qilish uchun X3DOM deb nomlangan loyihani yaratdi. 3D modeli HTML5 da <X3D> XML tegida va interaktiv skript JavaScript va DOM dan foydalanadi. BS Content Studio va InstantReality X3D eksportchisi X3Dni HTML formatida eksport qilishi va WebGL orqali ishlashi mumkin. 

Oʻyinlar

tahrir

Shuningdek, WebGL uchun 2D va 3D[50], jumladan Unreal Engine 4 va Unity uchun oʻyin mexanizmlari tez paydo boʻldi.[51] Stage3D /Flash asosidagi Away3D yuqori darajali kutubxonasi TypeScript orqali WebGL uchun portga ham ega.[52][53] Shaderlar uchun faqat vektor va matritsali matematik yordam dasturlarini taqdim etuvchi yengilroq yordamchi kutubxona bu sylvester.js.[54][55] U baʼzan glUtils.js deb nomlangan WebGL maxsus kengaytmasi bilan birgalikda ishlatiladi.[54][56]

Bundan tashqari, Cocos2d -x yoki Pixi.js kabi WebGL ustiga qurilgan baʼzi 2D kutubxonalar mavjud boʻlib, ular Flash dunyosida Stage3D orqali Starling Framework bilan sodir boʻlgan voqealarga oʻxshash harakatda ishlash sabablari tufayli shu tarzda amalga oshirilgan. WebGLga asoslangan 2D kutubxonalari WebGL mavjud boʻlmaganda HTML5ga qaytadi.

GPUga deyarli toʻgʻridan-toʻgʻri kirishni taʼminlash orqali renderlash muammosini bartaraf etish JavaScript dasturlarida ishlash cheklovlarini ham yuzaga keltirdi. Ulardan baʼzilari asm.js va WebAssembly tomonidan koʻrib chiqildi (xuddi shunday, CrossBridge kabi loyihalar tomonidan hal qilingan ActionScriptda Stage3Dning taʼsir koʻrsatish muammolari paydo boʻldi).

Kontent yaratish

tahrir

Boshqa har qanday grafik API kabi, WebGL sahnalari uchun kontent yaratish oddiy 3D kontent yaratish vositasidan foydalanishni va sahnani tomoshabin yoki yordamchi kutubxona tomonidan oʻqilishi mumkin boʻlgan formatga eksport qilishni talab qiladi. Buning uchun Blender, Autodesk Maya yoki SimLab Composer kabi ish stoli 3D mualliflik dasturidan foydalanish mumkin. Xususan, Blend4Web WebGL sahnasini toʻliq Blenderda yaratish va hatto mustaqil veb-sahifa sifatida ham bir marta bosish bilan brauzerga eksport qilish imkonini beradi.[57] CopperCube va WebGLga asoslangan Clara.io onlayn muharriri kabi WebGLga xos dasturlar ham mavjud. Sketchfab va Clara.io kabi onlayn platformalar foydalanuvchilarga oʻzlarining 3D modellarini toʻgʻridan-toʻgʻri yuklash va ularni joylashtirilgan WebGL koʻrish vositasi yordamida namoyish qilish imkonini beradi.

Atrof-muhitga asoslangan vositalar

tahrir

Bundan tashqari, Mozilla Foundation oʻzining Firefox brauzerida 27-versiyadan boshlab, vertex va fragment shaderlarini tahrirlash imkonini beruvchi oʻrnatilgan WebGL vositalarini joriy qildi.[58] Bir qator boshqa nosozliklarni tuzatish va profillash vositalari ham paydo boʻldi.[59]

Manbalar

tahrir
  1. (unspecified title)
  2. Tavares. „WebGL Fundamentals“. HTML5 Rocks (9-fevral 2012-yil).
  3. Parisi. „WebGL: Up and Running“. O'Reilly Media, Incorporated (15-avgust 2012-yil). 2013-yil 1-fevralda asl nusxadan arxivlangan. Qaraldi: 13-iyul 2012-yil.
  4. „WebGL 2.0 Achieves Pervasive Support from all Major Web Browsers“ (inglizcha). The Khronos Group (9-fevral 2022-yil). Qaraldi: 13-fevral 2022-yil.
  5. „Canvas 3D: GL power, web-style“. Blog.vlad1.com. 2011-yil 17-iyulda asl nusxadan arxivlangan. Qaraldi: 14-may 2011-yil.
  6. „Taking the canvas to another dimension“. My.opera.com (26-noyabr 2007-yil). 2007-yil 17-noyabrda asl nusxadan arxivlangan. Qaraldi: 14-may 2011-yil.
  7. „Google Body – Google Labs“. Bodybrowser.googlelabs.com. 2011-yil 13-mayda asl nusxadan arxivlangan. Qaraldi: 14-may 2011-yil.
  8. Bhanoo. „New From Google: The Body Browser“. Well.blogs.nytimes.com (23-dekabr 2010-yil). Qaraldi: 14-may 2011-yil.
  9. „AUTODESK FUSION 360: THE FUTURE OF CAD, PT. 1“. 3dcadworld.com. Qaraldi: 21-avgust 2013-yil.
  10. „WebGL 2 Specification“. khronos.org (26-sentabr 2013-yil). Qaraldi: 28-oktabr 2013-yil.
  11. „WebGL 2.0 Specification“.
  12. „WebGL - Web APIs“. MDN.
  13. „ANGLE - Almost Native Graphics Layer Engine“ (2019). Qaraldi: 21-iyun 2019-yil.
  14. „ANGLE - Almost Native Graphics Layer Engine“ (2019). Qaraldi: 21-iyun 2019-yil.
  15. „WebGL test page“. webgl.org.
  16. „WebGL Report“. webglreport.com.
  17. „WebGL Browser Report — WebGL Detection — WebGL Tester — BrowserLeaks“. browserleaks.com.
  18. Mah. „Google releases Chrome 9; comes with Google Instant, WebGL – FierceCIO:TechWatch“. FierceCIO (8-fevral 2011-yil). 25-oktabr 2011-yilda asl nusxadan arxivlangan. Qaraldi: 20-mart 2012-yil.
  19. „WebGL in Chrome Stable! - Learning WebGL“. learningwebgl.com. 2015-yil 28-mayda asl nusxadan arxivlangan. Qaraldi: 7-avgust 2014-yil.
  20. 20,0 20,1 20,2 „(WebGL) How to Enable Native OpenGL in your Browser (Windows)“. geeks3d.com.
  21. „Chromium Blog: Introducing the ANGLE Project“. Chromium Blog.
  22. „At last! Chrome D3D11 day has come!“. tojicode.com.
  23. „Mozilla Firefox 4 Release Notes“. Mozilla.com (22-mart 2011-yil). Qaraldi: 20-mart 2012-yil.
  24. „New in OS X Lion: Safari 5.1 brings WebGL, Do Not Track and more“. Fairerplatform.com (3-may 2011-yil). 2012-yil 19-martda asl nusxadan arxivlangan. Qaraldi: 20-mart 2012-yil.
  25. „Enable WebGL in Safari“. Ikriz.nl (23-avgust 2011-yil). 4-mart 2012-yilda asl nusxadan arxivlangan. Qaraldi: 20-mart 2012-yil.
  26. „Getting a WebGL Implementation“. Khronos.org (13-yanvar 2012-yil). Qaraldi: 20-mart 2012-yil.
  27. „Implementations/WebKit“. Khronos.org (2011-yil 3-sentyabr). Qaraldi: 20-mart 2012-yil.
  28. „WebGL Now Available in WebKit Nightlies“. Webkit.org. 2012-yil 8-martda asl nusxadan arxivlangan. Qaraldi: 20-mart 2012-yil.
  29. „WebGL and Hardware Acceleration“. My.opera.com (28-fevral 2011-yil). 2011-yil 3-martda asl nusxadan arxivlangan. Qaraldi: 20-mart 2012-yil.
  30. „Introducing Opera 12 alpha“. My.opera.com (13-oktabr 2011-yil). 2011-yil 15-oktyabrda asl nusxadan arxivlangan. Qaraldi: 20-mart 2012-yil.
  31. „WebGL (Windows)“. microsoft.com. Microsoft.
  32. „Internet Explorer 11 Preview guide for developers“. Microsoft (17-iyul 2013-yil). Qaraldi: 24-iyul 2013-yil.
  33. „WebGL“. Microsoft (2013-yil 17-iyul). Qaraldi: 24-iyul 2013-yil.
  34. „Internet Explorer 11 to support WebGL and MPEG Dash“. Engadget (26-iyun 2013-yil). Qaraldi: 26-iyun 2013-yil.
  35. „IE11 fails more than half tests in official WebGL conformance test suite“. Microsoft Connect.
  36. „IEWebGL“. Iewebgl. Qaraldi: 14-avgust 2014-yil.
  37. „GitHub - Microsoft Edge WebGL Implementation“. Microsoft (4-iyun 2016-yil). Qaraldi: 10-iyun 2016-yil.
  38. McDonough. „WebGL: 3D Gaming on the Web Arrives“. BerryReview. 13-aprel 2013-yilda asl nusxadan arxivlangan. Qaraldi: 9-aprel 2013-yil.
  39. Halevy. „PlayBook OS 2.0 Developer Beta Includes WebGL, Flash 11, & AIR 3.0“. BerryReview. Qaraldi: 15-noyabr 2011-yil.
  40. „Xperia™ phones first to support WebGL™ – Developer World“. blogs.sonyericsson.com. The Sony Ericsson Developer Program (29-noyabr 2011-yil). 2011-yil 3-dekabrda asl nusxadan arxivlangan. Qaraldi: 5-dekabr 2011-yil.
  41. „WebGL on Mobile Devices“. iChemLabs (12-noyabr 2011-yil). 27-yanvar 2013-yilda asl nusxadan arxivlangan. Qaraldi: 25-noyabr 2011-yil.
  42. 42,0 42,1 42,2 „Mobile HTML5 compatibility on iPhone, Android, Windows Phone, BlackBerry, Firefox OS and other mobile devices“. 2022-yil 15-aprelda asl nusxadan arxivlangan. Qaraldi: 16-sentabr 2015-yil.
  43. Kersey. „Chrome Beta for Android Update“. Chrome Releases Blog. Qaraldi: 23-avgust 2013-yil.
  44. Voipio. „WebGL on N900“. Suihkulokki.blogspot.com (7-iyun 2010-yil). Qaraldi: 14-may 2011-yil.
  45. „Dev guide: WebGL – Microsoft Edge Development“. Microsoft. 2016-yil 8-oktyabrda asl nusxadan arxivlangan. Qaraldi: 10-iyun 2016-yil.
  46. „Opera Mobile 12“. Opera Software. 2012-yil 1-martda asl nusxadan arxivlangan. Qaraldi: 27-fevral 2012-yil.
  47. „HTML5test – How well does your browser support HTML5?“. Qaraldi: 16-sentabr 2015-yil.
  48. „HTML5test – How well does your browser support HTML5?“. Qaraldi: 16-sentabr 2015-yil.
  49. Cunningham. „iOS 8, Thoroughly Reviewed“. Ars Technica (17-sentabr 2014-yil). Qaraldi: 19-sentabr 2014-yil.
  50. Parisi, Tony. Programming 3D Applications with HTML5 and WebGL: 3D Animation and Visualization for Web Pages. "O'Reilly Media, Inc.", 13 February 2014 — 364–366-bet. ISBN 978-1-4493-6395-6. 
  51. Barrett. „Tegra K1 Lands in Acer's Newest Chromebook“. anandtech.com.
  52. „WebGL around the net, 17 Oct 2013 - Learning WebGL“. learningwebgl.com. 2014-yil 8-avgustda asl nusxadan arxivlangan. Qaraldi: 5-avgust 2014-yil.
  53. „Blog > Away3D Typescript 4.1 Alpha > Away3D“. away3d.com. 8-avgust 2014-yilda asl nusxadan arxivlangan. Qaraldi: 5-avgust 2014-yil.
  54. 54,0 54,1 Boreskov, Alexey. Computer Graphics: From Pixels to Programmable Graphics Hardware. CRC Press, 2014 — 370-bet. ISBN 978-1-4398-6730-3. 
  55. Anyuru, Andreas. Professional WebGL Programming: Developing 3D Graphics for the Web. John Wiley & Sons, 2012 — 140-bet. ISBN 978-1-119-94059-3. 
  56. Fulton, Steve. HTML5 Canvas, 2nd, "O'Reilly Media, Inc.", 2013 — 624-bet. ISBN 978-1-4493-3588-5. 
  57. „Blend4Web Official Site - About“. Blend4Web.com. Qaraldi: 22-iyun 2015-yil.
  58. „Live editing WebGL shaders with Firefox Developer Tools“. Mozilla Hacks – the Web developer blog.
  59. „Real-Time Rendering · WebGL Debugging and Profiling Tools“. realtimerendering.com.