Основы WebGL

Автор: | 02.01.2019

WebGL (Web-based Graphics Library) основывается на технологиях HTML,  JavaScript, OpenGL и др.

HTML (HyperText Markup Language) – язык разметки гипертекста для описания структуры Web-страницы. Основным компонентом HTML является тег (tag) – код, который командует Web-браузеру выполнить определенную задачу типа создания абзаца или вставки изображения. HTML не является языком программирования, но для организации динамических Web-страниц в него можно включать программы на языке Javascript, в пределах тегов <script> и </script>.

В HTML определен элемент <canvas> как «растровый холст, который может быть использован для отображения  2D графики. Через объект canvas можно получить WebGL контекст,  который обеспечивает возможности 3D графики библиотеки OpenGL.

Но этим все, отнюдь, не ограничивается. Архитектуру WebGL-приложения сегодня в некотором смысле можно сравнить с тем, как наши предки видели вселенную.

Графические приложения наиболее нуждаются оптимизации, особенно в Web программировании. Изучая каждую функцию OpenGL, стоит задуматься, как вызов этой функции выполняется и сколько времени он может занять.

Возможности OpenGL определяются аппаратурой, которая, как известно, имеет тенденцию развиваться. В соответствии с этим в  OpenGL добавляются новые функции.  С появлением GPU (Graphic Processor Unit) весь функционал с последовательной передачей и обработкой каждой вершины примитива практически перестал использоваться. Взамен GPU принимает на вход описание трехмерной сцены в виде массивов вершин и треугольников, а также параметры наблюдателя, и строит по ним на экране двумерное изображение сцены. По мере совершенствования GPU появилась возможность  хранить вершины и их атрибуты в различных буферах – непосредственно на GPU.

Шейдер — компьютерная программа, предназначенная для исполнения на GPU. Шейдеры пишут на специальном языке шейдеров. В WebGL добавлена поддержка языка GLSL (OpenGL Shading Language), который  позволяет взять под свой контроль всю мощь GPU с его тысячами параллельно работающих ядер.

Перечень задач, которые выносятся для рассмотрения в рубрике WebGL:

Полезные ссылки:

  1. WebGL — Quick Guide
  2. Введение в WebGL
  3. Язык JavaScript
  4. Opengl-tutorial
  5. Введение в программирование шейдеров
  6. Learning WebGL по-русски
  7. Lightcycle demo using WebGL
  8. Основы WebGL: разбираемся в магическом коде
  9. Основы WebGL
  10. Как работает WebGL
  11. Первая программа на WebGL
  12. Создание шейдеров
  13. UI-компоненты на пиксельных шейдерах: пишем ваш первый шейдер

 

Автор: Николай Свирневский

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *