Web gl: WebGL — Интерфейсы веб API

Основы WebGL

English Français 日本語 한국어 Polski Portuguese Русский 简体中文

Изучение WebGL с нуля. Не прибегая к магии.

Здесь представлены статьи, которые помогут освоить WebGL, начиная с базовых понятий. Это НЕ изложение устаревшего материала OpenGL другими словами, что часто можно встретить в сети. Здесь собраны абсолютно новые статьи, без устаревших идей, и они помогут вам полностью разобраться, чем на самом деле является WebGL и как он работает.

Если вам интересен WebGL2, посмотрите на webgl2fundamentals.org

• Основы
• Основы WebGL
• Как работает WebGL
• Шейдеры и GLSL в WebGL
• WebGL State Diagram
• Обработка изображений
• Обработка изображений в WebGL
• Продолжаем обработку изображений в WebGL
• Математика переноса, поворота и масштабирования в 2D
• 2D-перенос в WebGL
• 2D-поворот в WebGL
• 2D-масштабирование в WebGL
• 2D-матрицы в WebGL
• 3D
• WebGL 3D — Ортогональ
• WebGL 3D — Перспектива
• WebGL 3D — Камеры
• Освещение
• WebGL 3D — Направленное освещение
• WebGL 3D — Точечное освещение
• WebGL 3D — Прожектор
• Структура и устройство
• WebGL — Меньше кода, больше веселья
• WebGL — Отрисовка нескольких объектов
• WebGL — Графы сцены
• Геометрия
• WebGL 3D — Создание модели
• Loading . obj files
• Loading .obj w .mtl files
• Текстуры
• WebGL 3D — Текстуры
• WebGL — Данные для текстур
• WebGL — Использование 2 и более текстур
• WebGL — Кросс-доменные изображения
• WebGL 3D — Перспективная коррекция текстур
• Planar and Perspective Projection Mapping
• Рендеринг в текстуру
• WebGL — Рендеринг в текстуру
• Shadows
• Shadows
• Приёмы
• 2D
• WebGL 2D — DrawImage
• WebGL 2D — Стек матриц
• Sprites
• 3D
• Cubemaps
• Environment maps
• Skyboxes
• Skinning
• Fog
• Picking (clicking on stuff)
• Текст
• WebGL текст — HTML
• WebGL текст — Canvas 2D
• WebGL текст — Используем текстуру
• WebGL текст — Используем глиф-текстуру
• Текстуры
• Ramp Textures (Toon Shading)
• GPGPU
• GPGPU
• Tips
• Smallest Programs
• Drawing Without Data
• Shadertoy
• Pulling Vertices
• Optimization
• Indexed Vertices (gl. drawElements)
• Instanced Drawing
• Разное
• WebGL Установка и настройка
• Шаблон WebGL
• Изменение размера Canvas в WebGL
• WebGL — Анимация
• Points, Lines, and Triangles
• Multiple Views, Multiple Canvases
• Visualizing the Camera
• WebGL и прозрачность
• WebGL — 2D и 3D библиотеки
• WebGL — Антипаттерны
• WebGL Matrices vs Math Matrices
• Precision Issues
• Taking a screenshot
• Prevent the Canvas Being Cleared
• Get Keyboard Input From a Canvas
• Use WebGL as Background in HTML
• Cross Platform Issues
• Questions and Answers
• Reference
• Attributes
• Texture Units
• Framebuffers
• readPixels
• References

• Документация по вспомогательным функциям
• TWGL, лёгкая библиотека-помощник для WebGL
• github

WebGL | это.

.. Что такое WebGL?

HTML

HTML и HTML5 Динамический HTML XHTML XHTML Mobile Profile и CHTML Canvas Кодировки символов Document Object Model Семейство шрифтов Редактор HTML Элементы HTML Мнемоники в HTML Фреймы HTML HTML5 audio и HTML5 video Скрипты в HTML Браузерный движок Quirks mode Таблицы стилей Каскадные таблицы стилей Unicode и HTML W3C и WHATWG Цвета HTML Web Storage WebGL Сравнение языков разметки документов браузеров браузерных движков для HTML HTML5 HTML5 Canvas HTML5 Media XHTML (1.1)

