For rendering 3D graphics, we need to follow a sequence of steps. These steps are called as rendering pipeline or graphics pipeline. The below diagram depicts WebGL rendering pipeline.
In the below sections, we will discuss each step in the detail in the pipeline.
Firstly, we create the data for the required geometry and we will pass them to the shaders in buffers form. The attribute variable of the shader language refers to the buffer objects, which will be passed as parameters to the vertex shader.
When we begin the rendering procedure by triggering the methods namely drawElements() and drawArray(), the vertex shader is performed for each vertex facilitated in the vertex buffer object. It computes the position of every vertex of a primitive polygon and preserves it in the differing gl_position. It will also compute the other attributes such as texture coordinates, color and vertices that are generally related with a vertex.
After computing the position and other information of every vertex, the next stage is the primitive assembly stage. Here the triangles are arranged and passed to the rasterizer.
In the rasterization step, the pixels in the concluding image of the primitive are specified. It consists of two steps −
The fragment shader acquires
The fragment shader preserves the color values of each pixel in every fragment. These color values can be accessed during fragment operations, which we are going to discuss next.
Some fragment operations are accomplished after specifying the color of each pixel in the primitive. These fragment operations may involve the below −
Soon after all the fragments are processed, a 2D image is formed and shown on the screen. The frame buffer is the ultimate stop of the rendering pipeline.
Frame buffer is an area of graphics memory which stores the scene data. This frame buffer consists of details like height and width of the surface (in pixels), color of every pixel, and depth and stencil buffers.
WebGL Related Interview Questions
|HTML 5 Interview Questions||Web Designing Interview Questions|
|Computer Graphics Interview Questions||Graphic Design Interview Questions|
|UI Developer Interview Questions||Git (software) Interview Questions|
|Scalable Vector Graphics Interview Questions||Java Design Patterns Interview Questions|
|Design Patterns Interview Questions||Unigraphics NX Interview Questions|
|Advanced C# Interview Questions||Advanced jQuery Interview Questions|
|UI Designer Interview Questions|
WebGL Related Practice Tests
|HTML 5 Practice Tests||Web Designing Practice Tests|
|Computer Graphics Practice Tests||Graphic Design Practice Tests|
|UI Developer Practice Tests||Git (software) Practice Tests|
|Scalable Vector Graphics Practice Tests||Java Design Patterns Practice Tests|
All rights reserved © 2018 Wisdom IT Services India Pvt. Ltd
Wisdomjobs.com is one of the best job search sites in India.