WebGL — це стандарт на базіOpenGL ES 2.0, що дозволяє розробникам вебконтенту вбудовувати ввебоглядачі, які підтримуютьHTML5, повноцінну 3D-графіку, не вдаючись до посередництваплагінів. В намірах розробників поширити стандарт WebGL не тільки в браузерахперсональних комп'ютерів, а й у мобільних інтернет-пристроях. До робочої групи WebGL входятьKhronos Group, представники провідних розробників інтернет-браузерів, таких якApple Safari,Google Chrome,Mozilla Firefox іOpera, а також фахівціAMD іNvidia.
Ця технологія дозволяє упроваджувати апаратно-прискорену 3D графіку у вебсторінки без необхідності використовувати спеціальніплагіни веббраузера на будь-якій платформі, що підтримуєOpenGL абоOpenGL ES. Технічно це буде прив'язкою скриптівJavaScript до функцій, визначених в бібліотеках OpenGL ES 2.0, реалізовану на рівні браузера.
WebGL є подальшим розвитком експерименту Canvas 3D[2] вMozilla і вже представлена у збірках розробників Mozilla Firefox[3] іWebKit[4], а також в попередніх релізахGoogle Chrome 4[5].
В листопаді 2009 компанія Khronos Group анонсувала першу чорнову специфікацію WebGL.[6] Робота над специфікацією продовжується.
Про підтримку специфікації у своєму браузеріChrome, починаючи з версії 9[7], оголосивGoogle. Підтримку WebGL у ближчих версіях продуктів оголосилиMozilla (починаючи зFirefox 4) таApple Safari.
WebGL створений на основіOpenGL ES 2.0 з підтримкоюAPI для 3D-графіки. Він використовує елементcanvas зHTML5, а також взаємодіє зDOM. Автоматичне управління пам'яттю відбувається завдяки мові JavaScript. Шейдери у WebGL запрограмовані безпосередньо наGLSL.
WebGL виник в результаті експериментів з Canvas 3DВладимира Вукичевича[en] зMozilla, котрий розробив прототип Canvas 3D у 2006 році. В кінці 2007 року і Mozilla[8], і Opera[9] розробили свої окремі реалізації.
На початку 2009 року некомерційне об'єднання Khronos організувало робочу групу WebGL, за участі Apple, Google, Mozilla, Opera та ін. Версія WebGL 1.0 була випущена у березні 2011 року. Станом на березень 2012 року робочою групою керував Кен Рассел(Ken Russell).
Перші випуски WebGL включалиZygote Body.[10][11] Останнім часом, Autodesk реалізував за допомогоюхмарних рішень більшу частину своїх програм, які працюють завдяки WebGL. Наприклад такі програми як: Fusion 360 і AutoCAD 360.[12]
Розробка WebGL 2 розпочалася у 2013 році.[13] Ця специфікація мала за основу OpenGL ES 3.0.
WebGL широко підтримується у сучасних браузерах. Хоча можливість його використання залежить від інших факторів, а саме відGPU. Офіційний сайт WebGL пропонує просту тестову сторінку для перевірки на сумісність.[14][14] Більш детальна інформація (наприклад, те, який рендер використовує браузер, чи які розширення доступні) надається на сторонніх вебсайтах[15][16]. Робота WebGL у різноманітних браузерах:
Google Chrome — WebGL доступний для всіх платформ, котрі мають необхідну графічну карту з оновленими драйверами, починаючи з 9 версії, випущеної у 2011 році.[17][18] За замовченням у Windows Chrome використовуєANGLEрендер для перекладу з OpenGL ES уDirectX 9.0c або 11.0, котрий має більш якісну підтримку драйверів.[19] На Linux та Mac OS X за замовченням засобом візуалізації є OpenGL. Також можливо змусити Windows використовувати OpenGL як рендер. Починаючи з вересня 2013 року, Chrome також має новішийDirect3D 10 рендер, котрий, однак потребує більш нову графічну карту.
Mozilla Firefox — WebGL доступний для всіх платформ, котрі мають необхідну графічну карту з оновленими драйверами, починаючи з версії 4.0.[20] Починаючи з 2013 року, Firefox також використовує ANGLE на платформі Windows за допомоги DirectX.
Opera — WebGL реалізований у Opera 11 та 12, хоча вимкнений за замовчуванням.[26][27]
Internet Explorer — WebGL частково підтримується уInternet Explorer 11. Спершу він не витримував жодного тесту на сумісність від WebGL, пізніше Microsoft випустив декілька оновлень. Остання версія 0.94 WebGL на даний момент проходить близько ~97% тестів від Khronos. Підтримка WebGL також може бути підключена вручну до попередніх версій Internet Explorer, використовуючи сторонні плагіни, такі як IEWebGL наприклад.[28][29][30][31]
Microsoft Edge – З моменту випуску підтримував WebGL версії 0.95 (контекстне ім'я: "experimental-webgl") з вільними вихідними кодами GLSL доHLSLtranspiler.[32] Версії 10240+ підтримують WebGL 1.0 згідно специфікації. Версія WebGL 2.0 запланована і має середній пріоритет важливості щодо імплементації в майбутніх релізах.[33]
BlackBerry 10 — WebGL доступний для пристроїв BlackBerry, починаючи з 10.00 версіїОП.[34]
BlackBerry PlayBook — WebGL доступний за допомоги WebWorks і браузера у PlayBook OS 2.00.[35]
Android Browser — Взагалі то не підтримується, але ряд Android смартфонів, наприклад: Sony Ericsson Xperia підтримує можливість WebGL завдяки вбудованим можливостям. Смартфони Samsung також мають підтримку WebGL (перевірено на Galaxy SII (4.1.2) і Galaxy Note 8.0 (4.2)).[36] Підтримується у Google Chrome браузері, що заміщає у багатьох телефонах вбудований браузер Android.
Використання WebGL API може дуже стомлювати якщо не використовувати деякі корисні бібліотеки наприклад створені для легкої роботи з шейдерами, чи для завантаженняграфічних сцен та 3D об'єктів у популярних на сьогодення форматах. JavaScript бібліотеки вбудовані (абопортовані у WebGL) забезпечують додатковими функціональними можливостями. Неповний перелік бібліотек, які надають багато високотехнічних можливостей:three.js,O3D,OSG.JS[en],CopperLicht[en] іGLGE[en]. Також розвиваються [Гральний рушій|ігрові рушії] на WebGL,[41] включаючиUnreal Engine 4 і 5.Stage3D[en] /Flash-basedAway3D[en] — бібліотека високого рівня, також має порт на WebGL реалізований наTypeScript.[42][43] Існують і простіші бібліотеки, котрі надають тільки векторні та матричні математичні можливості для шейдерів — sylvester.js. Іноді вона використовується в поєднанні з розширенням WebGL — glUtils.js.[44]
Є також деякі 2D бібліотеки, побудовані на основі WebGL, такі якCocos2d-х або Pixi.js, які були реалізовані для підвищення продуктивності (так само, як Starling Framework відносно Stage3D у світі Flash). Коли WebGL не доступний, вирішення задач 2D бібліотек перекладається наHTML5 canvas.[45]
Видалення помилок рендерингу через надання майже повного доступу до GPU обмежує продуктивність реалізацій JavaScript. Деякі з них були переадресовані наasm.js[en]. (Точно так само, як впровадження Stage3D відкрило проблеми продуктивності в межахActionScript, які були розглянуті в рамках проектів, таких якCrossBridge[en]).[45]
Створення контенту для WebGL сцен часто означає, використання стандартних 3D інструментів для створення та експорту сцен, відтворення їх у відповідних форматах для зовнішніх програм. Наприклад у авторському програмному забезпеченні для 3D, такому якBlender абоAutodesk Maya. Але існує також деяке специфічне WebGL забезпечення, наприклад онлайн редакторClara.io[en] на основі WebGL. Онлайн платформи, такі якSketchfab[en] іClara.io[en] дозволяють користувачам безпосередньо завантажувати свої 3D моделі і зображати їх за допомогою вбудованого WebGL переглядача.
Крім того, Mozilla Firefox реалізувала інструменти з вбудованим WebGL, починаючи з версії 27, котрі дозволяють редагування vertex і фрагменти шейдерів.[46] З'явився також ряд інших інструментів задля налагодження й профілювання проектів.[47]
X3D також виконали проект під назвою X3DOM для створення X3D іVRML контенту, що працює на WebGL. 3D модель розташовують між XML тегами <X3D> у HTML5, а інтерактивний скрипт використовує JavaScript і DOM для відображення. BS Content Studio разом з InstantReality X3D експортером може експортувати X3D у HTML і опрацювати його на WebGL.
Прошарок Java OpenGL дуже схожий на WebGL у світі Java, в той час як Stage3D є еквівалентом Adobe Flash Player 11 і пізніших версій. Google Native Client також підтримує OpenGL ES 2.0.
↑Архівована копія. Архіворигіналу за 20 лютого 2011. Процитовано 6 лютого 2011.{{cite web}}: Обслуговування CS1: Сторінки з текстом «archived copy» як значення параметру title (посилання)
↑Архівована копія. Архіворигіналу за 20 травня 2015. Процитовано 28 травня 2015.{{cite web}}: Обслуговування CS1: Сторінки з текстом «archived copy» як значення параметру title (посилання)
↑Архівована копія. Архіворигіналу за 28 травня 2015. Процитовано 28 травня 2015.{{cite web}}: Обслуговування CS1: Сторінки з текстом «archived copy» як значення параметру title (посилання)
↑Архівована копія. Архіворигіналу за 28 травня 2015. Процитовано 28 травня 2015.{{cite web}}: Обслуговування CS1: Сторінки з текстом «archived copy» як значення параметру title (посилання)
↑Архівована копія. Архіворигіналу за 10 серпня 2014. Процитовано 28 травня 2015.{{cite web}}: Обслуговування CS1: Сторінки з текстом «archived copy» як значення параметру title (посилання)
↑Архівована копія. Архіворигіналу за 11 квітня 2015. Процитовано 28 травня 2015.{{cite web}}: Обслуговування CS1: Сторінки з текстом «archived copy» як значення параметру title (посилання)
↑Архівована копія. Архіворигіналу за 8 серпня 2014. Процитовано 28 травня 2015.{{cite web}}: Обслуговування CS1: Сторінки з текстом «archived copy» як значення параметру title (посилання)
↑Steve Fulton; Jeff Fulton (2013).HTML5 Canvas (вид. 2nd). "O'Reilly Media, Inc.". с. 624.ISBN978-1-4493-3588-5. Архіворигіналу за 17 березня 2015. Процитовано 28 травня 2015.
↑абАрхівована копія. Архіворигіналу за 23 грудня 2019. Процитовано 28 травня 2015.{{cite web}}: Обслуговування CS1: Сторінки з текстом «archived copy» як значення параметру title (посилання)
↑Архівована копія. Архіворигіналу за 28 травня 2015. Процитовано 28 травня 2015.{{cite web}}: Обслуговування CS1: Сторінки з текстом «archived copy» як значення параметру title (посилання)
↑Архівована копія. Архіворигіналу за 28 травня 2015. Процитовано 28 травня 2015.{{cite web}}: Обслуговування CS1: Сторінки з текстом «archived copy» як значення параметру title (посилання)