WebGL^[2] (Web-based Graphics Library) — это библиотека для программного обеспечения, которая расширяет возможности языка программирования JavaScript, позволяя ему создавать интерактивную 3D графику внутри любого совместимого с ней веб-браузера. Код на WebGL выполняется с помощью видеокарты.

WebGL — это контекст элемента canvas HTML, который обеспечивает API 3D графику без использования плагинов.^[3] Спецификация версии 1.0 была выпущена 3 марта 2011 года.^[4] Некоммерческая Khronos Group управляет работой WebGL.

Содержание 1 Дизайн 2 Реализация 2.1 Компьютерные браузеры 2.2 Мобильные браузеры 3 Рабочая группа 4 История 5 Электронные учебные пособия 6 Безопасность 7 Библиотеки 8 См. также 9 Примечания 10 Ссылки

Дизайн

WebGL построена на основе OpenGL ES 2.0 и обеспечивает API для 3D графики.^[5] Она использует элемент HTML5 canvas, также ей доступен интерфейс Document Object Model. Автоматическое управление памятью предоставляется языком JavaScript.^[3]

Реализация

Компьютерные браузеры

• Mozilla Firefox — WebGL был включен во все платформы, у которых есть нужная графическая карта с обновленными драйверами, начиная с версии 4. 0.^[6]
• Google Chrome — WebGL включен по умолчанию во все версии начиная с 9.^[7]
• Safari — Safari поддерживает WebGL, но поддержка отключена по умолчанию.^[8]
• Opera — WebGL реализован в последней версии Opera 12.00
• Internet Explorer — Microsoft не заявляла об официальной поддержке WebGL. Плагины Chrome Frame и IEWebGL предусматривают опции, необходимые для поддержки WebGL в Internet Explorer.
• Maemo 5 — официально функционирует в стандартном браузере Maemo 5 с выходом Maemo 5 PR1.2 в мае 2011 года.

Мобильные браузеры

Nokia N900 — WebGL доступен в обновленном встроенном ПО PR 1.2.^[9] Mag200 — WebGL доступен в прошивке 0.2.12.

Рабочая группа

В состав рабочей группы, разрабатывающей стандарт, входят: Khronos Group, разработчики браузеров Apple Safari, Google Chrome, Mozilla Firefox и Opera, а также специалисты AMD и Nvidia^[10].

История

WebGL возник из экспериментов над Canvas 3D, которые устраивал Vladimir Vukićević из Mozilla. Vladimir Vukićević впервые продемонстрировал прототип Canvas 3D в 2006 году. В конце 2007 года и Mozilla^[11], и Opera^[12] создали свои собственные отдельные реализации.

В начале 2009 года Mozilla и Khronos организовали рабочую группу WebGL.^[13]10 декабря 2009 года консорциум опубликовал первую черновую спецификацию WebGL^[10][14]. Председатель группы Арун Ранганатан, заявил, что завершение работы над спецификацией ожидается в первом квартале 2010 года^[10][14]. Окончательная ревизия первой редакции спецификаций была представлена 3 марта 2011 года в Сан-Франциско^[1][15][16]. Было показано в мае 2011, что в WebGL имеются существенные слабые места в безопасности, такие как отказ в обслуживании и разрешение скриптовых атак.^[17]

Электронные учебные пособия

Для изучения WebGL можно воспользоваться такими учебными пособиями, как Mozilla Developer Network и Learning WebGL (eng) (русский перевод).

Безопасность

В мае 2011 года служба безопасности Context Information Security опубликовала отчет, который детально разбирает несколько проблем с безопасностью в текущих реализациях WebGL от Google Chrome и Mozilla Firefox, и вообще в самой спецификации WebGL как таковой. Согласно отчету, WebGL позволяет полным по Тьюрингу программам, появившимся на компьютере из Интернета, добраться до привилегированного режима графических драйверов и оборудования. Отчет также снабжен ссылками на примеры действий, создающих проблемы с безопасностью; эти действия способны вызывать отказ от обслуживания и воровство меж-доменных изображений. Отчет завершается тем, что «браузеры, в которых WebGL встроен и включен по умолчанию, подвергают пользователя риску, созданному благодаря данным проблемам.»^[18]

Позже United States Computer Emergency Readiness Team (US-CERT) опубликовала предупреждение о том, что «WebGL содержит множество существенных проблем с безопасностью. Влияние этих проблем включает в себя произвольное выполнение кода, отказ от обслуживания и меж-доменные атаки. » US-CERT также призывал «пользователей и администраторов просмотреть отчет Context и отключать WebGL, чтобы постараться уменьшить риск».^[19]

Группа Khronos, которая включает в себя Mozilla и Google Chrome, ответила на беспокойства, предлагая возможные решения и будущие методы разработки.^[20] После просмотра отчета Context Mozilla решила убрать поддержку меж-доменных изображений в Firefox; в это время группа Khronos обновила спецификацию WebGL, чтобы улучшить защиту от отказа от обслуживания и атак на открытые ресурсы.^[21] В настоящее время предложенные решения все еще находятся на стадии разработки и не распространены повсеместно производителями GPU.^[22]

Context была не довольна решением группы Khronos сделать шаг, зафиксировав WebGL, и решила, что это решение не эффективно по отношению к поставленным проблемам.^[23] В последующей статье Context снабжает читателей еще большим количеством примеров уязвимости системы безопасности в последних реализациях WebGL на различных платформах. Признаки этих проблем стоят в ряду неисправностей начиная с разрушения системы и заканчивая утечкой информации. Context продолжает задавать вопрос, была ли WebGL специфицирована, разработана и реализована с учетом службы безопасности.^[21]

В июне 2011 года Microsoft заявил, что они не могут одобрить WebGL в его текущей форме с точки зрения безопасности. Исследование, проведенное командой инженеров MSRC, привело к заключению, что поддержка WebGL в продуктах Microsoft имела бы трудности с исполнением требований Security Development Lifecycle — стандарты безопасности для программного обеспечения, принятые внутри Microsoft. Microsoft ссылается на чрезмерно позволенную незащищенность функциональности оборудования и непроверенные возможности защиты от отказа от обслуживания, как на их ключевые проблемы.^[24]

Apple показали, что они не откроют доступ WebGL в основные страницы Интернета на iOS5. WebGL будет доступен только через iAds, который должен быть утвержден для каждой реализации Apple. ^[25]

Известные независимые эксперты по безопасности и графике (в частности Джон Кармак^[26] и Дэн Каминский^[27]) утверждают, что WebGL — это серьёзный риск для безопасности и будет тяжело это изменить.

Вице-президент по техническим стратегиям Mozilla Марк Шавер забраковал критику Microsoft. В посте своего блога он написал, что Mozilla работала над проблемами с адресацией в спецификации WebGL и реализации для Firefox. Он подчеркнул, что веб нуждался в 3D возможностях, и заявил, что проблемы с безопасностью присущи новым технологиям. Он рекомендовал работу Microsoft над Direct3D API, используемый в Silverlight 5, которую он оценил как надежную, но добавил, что та же технология могла бы быть перенесена со стороны Microsoft и на реализацию WebGL.^[28]

Библиотеки

Для разработки WebGL используется несколько библиотек. Библиотека WebGLU была первой, которая была сделана общедоступной.^[29] Другие библиотеки, объединенные в WebGL, включают в себя GLGE, C3DL, Copperlicht, SpiderGL, gwt-g3d — G3D (обертка WebGL) для GWT (Google Web Toolkit), SceneJS, X3DOM, Processing. js, Three.js, Turbulenz, OSGJS, XB PointStream и CubicVR.js.

ANGLE (Almost Native Graphics Layer Engine) — это текущий общедоступный проект, выпущенный под лицензией BSD, которая позволяет переводить содержимое WebGL в OpenGL ES 2.0, вызывать API DirectX 9, которые взаимодействуют с платформами Microsoft Windows без необходимости в дополнительных драйверах OpenGL.

См. также

• O3D
• GLSL
• VRML
• X3D
• Java OpenGL

Примечания

