Vertex Shader: o que é, tarefas e princípio de funcionamento

O que é Vertex Shader?

Vertex Shader é um estágio programável do pipeline gráfico que processa cada vértice de um modelo 3D individualmente. Um vértice é um ponto no espaço tridimensional que contém atributos: coordenadas xyz, normais, cor e coordenadas de textura UV.

Ao contrário do pipeline de função fixa (fixed-function pipeline) onde as transformações eram realizadas de acordo com um algoritmo rígido, o Vertex Shader dá ao desenvolvedor controle total sobre a transformação de vértices. Isso permite implementar animação processual, deformação de modelos, skinning esquelético e qualquer transformação matemática no lado da GPU.

Posição do Vertex Shader no pipeline gráfico

O pipeline gráfico do OpenGL ES inclui uma sequência de estágios desde os dados de entrada até a imagem final. Vertex Shader está localizado após o estágio de montagem de vértices e antes do estágio de rasterização. Cada vértice enviado da CPU através de um buffer de vértices passa pelo Vertex Shader exatamente uma vez, e o resultado é encaminhado para o próximo estágio para montagem de primitivas.

Como funciona o Vertex Shader?

Vertex Shader recebe os atributos dos vértices do buffer de vértices (VBO) através de ponteiros de atributos de vértice configurados no código da CPU. O desenvolvedor escreve o código do shader em GLSL (OpenGL Shading Language) ou uma linguagem equivalente, que o driver da GPU compila em instruções de máquina para o chip específico.

Fluxo de processamento de vértices

Para cada vértice, o Vertex Shader realiza sequencialmente três operações: leitura dos atributos de entrada — aplicação das transformações definidas pelo desenvolvedor — escrita dos resultados em variáveis de saída. A saída mínima necessária é a posição do vértice no espaço de recorte (gl_Position). Todos os outros dados de saída (cor, normais, coordenadas de textura) são interpolados e passados para o próximo estágio — o 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;
}

Principais tarefas do Vertex Shader

Vertex Shader resolve uma ampla gama de tarefas do pipeline gráfico relacionadas à transformação de geometria. Cada tarefa é implementada através de operações matemáticas em vetores e matrizes, executadas em paralelo para milhares de vértices simultaneamente.

Transformação de coordenadas via MVP

A tarefa básica e mais comum é multiplicar as coordenadas dos vértices pelas matrizes model, view e projection (MVP). A matriz MVP transforma um vértice do espaço local do modelo para o espaço de recorte (clip space), que é então normalizado e convertido em coordenadas de tela nos estágios automáticos do pipeline.

Animação esquelética (Skinning)

Para personagens animados, o Vertex Shader implementa a animação esquelética (skinning). Cada vértice está vinculado a vários ossos com pesos específicos. Vertex blending — uma soma ponderada de transformações dos ossos vinculados — permite deformar suavemente a pele do personagem quando o esqueleto se move.

Deformação processual de geometria

O Vertex Shader pode modificar a geometria com base no tempo ou em outros parâmetros uniform sem envolvimento da CPU. Wave deformation, deslocamento por ruído Perlin e efeitos de ondulação na água — todos esses efeitos são implementados no shader de vértices sem recarregar a geometria da RAM.

Vertex Shader vs Fragment Shader: diferenças

Embora ambos os tipos de shaders sejam estágios programáveis do pipeline gráfico, Vertex Shader e Fragment Shader resolvem tarefas fundamentalmente diferentes e operam em estágios distintos do processamento de imagem.

A diferença chave é a frequência de invocação. Vertex Shader é chamado uma vez por vértice, enquanto Fragment Shader é chamado para cada fragmento (pixel). Em uma cena de alta resolução, o número de invocações do Fragment Shader excede o número de invocações do Vertex Shader em milhares de vezes, tornando a otimização dos shaders de pixel ainda mais crítica.

Desempenho e otimização do Vertex Shader

O desempenho do Vertex Shader é criticamente importante para aplicações em tempo real, especialmente no desenvolvimento mobile com consumo de energia limitado. Os principais fatores de desempenho são o número de vértices, a complexidade do código do shader e a largura de banda da memória da GPU.

Fatores que afetam o desempenho

• Quantidade de vértices — o número de vértices enviados para a GPU por quadro. Modelos com milhões de polígonos criam alta carga no shader de vértices.
• Complexidade do shader — o número de instruções no shader. Loops aninhados e ramificações condicionais (divergência) reduzem o desempenho paralelo das unidades SIMD.
• Largura de banda — a velocidade de leitura dos dados dos vértices da memória de vídeo. O formato dos atributos (float32, float16, inteiro normalizado) afeta diretamente a taxa de transferência.

Métodos de otimização de shaders de vértices

Para reduzir a carga no Vertex Shader, as seguintes abordagens são utilizadas. Level of Detail (LOD) — mudança para versões simplificadas de modelos quando a câmera se afasta do objeto. Instancing — desenho repetido da mesma geometria com diferentes matrizes de transformação em uma única chamada de desenho (draw call).

// Vertex Shader com suporte a instancing
in vec3 aPosition;
in mat4 aInstanceMatrix;
uniform mat4 uViewProjection;

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

Exemplos de código Vertex Shader

Vertex Shader em diferentes APIs gráficas tem lógica similar, mas sintaxe e convenções de nomenclatura diferentes. Vamos implementar um shader de vértices básico em GLSL para OpenGL ES 3.0 e em Metal Shading Language para iOS e macOS.

Exemplo em GLSL para 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;
}

Exemplo em 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;
}