Vertex Shader: ano ito, mga gawain at prinsipyo ng paggana

Ano ang Vertex Shader?

Vertex Shader ay isang programmable na yugto ng graphics pipeline na nagpoproseso ng bawat vertex ng three-dimensional na modelo nang paisa-isa. Ang vertex ay isang punto sa three-dimensional na espasyo na naglalaman ng mga attribute: xyz coordinate, normal, kulay at UV texture coordinate.

Hindi tulad ng fixed-function pipeline kung saan ang mga pagbabago ay isinasagawa ayon sa isang nakapirming algorithm, ang Vertex Shader ay nagbibigay sa developer ng buong kontrol sa pagbabago ng vertex. Ito ay nagpapahintulot sa pagpapatupad ng procedural animation, pag-deform ng mga modelo, skeletal skinning at anumang mathematical transformation sa bahagi ng GPU.

Lugar ng Vertex Shader sa graphics pipeline

Ang graphics pipeline ng OpenGL ES ay may kasamang pagkakasunod-sunod ng mga yugto mula sa input data hanggang sa huling imahe. Vertex Shader ay matatagpuan pagkatapos ng yugto ng vertex assembly at bago ang yugto ng rasterization. Bawat vertex na ipinadala mula sa CPU sa pamamagitan ng vertex buffer ay dumadaan sa Vertex Shader nang eksaktong isang beses, at ang resulta ay ipinapasa sa susunod na yugto para sa pag-assemble ng mga primitive.

Paano gumagana ang Vertex Shader?

Vertex Shader ay tumatanggap ng mga attribute ng vertex mula sa vertex buffer (VBO) sa pamamagitan ng vertex attribute pointers na naka-configure sa CPU code. Ang developer ay nagsusulat ng shader code sa GLSL (OpenGL Shading Language) o katulad na wika, na kino-compile ng GPU driver sa machine instruction para sa partikular na chip.

Proseso ng pagproseso ng vertex

Para sa bawat vertex, ang Vertex Shader ay sunod-sunod na nagsasagawa ng tatlong operasyon: pagbasa ng input attribute — pag-apply ng mga pagbabagong tinukoy ng developer — pagsulat ng mga resulta sa output variable. Ang pinakamababang mandatory output ay ang posisyon ng vertex sa clip space (gl_Position). Lahat ng iba pang output data (kulay, normal, texture coordinate) ay ini-interpolate at ipinapasa sa susunod na yugto — Fragment Shader.

#version 300 es
in vec3 aPosition;
in vec2 aTexCoord;
uniform mat4 uMVP;
out vec2 vTexCoord;

void main() {
    gl_Position = uMVP * vec4(aPosition, 1.0);
    vTexCoord = aTexCoord;
}

Pangunahing Gawain ng Vertex Shader

Vertex Shader ay lumulutas ng malawak na hanay ng mga gawain ng graphics pipeline na nauugnay sa pagbabago ng geometry. Bawat gawain ay naipapatupad sa pamamagitan ng mathematical operations sa mga vector at matrix, na isinasagawa nang parallel para sa libu-libong vertex nang sabay-sabay.

Pagbabago ng coordinate sa pamamagitan ng MVP

Ang pangunahing at pinakakaraniwang gawain ay ang pag-multiply ng vertex coordinate sa model, view at projection (MVP) matrice. MVP matrix ay nagko-convert ng vertex mula sa lokal na espasyo ng modelo patungo sa clip space, na pagkatapos ay nino-normalize at kino-convert sa screen coordinate sa mga awtomatikong yugto ng pipeline.

Skeletal Animation (Skinning)

Para sa mga animated na karakter, ang Vertex Shader ay nagpapatupad ng skeletal animation (skinning). Bawat vertex ay nakatali sa maraming buto na may tiyak na mga timbang. Vertex blending — ang timbang na kabuuan ng mga pagbabago mula sa nakataling buto — ay nagpapahintulot sa makinis na pag-deform ng balat ng karakter kapag gumagalaw ang kalansay.

Procedural Deformation ng Geometry