1. ↑ ^{1 2} Khronos Releases Final WebGL 1.0 Specification  (англ.). Khronos (3 марта 2011). Архивировано из первоисточника 12 апреля 2012. Проверено 4 марта 2011.
2. ↑ Khronos Details WebGL Initiative to Bring Hardware-Accelerated 3D Graphics to the Internet
3. ↑ ^{1 2} WebGL — OpenGL ES 2.0 for the Web. Khronos.org. Архивировано из первоисточника 12 апреля 2012. Проверено 14 мая 2011.
4. ↑ Khronos Releases Final WebGL 1.0 Specification. Архивировано из первоисточника 12 апреля 2012. Проверено 3 марта 2011.
5. ↑ WebGL Specification. Khronos.org. Архивировано из первоисточника 12 апреля 2012. Проверено 14 мая 2011.
6. ↑ Mozilla Firefox 4 Release Notes
7. ↑ Google releases Chrome 9; comes with Google Instant, WebGL — FierceCIO:TechWatch
8. ↑ New in OS X Lion: Safari 5.1 brings WebGL, Do Not Track and more | FairerPlatform
9. ↑ suihkulokki WebGL on N900. Suihkulokki.blogspot.com (7 июня 2010). Архивировано из первоисточника 12 апреля 2012. Проверено 14 мая 2011.
10. ↑ ^{1 2 3} Khronos опубликовала черновой вариант WebGL // Lenta.ru, 11.12.2009
11. ↑ Canvas 3D: GL power, web-style. Blog.vlad1.com. Архивировано из первоисточника 12 апреля 2012. Проверено 14 мая 2011.
12. ↑ Taking the canvas to another dimension. My.opera.com (26 ноября 2007). Архивировано из первоисточника 12 апреля 2012.
    Проверено 14 мая 2011.
13. ↑ Khronos Details WebGL Initiative to Bring Hardware-Accelerated 3D Graphics to the Internet. Khronos.org (4 августа 2009). Архивировано из первоисточника 12 апреля 2012. Проверено 14 мая 2011.
14. ↑ ^{1 2} WebGL 3D web standard reaches draft stages // Techradar
15. ↑ Kurt Bakke WebCL To Enable GPU-Accelerated Web Apps  (англ.). ConceivablyTech (3 марта 2011). Архивировано из первоисточника 12 апреля 2012. Проверено 4 марта 2011.
16. ↑ Accent Khronos публикует спецификации WebGL 1.0 — ускорение 3D-графики для web-страниц без подключаемых модулей  (рус. ). iXBT.com (3 марта 2011). Архивировано из первоисточника 12 апреля 2012. Проверено 4 марта 2011.
17. ↑ Context. Contextis.co.uk (9 мая 2011). Архивировано из первоисточника 12 апреля 2012. Проверено 14 мая 2011.
18. ↑ Forshaw, James WebGL — A New Dimension for Browser Exploitation. Context Information Security (8 мая 2011). Архивировано из первоисточника 12 апреля 2012. Проверено 11 мая 2011.
19. ↑ WebGL Security Risks. US-CERT (10 мая 2011). Архивировано из первоисточника 12 апреля 2012. Проверено 11 мая 2011.
20. ↑ WebGL — Security. Khronos Group (17 июня 2011). Архивировано из первоисточника 12 апреля 2012. Проверено 19 июня 2011.
21. ↑ ^{1 2} WebGL – More WebGL Security Flaws. Context Information Security (16 июня 2011). Архивировано из первоисточника 12 апреля 2012. Проверено 16 июня 2011.
22. ↑ WebGL Security. Khronos Group (9 мая 2011). Архивировано из первоисточника 12 апреля 2012. Проверено 11 мая 2011.
23. ↑ Context WEbGL security FAQ. Context Information Security. Архивировано из первоисточника 12 апреля 2012. Проверено 16 мая 2011.
24. ↑ WebGL Considered Harmful. Microsoft (16 июня 2011). Архивировано из первоисточника 12 апреля 2012. Проверено 16 июня 2011.
25. ↑ Microsoft, Apple Dis WebGL. InformationWeek (16 июня 2011). Архивировано из первоисточника 12 апреля 2012. Проверено 20 июня 2011.
26. ↑ Carmack, John Tweet (17 июня 2011). Архивировано из первоисточника 21 февраля 2012. Проверено 20 июня 2011.
27. ↑ Kaminsky, Dan Tweet (16 июня 2011). Архивировано из первоисточника 21 февраля 2012. Проверено 20 июня 2011.
28. ↑ Mozilla rejects Microsoft criticism of WebGL. The Inquirer (20 июня 2011). Архивировано из первоисточника 12 апреля 2012. Проверено 29 июня 2011.
29. ↑ Benjamin DeLillo First WebGLU release. Bjartr.blogspot.com (2 октября 2009). Архивировано из первоисточника 12 апреля 2012. Проверено 14 мая 2011.

Ссылки

• Официальный сайт (англ.).
• The Khronos Group: Open Standards, Royalty Free, Dynamic Media Technologies (англ.).
• Спецификация WebGL (англ.) (В настоящее время, черновик от 08 августа 2011 года).
• Preview of WebGL (англ.) на YouTube.
• WebGL interactive models (англ.)
• Демо-приложение: человеческое тело (англ.)
• www.DoesMyBrowserSupportWebGL.com
• WebGL Demo from Google Chromium
• WebGL Demo from Google Chromium (old site)
• EndlessForms.com See the power of WebGL by comparing this site (where you can evolve objects) in Chrome and Safari.

WebGL — трехмерная графика Canvas

Могу ли я использовать

Поиск

?

WebGL — 3D-графика на холсте

— ПРОЧЕЕ

• Глобальное использование

  98,12% + 0% знак равно 98,12%

Способ создания динамической 3D-графики с использованием JavaScript, аппаратно ускоренный

Chrome

1. 4 — 7: не поддерживается
2. 8 — 32: Поддерживается
3. 33 — 106: Поддерживается
4. 107: Поддерживается
5. 108 — 110: Поддерживается

Edge

1. 12 — 18: 180015
   1. 05% — Supported»>. : Поддерживается
   2. 107: Поддерживается

   SAFARI

   1. 3.1 — 5: Не поддерживается
   2. 5.1 — 7.1: Поддерживается
   3. 8 — 16,0: Поддержка
   4. 16.1: Поддержка
   5. 4 16 16.2 -xoxered
   6. 16.1: Поддержка
   7. 16 16.2 -xoxered.
      1. 2 — 3,6: не поддерживается
      2. 4 — 23: Поддерживается
      3. 24 — 105: Поддерживается
      4. 106: поддержан
      5. 107 — 108: поддержан

      Opera

      1194499
   111944

111944

.

12 — 18: Поддержано
• 19 — 91: Поддерживается
• 92: Поддерживается

IE

