WebGL - Introduction

A few years back, Java applications − as a combination of applets and JOGL − were used to process 3D graphics on the Web by addressing the GPU (Graphical Processing Unit). As applets require a JVM to run, it became difficult to rely on Java applets. A few years later, people stopped using Java applets.

The Stage3D APIs provided by Adobe (Flash, AIR) offered GPU hardware accelerated architecture. Using these technologies, programmers could develop applications with 2D and 3D capabilities on web browsers as well as on IOS and Android platforms. Since Flash was a proprietary software, it was not used as web standard.

OpenGL

OpenGL (Open Graphics Library) is cross-language, cross-platform API for 2D and 3D graphics. It is a collection of commands. OpenGL4.5 is the latest version of OpenGL. The following table lists a set of technologies related to OpenGL.

API	Technology Used
OpenGL ES	It is the library for 2D and 3D graphics on embedded systems − including consoles, phones, appliances, and vehicles. OpenGL ES 3.1 is its latest version. It is maintained by the Khronos Group www.khronos.org
JOGL	It is the Java binding for OpenGL. JOGL 4.5 is its latest version and it is maintained by jogamp.org.
WebGL	It is the JavaScript binding for OpenGL. WebGL 1.0 is its latest version and it is maintained by the khronos group.
OpenGLSL	OpenGL Shading Language. It is a programming language which is a companion to OpenGL 2.0 and higher. It is a part of the core OpenGL 4.4 specification. It is an API specifically tailored for embedded systems, such as those present on mobile phones and tablets.

Note − In WebGL, we use GLSL to write shaders.

What is WebGL?

WebGL (Web Graphics Library) is the new standard for 3D graphics on the Web, It is designed for the purpose of rendering 2D graphics and interactive 3D graphics. It is derived from OpenGL's ES 2.0 library which is a low-level 3D API for phones and other mobile devices. WebGL provides similar functionality of ES 2.0 (Embedded Systems) and performs well on modern 3D graphics hardware.
It is a JavaScript API that can be used with HTML5. HTML5 has several features to support 3D graphics such as 2D Canvas, WebGL, SVG, 3D CSS transforms, and SMIL.
WebGL code is written within the <canvas> tag of HTML5. It is a specification that allows Internet browsers access to Graphic Processing Units (GPUs) on those computers where they were used.

Who Developed WebGL

An American-Serbian software engineer named Vladimir Vukicevic did the foundation work and led the creation of WebGL.

• In 2007, Vladimir started working on an OpenGL prototype for Canvas element of the HTML document.
• In March 2011, Kronos Group created WebGL.

Browsers Supported

The following tables show a list of browsers that support WebGL −

Web Browsers

Browser Name	Version	Support
Internet Explorer	11 and above	Complete support
Google Chrome	39 and above	Complete support
Safari	8	Complete support
Firefox	36 and above	Partial support
Opera	27 and above	Partial support

Mobile Browsers

Browser Name	Version	Support
Chrome for Android	42	Partial support
Android browser	40	Partial support
IOS Safari	8.3	Complete support
Opera Mini	8	Does not support
Blackberry Browser	10	Complete support
IE mobile	10	Partial support

Advantages of WebGL

Here are the advantages of using WebGL −

• JavaScript programming − WebGL applications are written in JavaScript. Using these applications, you can directly interact with other elements of the HTML Document. You can also use other JavaScript libraries (e.g. JQuery) and HTML technologies to enrich the WebGL application.
• Increasing support with mobile browsers − WebGL also supports Mobile browsers such as iOS safari, Android Browser, and Chrome for Android.
• Open source − WebGL is an open source. You can access the source code of the library and understand how it works and how it was developed.
• No need for compilation − JavaScript is a half-programming and half-HTML component. To execute this script, there is no need to compile the file. Instead, you can directly open the file using any of the browsers and check the result. Since WebGL applications are developed using JavaScript, there is no need to compile WebGL applications as well.
• Automatic memory management − JavaScript supports automatic memory management. There is no need for manual allocation of memory. WebGL inherits this feature of JavaScript.
• Easy to set up − Since WebGL is integrated within HTML 5, there is no need for additional set up. To write a WebGL application, all that you need is a text editor and a web browser.

Environment Setup

There is no need to set a different environment for WebGL. The browsers supporting WebGL have their own in-built setup for WebGL.