¿Cómo funciona WebGL?

OpenGL es una API de programación estándar que los controladores de gráficos proporcionan, bueno, para mostrar gráficos. Le permite insertar datos gráficos como la geometría 3D como vértices y caras para formar mallas e imágenes de textura para pintar las superficies de esos objetos 3D. Puede definir la vista y la iluminación de la cámara y obtener vistas en 3D de lo que dibujó, también funciona para 2D y le da mucho control del dibujo para que pueda hacer casi cualquier cosa.

Esos datos van al sistema de gráficos, en el caso de una tarjeta de gráficos dedicada a la memoria de gráficos de esa tarjeta, o con sistemas de gráficos integrados (por ejemplo, en computadoras portátiles baratas) solo a la memoria normal. Entonces el sistema gráfico puede mostrarlo de manera eficiente.

Además, puede cargar software especial para ejecutar en las GPU (procesadores gráficos, en lugar del procesador normal (CPU)) para personalizar cómo desea calcular, por ejemplo, cómo se refleja la luz en sus objetos 3D: estos programas se denominan sombreadores y con OpenGL están escritos en un lenguaje llamado GLSL (es similar a c).

WebGL expone la API de OpenGL para Javascript en los navegadores web. Entonces puede hacer lo mismo desde Javascript: defina matrices de vértices para, por ejemplo, geometría 3D, cargue sus imágenes de textura y sombreadores GLSL. Sin embargo, es un entorno seguro donde el código no puede acceder al sistema de otra manera y los códigos del sombreador se ejecutan a través de controles adicionales para mantenerlo seguro.

WebGL 1 es OpenGL ES 2, que es un subconjunto más simple de la especificación OpenGL original más grande para dispositivos móviles (ES es para sistemas integrados). De esta manera, los mismos códigos WebGL se ejecutan tanto en sistemas de escritorio / portátiles como en dispositivos móviles donde solo ES está disponible. WebGL 2 ahora viene con OpenGL v3 y más funciones.

three.js: la biblioteca Javascript 3D es un ayudante popular que hace que WebGL sea fácil de usar sin necesidad de saber cómo crear esos recursos gráficos en el nivel OpenGL y el sitio allí presenta proyectos geniales y enlaces a un conjunto integral de ejemplos básicos también.