WebGL

Almost Native Graphics Layer Engine (ANGLE) es un motor gráfico de código abierto que implementa los estándares WebGL 1.0 (2.0 que se ajusta estrechamente a ES 3.0) y OpenGL ES 2.0 y 3.0. Es un backend predeterminado tanto para Google Chrome como para Mozilla Firefox en plataformas Windows y funciona traduciendo las llamadas WebGL y OpenGL a las API disponibles específicas de la plataforma. Actualmente, ANGLE proporciona acceso a OpenGL ES 2.0 y 3.0 para las API de escritorio OpenGL, OpenGL ES, Direct3D 9 y Direct3D 11. ^{[ 17 ]} ″[Google] Chrome utiliza ANGLE para toda la representación gráfica en Windows, incluida la implementación acelerada de Canvas2D y el entorno sandbox de Native Client.″ ^{[ 17 ]}

Fuente: ^{[ 2 ]}

• Google Chrome – WebGL 1.0 ha estado habilitado en todas las plataformas que tienen una tarjeta gráfica capaz con controladores actualizados desde la versión 9, lanzada en febrero de 2011. ^{[ 21 ] [ 22 ]} Por defecto en Windows, Chrome usa el renderizador ANGLE (Almost Native Graphics Layer Engine) para convertir OpenGL ES a Direct X 9.0c o 11.0, que tienen mejor soporte de controlador. ^{[ 23 ]} Sin embargo, en Linux y Mac OS X, el renderizador predeterminado es OpenGL. ^{[ 24 ]} También es posible forzar OpenGL como renderizador en Windows. ^{[ 23 ]} Desde septiembre de 2013, Chrome también tiene un renderizador Direct3D 11 más nuevo, que requiere una tarjeta gráfica más nueva. ^{[ 25 ] [ 26 ]} Chrome 56+ es compatible con WebGL 2.0.
• Firefox – WebGL 1.0 se ha habilitado en todas las plataformas que tienen una tarjeta gráfica compatible con controladores actualizados desde la versión 4.0. ^{[ 27 ]} Desde 2013, Firefox también usa DirectX en la plataforma Windows a través de ANGLE . ^{[ 23 ]} Firefox 51+ admite WebGL 2.0.
• Safari – Safari 6.0 y versiones posteriores instaladas en OS X Mountain Lion , Mac OS X Lion y Safari 5.1 en Mac OS X Snow Leopard implementaron soporte para WebGL 1.0, que estaba deshabilitado por defecto antes de Safari 8.0. ^{[ 28 ] [ 29 ] [ 30 ] [ 31 ] [ 32 ]} Safari versión 12 (disponible en macOS Mojave) tiene soporte disponible para WebGL 2.0 como una característica "experimental". Safari 15 habilita WebGL 2.0 para todos los usuarios. ^{[ 33 ]}
• Opera – WebGL 1.0 se implementó en Opera 11 y 12, pero se deshabilitó por defecto en 2014. ^{[ 34 ] [ 35 ]} Opera 43+ admite WebGL 2.0.
• Internet Explorer – WebGL 1.0 es parcialmente compatible con Internet Explorer 11. [ ^{36 ] [ 37 ] [ 38 ] [ 39 ] Inicialmente} , Internet Explorer no superó la mayoría de las pruebas de conformidad oficiales de WebGL, pero Microsoft lanzó posteriormente varias actualizaciones. El último motor WebGL 0.94 actualmente supera aproximadamente el 97 % de las pruebas de Khronos. ^{[ 40 ]} La compatibilidad con WebGL también se puede agregar manualmente a versiones anteriores de Internet Explorer mediante complementos de terceros como IEWebGL. ^{[ 41 ]}
• Microsoft Edge – Para Microsoft Edge Legacy, la versión estable inicial admite WebGL versión 0.95 (nombre de contexto: "experimental-webgl") con un transpilador GLSL a HLSL de código abierto . ^{[ 42 ]} La versión 10240+ admite WebGL 1.0 como prefijo. La última versión de Edge basada en Chromium admite WebGL 2.0.