Ang Vertex Shader ay maaaring magbago ng geometry batay sa oras o iba pang uniform parameter nang walang partisipasyon ng CPU. Wave deformation, ingay na paglilipat batay sa Perlin noise at ripple effect sa tubig — lahat ng epektong ito ay naipapatupad sa vertex shader nang hindi ni-re-reload ang geometry mula sa RAM.

Vertex Shader vs Fragment Shader: mga pagkakaiba

Kahit na ang parehong uri ng shader ay programmable na yugto ng graphics pipeline, ang Vertex Shader at Fragment Shader ay lumulutas ng fondamental na magkaibang mga gawain at gumagana sa iba't ibang yugto ng pagproseso ng imahe.

Ang pangunahing pagkakaiba ay ang dalas ng tawag. Ang Vertex Shader ay tinatawag nang isang beses bawat vertex, samantalang ang Fragment Shader ay tinatawag para sa bawat fragment (pixel). Sa isang eksena na may mataas na resolusyon, ang bilang ng mga tawag sa Fragment Shader ay lumalampas sa bilang ng mga tawag sa Vertex Shader ng libu-libong beses, na ginagawang mas kritikal ang pag-optimize ng pixel shader.

Pagganap at Pag-optimize ng Vertex Shader

Pagganap ng Vertex Shader ay kritikal para sa real-time na mga application, lalo na sa mobile development na may limitadong konsumo ng kuryente. Ang pangunahing factor ng pagganap ay ang bilang ng vertex, pagiging kumplikado ng shader code at bandwidth ng memory ng GPU.

Mga factor na nakakaapekto sa pagganap

• Vertex count — bilang ng vertex na ipinapadala sa GPU bawat frame. Ang mga modelong may milyun-milyong polygon ay lumilikha ng mataas na load sa vertex shader.
• Shader complexity — bilang ng instruction sa shader. Ang nested loop at conditional jumps (divergence) ay nagpapababa ng parallel performance ng SIMD block.
• Bandwidth — bilis ng pagbasa ng vertex data mula sa video memory. Ang format ng attribute (float32, float16, normalized integer) ay direktang nakakaapekto sa bandwidth.

Paraan ng pag-optimize ng vertex shader

Upang mabawasan ang load ng Vertex Shader, inilalapat ang mga sumusunod na approach. Level of Detail (LOD) — paglipat sa pinasimpleng bersyon ng modelo kapag lumalayo ang camera sa object. Instancing — maramihang pag-drawing ng parehong geometry na may iba't ibang transformation matrice sa isang draw call.

// Vertex Shader na may suporta sa instansiya
in vec3 aPosition;
in mat4 aInstanceMatrix;
uniform mat4 uViewProjection;

void main() {
    vec4 worldPos = aInstanceMatrix * vec4(aPosition, 1.0);
    gl_Position = uViewProjection * worldPos;
}

Halimbawa ng Kodigo ng Vertex Shader

Vertex Shader sa iba't ibang graphics API ay may katulad na lohika, ngunit magkaibang syntax at naming convention. Tingnan natin ang pagpapatupad ng basic vertex shader sa GLSL para sa OpenGL ES 3.0 at sa Metal Shading Language para sa iOS at macOS.

Halimbawa sa GLSL para sa OpenGL ES 3.0

#version 300 es
in vec4 position;
in vec3 normal;
in vec2 texcoord;

uniform mat4 modelViewMatrix;
uniform mat4 projectionMatrix;
uniform mat3 normalMatrix;

out vec3 vNormal;
out vec2 vTexCoord;
out vec3 vPosition;

void main() {
    vec4 mvPosition = modelViewMatrix * position;
    vPosition = mvPosition.xyz;
    vNormal = normalMatrix * normal;
    vTexCoord = texcoord;
    gl_Position = projectionMatrix * mvPosition;
}

Halimbawa sa Metal Shading Language

#include <metal_stdlib>
using namespace metal;

struct VertexIn {
    float3 position [[attribute(0)]];
    float3 normal   [[attribute(1)]];
};

struct VertexOut {
    float4 position [[position]];
    float3 worldNormal;
};

vertex VertexOut
vertexMain(VertexIn in [[stage_in]],
           constant float4x4& mvp [[buffer(1)]]) {
    VertexOut out;
    out.position = mvp * float4(in.position, 1.0);
    out.worldNormal = in.normal;
    return out;
}