Fragment Shader — mi ez, feladatai és működési elve

Mi az a Fragment Shader?

Fragment Shader (fragment- vagy pixel shader) — a grafikus pipeline programozható szakasza, amely kiszámítja a kép egyes fragmentumainak végső színét. A fragmentum egy potenciális pixel, amely a mélységi és sablon tesztek áthaladása után látható pixellé válik a képernyőn.

A Fragment Shader a raszterizálás után hajtódik végre, amikor a háromdimenziós primitívek (háromszögek) már fragmentumok halmazává alakultak. A shader a bemeneten interpolált attribútumokat kap — textúrakoordinátákat, normálisokat, színeket, amelyeket a Vertex Shader számított ki a háromszög csúcsaihoz, és lineárisan interpolálta a benne lévő minden egyes pixelhez.

A Fragment Shader evolúciójának története

A programozható shaderek megjelenése előtt (a DirectX 8 / OpenGL 2.0 előtt) a pixel színének kiszámítását egy rögzített pipeline végezte korlátozott műveletkészlettel. Programozható Fragment Shader 2001-ben jelent meg, és radikálisan kiterjesztette a grafika lehetőségeit: a fejlesztők teljes ellenőrzést kaptak minden egyes pixel színe felett, ami lehetővé tette a fotorealisztikus világítás, összetett anyagok és utóhatások megvalósítását.

Hogyan működik a Fragment Shader?

Fragment Shader a GPU által indul a raszterizáló által generált minden egyes fragmentumhoz. Minden shader-hívás feldolgoz egy fragmentumot, beolvassa a bemeneti adatait, végrehajtja a felhasználói kódot, és kiírja a kimeneti értéket — a fragmentum színét RGBA formátumban.

Bemeneti és kimeneti adatok

A Fragment Shader bemeneti adatai tartalmazzák a Vertex Shader-től származó interpolált attribútumokat (textúrakoordináták, normálisok, színek), uniform változókat (fényforrások, mátrixok) és textúra mintavevőket. A kimeneti adatok — színvektor (gl_FragColor OpenGL ES 2.0-ban vagy felhasználói változó ES 3.0-ban), amely a színpufferbe íródik.

#version 300 es
precision mediump float;

in vec2 vTexCoord;
uniform sampler2D uTexture;
out vec4 fragColor;

void main() {
    fragColor = texture(uTexture, vTexCoord);
}

A Fragment Shader fő feladatai

Fragment Shader felelős a kép vizuális minőségéért. Minden effekt, amit a felhasználó a képernyőn lát — szín, árnyékok, tükröződések, átlátszóság — pontosan a grafikus pipeline ezen szakaszában kerül kiszámításra.

Textúrázás

A leggyakoribb művelet — szín kinyerése a textúrából interpolált UV koordináták alapján. Sampler2D és a texture() függvény lehetővé teszi a pixel színének megszerzését a textúra atlaszból. A szűrés (bilineáris, trilineáris, anizotrop) a mintavevő paraméterein keresztül vezérelhető, és befolyásolja a kép élességét különböző nézési szögeknél.

Phong-megvilágítás

A Phong-megvilágítási modell (Phong shading) a Fragment Shader-ben kerül kiszámításra minden egyes pixelre, ami simább fényeffekteket ad, mint a csúcs megvilágítás (Gouraud shading). Phong lighting három összetevőből áll: ambient (környezeti), diffuse (diffúz) és specular (tükröződő).

// Fragment shader Phong megvilágítással
in vec3 vNormal;
in vec3 vPosition;
uniform vec3 uLightDir;
uniform vec3 uLightColor;

void main() {
    vec3 norm = normalize(vNormal);
    float diff = max(dot(norm, uLightDir), 0.0);
    fragColor = vec4(uLightColor * diff, 1.0);
}

Utóhatások és blending

A Fragment Shader lehetővé teszi utófeldolgozás alkalmazását: színkorrekció LUT táblákon keresztül, elmosás (blur), fényeffektus (bloom) és tonemapping HDR rendereléshez. Mindezek az effektek pixel szinten működnek és valós időben hajtódnak végre.

A Fragment Shader teljesítménye és optimalizálás

A Fragment Shader teljesítménye — a fő tényező, amely korlátozza az FPS-t a modern mobil játékokban. Mivel a shader minden pixelhez meghívásra kerül, a kód összetettségének kis növekedése is észrevehető képkockasebesség-csökkenéshez vezethet.

Fő teljesítményproblémák

• Overdraw — ugyanazon pixel újrarajzolása az objektumok átfedése miatt. Különösen kritikus a fél-átlátszó objektumoknál.
• Feltételes elágazások — az elágazások a Fragment Shader-ben csökkentik a SIMD végrehajtás hatékonyságát, mivel a GPU-nak mindkét ágat végre kell hajtania.
• Textúra lekérések — minden textúra lekérés (texture lookup) több tucat GPU ciklus késleltetéssel jár. A mintavevők számának minimalizálása felgyorsítja a shadert.

A Fragment Shader optimalizálásának módszerei

Mobil GPU-khoz (Qualcomm Adreno, ARM Mali) ajánlott: mediump precision használata float változókhoz, textúra lekérések kombinálása, early-z tesztek alkalmazása a láthatatlan fragmentumok eldobására a shader végrehajtása előtt.

Fragment Shader vs Vertex Shader: összehasonlítás

Mindkét shader típust a fejlesztő programozza, de a pipeline különböző szakaszaiban működnek és különböző feladatokat oldanak meg. Fragment Shader jelentősen erőforrás-igényesebb a hívások száma miatt.

Fragment Shader kódpéldák

Fragment Shader lehet egyszerű (textúra lekérés) vagy összetett (többrétegű világítás). Vizsgáljunk meg két gyakorlati példát: alap textúrázás és gradienseffektus idő használatával.

Alap textúrázás GLSL-ben

#version 300 es
precision mediump float;
in vec2 vTexCoord;
in vec3 vColor;
uniform sampler2D uDiffuseMap;
out vec4 fragColor;

void main() {
    vec4 texColor = texture(uDiffuseMap, vTexCoord);
    fragColor = texColor * vec4(vColor, 1.0);
}

Példa Metal Shading Language-ben

#include <metal_stdlib>
using namespace metal;

struct FragmentIn {
    float2 texCoord;
    float3 normal;
};

fragment float4
fragmentMain(FragmentIn in [[stage_in]],
              texture2d<float> tex [[texture(0)]]) {
    constexpr sampler s(filter = linear);
    float4 color = tex.sample(s, in.texCoord);
    return color;
}