• Google Chrome – WebGL 1.0 es compatible con Android desde Chrome 25. ^{[ 43 ]} WebGL 2.0 es compatible con Android desde Chrome 58. ^{[ 44 ]} Chrome se utiliza para la vista web del sistema Android desde Android 5. ^{[ 45 ]}
• Firefox para móviles : WebGL 1.0 está disponible para dispositivos Android desde Firefox 4. ^{[ 46 ] [ 47 ]}
• Safari en iOS : WebGL 1.0 está disponible para Safari móvil en iOS 8. [ ^{48 ] WebGL} 2.0 está disponible para Safari móvil en iOS 15. ^{[ 44 ]}
• Microsoft Edge – WebGL 1.0 con prefijo estaba disponible en Windows 10 Mobile. ^{[ 49 ]} . La última versión de Edge basada en Chromium admite WebGL 2.0.
• Opera Mobile – Opera Mobile 12 es compatible con WebGL 1.0 (solo en Android). ^{[ 50 ]}
• Sailfish OS – WebGL 1.0 es compatible con el navegador Sailfish predeterminado. ^{[ 51 ]}
• Tizen – WebGL 1.0 es compatible ^{[ 52 ]}

La naturaleza de bajo nivel de la API WebGL, que por sí sola ofrece pocas funcionalidades para crear rápidamente gráficos 3D atractivos, motivó la creación de bibliotecas de nivel superior que abstraen operaciones comunes (por ejemplo, cargar grafos de escena y objetos 3D en ciertos formatos; aplicar transformaciones lineales a sombreadores o frustums de vista ). Algunas de estas bibliotecas se portaron a JavaScript desde otros lenguajes. Ejemplos de bibliotecas que ofrecen funcionalidades de alto nivel incluyen A-Frame (VR) , BabylonJS, PlayCanvas , three.js , OSG.JS , el visor de modelos de Google y CopperLicht . Web3D también creó un proyecto llamado X3DOM para que el contenido X3D y VRML se ejecutara en WebGL.

Ha surgido una serie de motores de juegos 2D y 3D para WebGL, ^{[ 53 ]} como Unreal Engine 4 y Unity . ^{[ 54 ]} La biblioteca de alto nivel Stage3D /Flash Away3D también tiene una versión para WebGL mediante TypeScript . ^{[ 25 ] [ 55 ]} Una biblioteca de utilidades más ligera que proporciona únicamente las utilidades matemáticas de vectores y matrices para sombreadores es sylvester.js. ^{[ 56 ] [ 57 ]} A veces se utiliza junto con una extensión específica de WebGL llamada glUtils.js. ^{[ 56 ] [ 58 ]}

También existen algunas bibliotecas 2D construidas sobre WebGL, como Cocos2d -x o Pixi.js , que se implementaron de esta manera por razones de rendimiento, en una decisión similar a la que se tomó con el Starling Framework sobre Stage3D en el mundo de Flash. Las bibliotecas 2D basadas en WebGL recurren al lienzo HTML5 cuando WebGL no está disponible. ^{[ 59 ]} Eliminar el cuello de botella de renderizado al brindar acceso casi directo a la GPU ha expuesto limitaciones de rendimiento en las implementaciones de JavaScript. Algunas fueron abordadas por asm.js y WebAssembly (de manera similar, la introducción de Stage3D expuso problemas de rendimiento dentro de ActionScript , que fueron abordados por proyectos como CrossBridge ). ^{[ 59 ]}

Como con cualquier otra API gráfica, la creación de contenido para escenas WebGL requiere el uso de una herramienta de creación de contenido 3D y la exportación de la escena a un formato legible por el visor o la biblioteca auxiliar. Se puede utilizar software de autoría 3D de escritorio como Blender , Autodesk Maya o SimLab Composer para este propósito. En particular, Blend4Web permite crear una escena WebGL completamente en Blender y exportarla a un navegador con un solo clic, incluso como una página web independiente. ^{[ 60 ]} También hay algunos programas específicos de WebGL como CopperCube y el editor en línea basado en WebGL Clara.io . Plataformas en línea como Sketchfab y Clara.io permiten a los usuarios cargar directamente sus modelos 3D y visualizarlos utilizando un visor WebGL alojado.

A partir de Firefox versión 27, Mozilla ha dotado a Firefox de herramientas WebGL integradas que permiten la edición de sombreadores de vértices y fragmentos. ^{[ 61 ]} También han surgido otras herramientas de depuración y análisis de rendimiento . ^{[ 62 ]}