1. 5,5: Не поддерживается
2. 6 — 10: не поддерживается (но имеет полифил. Хром для Android
   1. 107: Supported

   Safari on iOS

   1. 3.2 — 7.1: Not supported
   2. 8 — 16.0: Supported
   3. 16.1: Supported

   Samsung Internet

   1. 4 — 18.0: Supported
   2. 19.0: Supported

   Opera Mini

   1. 03% — Not supported»> all: Not supported

   Opera Mobile

   1. 10 — 11.5: Not supported
   2. 12 — 12.1: Supported
   3. 72: Supported

   UC Browser for Android

   1. 13.4: Supported

   Android Browser

   1. 2.1 — 4.4.4: Not supported
   2. 107: Supported

   Firefox for Android

   1. 106: Supported

   QQ Browser

   1. 13,1: Поддерживается

   Baidu Browser

   1. 13,18: Поддерживается

   KAIOS BROUSER

   1. 04% — Supported»> 2.5: Поддержанный
   9 0006 WebL -поддержка. Это связано с дополнительным требованием к пользователям иметь обновленные видеодрайверы.

   Обратите внимание, что WebGL является частью Khronos Group, а не W3C.

   Ресурсы:

   Инструкции по включению WebGL

   Polyfill для IE

   Сообщение в блоге Firefox

   Учебное пособие

   WebGL Browser Report, WebGL Fingerprinting, WebGL 2 API Test

   1 любой совместимый веб-браузер без использования плагинов. Приложения WebGL состоят из управляющего кода, написанного на JavaScript, и кода специальных эффектов, который выполняется на графическом процессоре компьютера. Элементы WebGL можно смешивать с другими элементами HTML и комбинировать с другими частями страницы или фоном страницы.

   Отчет браузера WebGL проверяет поддержку WebGL в вашем веб-браузере, создает отпечатки пальцев устройства WebGL и показывает другие возможности WebGL и графического процессора, более или менее связанные с идентификатором веб-браузера.

   Your Web Browser
   User-Agent	Mozilla/5.0 (X11; Linux x86_64; rv:33.0) Gecko/20100101 Firefox/33.0

   08489

   WebGL Support Detection
   Этот браузер поддерживает WebGL	× False (JavaScript disabled)
   This browser supports WebGL 2	× False (JavaScript disabled)
   gl.copyBufferSubData
   gl.getBufferSubData
   gl.blitFramebuffer
   gl.framebufferTextureLayer
   gl.getInternalformatParameter
   gl.invalidateFramebuffer
   gl.invalidateSubFramebuffer
   gl.readBuffer
   gl.renderbufferStorageMultisample
   gl. texStorage2D
   gl.texStorage3D
   gl.texImage3D
   gl.texSubImage3D
   gl.copyTexSubImage3D
   gl.compressedTexImage3D
   gl.compressedTexSubImage3D
   gl.getFragDataLocation
   gl.uniform1ui
   gl.uniform2ui
   gl.uniform3ui
   gl.uniform4ui
   gl .uniform1uiv
   gl.uniform2uiv
   gl.uniform3uiv
   gl.uniform4uiv
   gl.uniformMatrix2x3fv
   gl.uniformMatrix3x2fv
   gl.uniformMatrix2x4fv
   gl.uniformMatrix4x2fv
   gl.uniformMatrix3x4fv
   gl. uniformMatrix4x3fv
   gl.vertexAttribI4i
   gl.vertexAttribI4iv
   gl.vertexAttribI4ui
   gl.vertexAttribI4uiv
   gl.vertexAttribIPointer
   gl.vertexAttribDivisor
   gl.drawArraysInstanced
   gl.drawElementsInstanced
   gl.drawRangeElements
   gl .drawBuffers
   gl.clearBufferiv
   gl.clearBufferuiv
   gl.clearBufferfv
   gl.clearBufferfi
   gl.createQuery
   gl.deleteQuery
   gl.isQuery
   gl.beginQuery
   gl.endQuery
   GL.GETQUERY
   GL. GETQUERYPARAMETER
   GL.CREATESAMPLER
   0201010101010101010101010101010101010101010101010101010101010101010101019.0199
   gl.isSampler
   gl.bindSampler
   gl.samplerParameteri
   gl.samplerParameterf
   gl.getSamplerParameter
   gl.fenceSync
   gl.isSync
   gl.deleteSync
   gl.clientWaitSync
   		gl.waitSync8
   gl.getSyncParameter
   gl.createTransformFeedback
   gl.deleteTransformFeedback
   gl.isTransformFeedback
   gl.bindTransformFeedback
   gl.beginTransformFeedback
   gl.endTransformFeedback
   gl. transformFeedbackVaryings
   gl.getTransformFeedbackVarying
   gl.pauseTransformFeedback
   gl.resumeTransformFeedback
   gl.bindBufferBase
   gl.bindBufferRange
   gl.getIndexedParameter
   gl.getUniformIndices
   gl.getActiveUniforms
   gl.getUniformBlockIndex
   gl.getActiveUniformBlockParameter
   gl.getActiveUniformBlockName
   gl.uniformBlockBinding
   gl.createVertexArray
   gl.deleteVertexArray
   gl.isVertexArray
   gl.bindVertexArray

   Контекстная информация WebGL
   Поддерживаемые названия контекста	0681
   GL Version	VERSION
   Shading Language Version	SHADING_LANGUAGE_VERSION
   Vendor	VENDOR
   Renderer	RENDERER
   Antialiasing	getContextAttributes(). antialias
   ANGLE	Почти собственный механизм графического слоя
   Major Performance Caveat	failIfMajorPerformanceCaveat
   Debug Renderer Info
   Unmasked Vendor	UNMASKED_VENDOR_WEBGL
   Unmasked Renderer	UNMASKED_RENDERER_WEBGL
   WebGL Отпечаток пальца
   Хэш отчета WebGL	н/д
   WebGL Image Hash	n/a
   WebGL Image	n/a
   Vertex Shader
   Max Vertex Attributes	MAX_VERTEX_ATTRIBS
   Максимальное количество однородных векторов вершин	MAX_VERTEX_UNIFORM_VECTORS
   Максимальное количество единиц изображения текстуры вершин	MAX_VERTEX_TEXTURE_IMAGE_UNITS
   Max Varying Vectors	MAX_VARYING_VECTORS
   Best Float Precision	getShaderPrecisionFormat(VERTEX_SHADER)
   Max Vertex Uniform Components:	MAX_VERTEX_UNIFORM_COMPONENTS
   Max Vertex Равномерные блоки:	MAX_VERTEX_UNIFORM_BLOCKS
   Максимальное количество выходных компонентов вершин:	MAX_VERTEX_OUTPUT_COMPONENTS
   Max Varying Components:	MAX_VARYING_COMPONENTS
   Transform Feedback
   Max Interleaved Components:	MAX_TRANSFORM_FEEDBACK_INTERLEAVED_COMPONENTS
   Max Separate Attribs:	MAX_TRANSFORM_FEEDBACK_SEPARATE_ATTRIBS
   Максимальное количество отдельных компонентов:	MAX_TRANSFORM_FEEDBACK_SEPARATE_COMPONENTS
   Rasterizer
   Aliased Line Width Range	ALIASED_LINE_WIDTH_RANGE
   Aliased Point Size Range	ALIASED_POINT_SIZE_RANGE
   Fragment Shader
   Максимальное количество однородных векторов фрагментов	MAX_FRAGMENT_UNIFORM_VECTORS
   Max Texture Image Units	MAX_TEXTURE_IMAGE_UNITS
   Float/Int Precision:	getShaderPrecisionFormat(FRAGMENT_SHADER, HIGH_FLOAT/HIGH_INT)
   Best Float Precision	getShaderPrecisionFormat(FRAGMENT_SHADER)
   Компоненты Max Fragment Uniform:	MAX_FRAGMENT_UNIFORM_COMPONENTS
   Max Fragment Uniform Blocks:	MAX_FRAGMENT_UNIFORM_BLOCKS
   Max Fragment Input Components:	MAX_FRAGMENT_INPUT_COMPONENTS
   Min Program Texel Offset:	MIN_PROGRAM_TEXEL_OFFSET
   Max Program Texel Offset:	MAX_PROGRAM_TEXEL_OFFSET
   Буфер кадра
   Max Draw Buffers:	MAX_DRAW_BUFFERS
   Max Color Attachments:	MAX_COLOR_ATTACHMENTS
   Max Samples:	MAX_SAMPLES
   Max Color Buffers:	MAX_DRAW_BUFFERS_WEBGL
   Биты RGBA	[RED_BITS, GREEN_BITS, BLUE_BITS, ALPHA_BITS]
   Биты глубины/трафарета:	[DEPTH_BITS, STENCIL_BITS]
   Max Render Buffer Size	MAX_RENDERBUFFER_SIZE
   Max Viewport Dimensions	MAX_VIEWPORT_DIMS
   Textures
   Max Texture Size	MAX_TEXTURE_SIZE
   Макс. размер текстуры кубической карты	MAX_CUBE_MAP_TEXTURE_SIZE
   Max Combined Texture Image Units	MAX_COMBINED_TEXTURE_IMAGE_UNITS
   Max Anisotropy	MAX_TEXTURE_MAX_ANISOTROPY_EXT
   Max 3D Texture Size:	MAX_3D_TEXTURE_SIZE
   Max Array Texture Layers:	MAX_ARRAY_TEXTURE_LAYERS
   Максимальное смещение LOD текстуры:	MAX_TEXTURE_LOD_BIAS
   Uniform Buffers
   Max Uniform Buffer Bindings:	MAX_UNIFORM_BUFFER_BINDINGS
   Max Uniform Block Size:	MAX_UNIFORM_BLOCK_SIZE
   Uniform Buffer Offset Alignment:	UNIFORM_BUFFER_OFFSET_ALIGNMENT
   Максимальное количество комбинированных блоков униформы:	MAX_COMBINED_UNIFORM_BLOCKS
   Max Combined Vertex Uniform Components:	MAX_COMBINED_VERTEX_UNIFORM_COMPONENTS
   Max Combined Fragment Uniform Components:	MAX_COMBINED_FRAGMENT_UNIFORM_COMPONENTS
   WebGL Extensions
   Supported WebGL Extensions Поддерживаемые привилегированные расширения	{OES_texture_float; OES_texture_half_float; WEBGL_lose_context; OES_стандартные_производные; OES_vertex_array_object; WEBGL_debug_renderer_info; WEBGL_debug_shaders; WEBGL_compressed_texture_s3tc; WEBGL_глубина_текстуры; OES_element_index_uint; EXT_texture_filter_anisotropic; EXT_фраг_глубина; WEBGL_draw_buffers; ANGLE_instanced_arrays; OES_texture_float_linear; OES_texture_half_float_linear; EXT_blend_minmax; EXT_shader_texture_lod; WEBGL_compressed_texture_atc; WEBGL_compressed_texture_pvrtc; EXT_color_buffer_half_float; WEBGL_color_buffer_float; EXT_sRGB; WEBGL_compressed_texture_etc1; EXT_disjoint_timer_query; WEBGL_compressed_texture_etc; WEBGL_compressed_texture_astc; EXT_color_buffer_float; EXT_disjoint_timer_query_webgl2; WEBGL_общие_ресурсы; WEBGL_security_чувствительные_ресурсы; OES_fbo_render_mipmap; WEBGL_compressed_texture_s3tc_srgb; WEBGL_get_buffer_sub_data_async; EXT_clip_cull_distance; EXT_float_blend; EXT_texture_storage; OES_EGL_image_external; WEBGL_отладка; WEBGL_динамическая_текстура; WEBGL_мультипросмотр; WEBGL_subarray_uploads; OES_глубина34; WEBGL_debug_shader_precision; WEBGL_draw_elements_no_range_check; WEBGL_subscribe_uniform; WEBGL_текстура_из_глубины_видео; WEBGL_compressed_texture_es3; WEBGL_compressed_texture_astc_ldr; EXT_draw_buffers}

   Что такое отпечатки пальцев WebGL

   Существует два вида отпечатков пальцев WebGL, которые вы можете увидеть:

   • Хэш отчета WebGL и поддерживаемые расширения. Хэш берется из самого высокого поддерживаемого дампа контекста WebGL.

   • Хэш изображения WebGL

     Хэш массива пикселей, созданный с помощью отрисовки градиентного шейдера WebGL. Функция рисования заимствована из библиотеки Fingerprintjs2, в настоящее время исследуется процент уникальности сгенерированного изображения.

     Метод получения хэша использует только WebGL API и не зависит от различий браузеров в экспорте toDataURL PNG, поэтому этот отпечаток может быть одинаковым в разных браузерах на одном устройстве.

   Как включить или отключить WebGL в вашем веб-браузере , выполните простые шаги:

   1. В адресной строке введите about:config , без http:// или www
   2. Нажмите кнопку с надписью «Я буду осторожен, обещаю!»
   3. В поле Search введите webgl.disabled string
   4. Переключите webgl.disabled на true , чтобы отключить WebGL, или на false , чтобы включить WebGL, пожалуйста, не путайте.

   WebGL 2.0:

   Чтобы включить WebGL 2 в Firefox, перейдите по адресу about:config и переключите webgl.enable-webgl2 на true .

   WebGL 2 включен по умолчанию, начиная с Firefox 51.

   WebGL в Chrome

   WebGL поддерживается и включен по умолчанию, начиная с Chrome 8.

   Чтобы отключить WebGL, запустите Google Chrome с помощью одной из этих команд. -line options:

   1. --disable-webgl отключить WebGL
   2. --disable-3d-apis отключить все видимые клиенту 3D API, в частности WebGL и Pepper 3D

   Эти инструкции действительны для всех веб-браузеров на основе Chromium, точно так же, как вы можете настроить WebGL в Opera и Vivaldi.

   WebGL 2.0:

   Чтобы включить WebGL 2 в Chrome, откройте chrome://flags/ , найдите флаг WebGL 2.0 и переключите его на Enabled .