WebGL 1은 OpenGL ES 2.0 기반
WebGL 2는 OpenGL ES 3.0 기반, 이는 WebGL 1에 새로운 기능이 추가된 것.
WebGL은 GPU에서 동작한다.
Vertex shader와 fragment shader 두 개의 함수가 한 쌍으로 하나의 프로그램이 된다.
vertext shader는 vertex의 위치를 계산, 이 결과로 나온 출력들을 바탕으로 point, line, triangle을 raterize한다.
rasterizing할 때 WebGL은 fragment shader을 호출한다.
fragment shader는 현재 그리려고 하는 primitive(point, line, triangle, ...)의 각 픽셀에 대한 색을 계산한다.
buffer -> attribute -> vertex shader
shader는 4가지 방법으로 데이터를 받는다: attribute, uniform, texture, varying
attribute은 버퍼에 저장된 데이터(position, normal, texture coordinate, vertex color, ...)를 어떻게 가져올지 지정하고, vertex shader에게 넘겨준다.
예를 들어, 어떤 버퍼에 32bit float이 세개 저장되어 있다면, 특정 attribute한테 어떤 버퍼를 사용할지 알려주고, 어떤 타입의 데이터인지 말해주고, 버퍼에서 offset은 어떻게 할지, 데이터를 어떤 크기(byte)만큼 가져올지 설정한다. vertex shader는 지정된 횟수만큼 실행된다.
uniform은 vertex shader와 fragement shader 둘 다에서 쓰일 수 있다.
texture는 shader program에서 random access할 수 있다. 보통 이미지 데이터가 저장되지만, color 이외의 정보도 포함할 수 있다.
varying은 vertex shader에서 fragment shader로 데이터를 전달할 수 있다. vertex shader에서 varying으로 설정된 값은 primitive(point, line, triangle, ...)에 따라서 fragment shader에서 실행될 때 interpolate된다.
vertex shader는 clip space coord.(-1에서 1사이의 범위를 갖는다.)를 제공하고, fragement shader는 color을 제공한다.
initialization code
댓글