En shader är ett litet datorprogram som exekveras direkt på grafikprocessorn och styr både var objekt placeras på skärmen och vilken färg varje pixel får. Sådana program står bakom allt från speglande vattenytor i påkostade spel till de omtyckta shader-paketen för Minecraft. Den här handledningen förklarar begreppet shader, skillnaderna mellan vertex shaders och fragment shaders samt hur du skapar din första egen shader.
- Vad
- Program som körs på grafikkortet
- Vanligaste typerna
- Vertex shader och fragment shader
- Språk
- GLSL i OpenGL och WebGL, HLSL i bland annat Unity
- Kodexemplen
- WebGL 2 stödjer GLSL ES 3.00
- Minecraft
- Shader-paket installeras via Iris eller OptiFine i Java Edition och via Vibrant Visuals i Bedrock Edition
Vad är en shader?
Enligt Mozillas dokumentation för webbutvecklare är en shader en funktion som krävs för att något ska ritas på skärmen. Den körs på grafikkortet, som är optimerat för just den typen av beräkningar, så att centralprocessorn kan koncentrera sig på andra uppgifter i spelet. Shaders skrivs i specialiserade programmeringsspråk med likheter till C och bygger ofta på matematiska operationer med vektorer och matriser.
Skillnaden mellan shaders och vanlig programkod är att shaders körs parallellt. Eftersom ett grafikkort innehåller ett stort antal små processorer kan samma shaderkod utföras parallellt för tusentals hörn eller miljontals pixlar. The Book of Shaders jämför detta med skillnaden mellan att skriva ett brev för hand och att trycka många exemplar med Gutenbergs tryckpress. Snabbheten kräver dock att varje enskild körning är oberoende av de andra och inte behåller någon information mellan anrop.
Från hörn till pixlar: hur shaders fungerar
När ett spel renderar en bild skickas hörnen i modellerna genom flera steg på GPU:n. I WebGL och OpenGL ES 3.0 kan du själv skriva två av dessa steg: vertex shadern och fragment shadern. Enligt GLSL ES 3.00-specifikationen kompileras exakt en vertex shader och en fragment shader och länkas sedan till ett gemensamt shaderprogram.
Vertex shader
En vertex shader körs en gång per hörn och tar emot information som position, normalvektor och texturkoordinater. Utifrån det beräknar den var hörnet ska placeras på skärmen genom att tilldela ett värde till den inbyggda variabeln gl_Position. Specifikationen understryker att den bara ser ett enda hörn åt gången. Det gör vertex shaders lämpliga för att transformera modeller genom att flytta, rotera eller projicera dem samt för att animera detaljer som grässtrån eller vattenytans rörelse.
Fragment shader
Efter att vertex shadern har bearbetat hörnen delas trianglarna upp i fragment, ungefär ett per pixel. Fragment shadern exekveras separat för varje fragment och avgör dess slutgiltiga färg. Den har ingen möjlighet att flytta fragmentet eller läsa värden från närliggande fragment. Beräkningar av ljus, skuggor, texturer samt visuella effekter som eld och vatten utförs vanligtvis i detta steg.
| Egenskap | Vertex shader | Fragment shader |
|---|---|---|
| Körs | En gång per hörn | En gång per fragment, ungefär per pixel |
| Viktigaste resultat | Hörnets position i gl_Position | Fragmentets färg |
| Ser | Ett hörn i taget | Ett fragment i taget, utan grannar |
| Typisk användning | Flytta, vrida och böja geometri | Ljus, texturer, färg och effekter |
Attribut, uniforms, in och out
En shader tar emot data på tre olika sätt. Attribut innehåller värden för varje hörn såsom position och läses endast av vertexshadern. Uniforms tilldelas från det omgivande programmet och gäller identiskt för alla hörn och pixlar under ett enskilt anrop, exempelvis tid, skärmupplösning eller en kameramatris. Variabler som överförs från vertexshadern till fragmentshadern kallas varyings i äldre versioner av GLSL men deklareras med nyckelorden out respektive in i GLSL ES 3.00. Dessa värden interpoleras automatiskt mellan hörnen, vilket möjliggör mjuka färgövergångar över en triangel.
Din första fragment shader
Koden i exemplet är skriven i GLSL ES 3.00, det språk som används i WebGL 2. Den första raden måste vara #version 300 es, annars tolkas koden som den äldre versionen 1.00.
#version 300 es
precision highp float;
uniform vec2 u_resolution;
uniform float u_time;
out vec4 fragColor;
void main() {
vec2 st = gl_FragCoord.xy / u_resolution;
float blue = 0.5 + 0.5 * sin(u_time);
fragColor = vec4(st.x, st.y, blue, 1.0);
}Variabeln gl_FragCoord innehåller fragmentets koordinater i fönstret. Genom att dividera detta värde med upplösningen får du ett normaliserat resultat mellan 0 och 1 i båda riktningarna, vilket gör att rött ökar från vänster till höger, grönt nerifrån och upp medan blått pulserar i takt med tiden.
Precisionsraden är obligatorisk eftersom fragmentshaders i GLSL ES inte har någon förinställd flyttalsprecision. Variablerna u_resolution och u_time är uniforms som det yttre programmet levererar till shadern. The Book of Shaders använder samma benämningar men följer den äldre syntaxen med gl_FragColor, en variabel som saknas i GLSL ES 3.00, där man i stället måste deklarera en egen utgående variabel med nyckelordet out.
#version 300 es
in vec3 position;
uniform mat4 u_modelViewProjection;
void main() {
gl_Position = u_modelViewProjection * vec4(position, 1.0);
}Vertexshadern ovan är så enkel det går och multiplicerar bara hörnets koordinater med en matris som kombinerar modellens placering, kamerans vy och projektionen. I three.js implementerar du anpassade shaders via ShaderMaterial, som automatiskt inkluderar vanliga attribut och uniforms. Om du i stället väljer RawShaderMaterial måste du själv deklarera allt detta. Alternativet glslVersion styr om koden tolkas som GLSL 1 eller GLSL 3.
Shaderspråk i spelmotorer
GLSL är standardspråket för OpenGL, OpenGL ES och WebGL. Unity använder i stället HLSL tillsammans med sitt eget shaderformat ShaderLab. Plattformen erbjuder även verktyget Shader Graph, där du konstruerar shaders genom att koppla samman grafiska noder utan att skriva kod. Grundkonceptet är likartat över alla system: en del hanterar hörn och en annan beräknar färger, båda körs parallellt på GPU:n.
Shaders i Minecraft
Många som söker på shaders vill få Minecraft att se bättre ut. I Minecraft betyder ordet oftast ett shader-paket, en samling shaders som byter ut spelets ljus, skuggor, vatten och himmel. Hur du får det beror på vilken utgåva du spelar.
Java Edition: Iris eller OptiFine
Java Edition kräver ett tillägg för att kunna ladda shader-paket. OptiFine är ett äldre tillägg som både förbättrar prestandan och stödjer shaders. Ett modernare alternativ är Iris, ett öppen-källkodsprojekt som enligt Iris egen webbplats stödjer Minecraft 1.16.5 och senare versioner. Iris finns tillgängligt för Fabric och från version 1.21.1 även för NeoForge. Det installeras tillsammans med Sodium för snabbare rendering. De flesta shader-paket som är utvecklade för OptiFine fungerar även i Iris, men de två tilläggen kan inte aktiveras samtidigt.
- Installera IrisStarta installationsprogrammet från Iris webbplats, välj din Minecraft-version och klicka på knappen för att installera. Sodium inkluderas automatiskt.
- Hämta ett paketLadda ner ett shader-paket från en pålitlig källa och verifiera att det är kompatibelt med din Minecraft-version.
- Lägg in paketetÖppna videoinställningarna, gå till Shader Packs och klicka på Open Shader Pack Folder. Kopiera filen till den öppnade mappen.
- AktiveraVälj shader-paketet i listan och klicka på Apply. Tryck på tangenten K för att slå på eller av shaders under spel.
Med Iris öppnar tangenten O shader-menyn ovanpå spelet så att du omedelbart ser effekterna av dina ändringar. Trycker du på R laddas det aktiva shader-paketet om, vilket underlättar när du justerar koden själv.
Bedrock Edition: Vibrant Visuals
I Bedrock Edition finns Mojangs egen grafikuppgradering Vibrant Visuals, som lanserades den 17 juni 2025. Den introducerar funktioner som riktat ljus, volymetrisk dimma, skuggor som kastas av varje block och vattenreflexer. Uppgraderingen stöds på Xbox Series X|S, Xbox One, PlayStation 4 och 5, Android, iOS samt pc, där spelet måste köras med DirectX 12. Enligt Mojang påverkar Vibrant Visuals endast visuella aspekter och inte spelmekaniken, vilket innebär att spelare med och utan aktiverad uppgradering kan spela tillsammans.
Mojang meddelade i april 2025 att Vibrant Visuals även kommer att stödjas i Java Edition och att första åtgärden är en ombyggnad av spelets renderingsmotor. Förändringarna kommer att släppas stegvis, först i testversioner kallade snapshots och sedan i stabila versioner.
Shaders kräver beräkningskraft. Ett avancerat shader-paket belastar grafikkortet kraftigt. Om spelet laggar eller hackar bör du prova ett enklare paket eller minska renderingsavståndet. Hämta shaders och tillägg endast från officiella källor eller etablerade samlingssidor.
Lär dig mer om shaders
Att lära sig hur shaders fungerar går bäst genom att redigera dem och observera resultatet. Kapitlet som förklarar vad en shader är i The Book of Shaders ger en bra grund innan du undersöker uniforms och geometriska former.
Webbplatsen inear.se erbjuder flera praktiska exempel. Fireshader demonstrerar hur en sfär fått eldeffekter med three.js och anpassade shaders. Guiden om Perlin noise beskriver det slags brus som ofta används för att generera moln, eld och terräng i shaders. I interior mapping i Unity simulerar en shader hela rum bakom fönster utan att rummen finns i scenen. Om begrepp som hörn, polygoner och renderloop är nya för dig är en kort introduktion till 3D en bra utgångspunkt.
Vanliga frågor om shaders
Vad är en shader enkelt förklarat?
Ett litet program som körs direkt på grafikprocessorn och beräknar både var objekt placeras på skärmen och vilken färg varje pixel ska ha. Programmet exekveras samtidigt för ett stort antal hörn eller pixlar.
Vad är skillnaden mellan vertex shader och fragment shader?
Vertexshadern exekveras en gång för varje hörn och beräknar dess position i bildplanet. Fragmentshadern körs däremot en gång per fragment (ungefär en pixel) och avgör dess färg.
Vilket språk skrivs shaders i?
GLSL används i både OpenGL och WebGL och har en syntax som liknar C. Unity använder i stället HLSL och erbjuder verktyget Shader Graph för användare som föredrar visuell programmering framför kod.
Hur installerar man shaders i Minecraft?
I Java Edition använder du ett tillägg som Iris och placerar shader-paketet i den mapp som visas när du klickar på Shader Packs i videoinställningarna. Därefter aktiverar du det valda paketet genom att trycka på Apply.
Vad är Vibrant Visuals i Minecraft?
En officiell grafikförbättring från Mojang för Bedrock Edition som inkluderar riktad belysning, volymetrisk dimma och vattenreflexer. Den lanserades den 17 juni 2025.
Gör shaders spelet långsammare?
Ja, tunga effekter kräver mer av grafikkortet. Hur mycket beror på paketet, upplösningen och hur kraftfull datorn är.
Källor
- MDN: GLSL Shaders
- MDN: Data in WebGL
- Khronos: The OpenGL ES Shading Language, version 3.00
- The Book of Shaders: Getting started, what is a shader?
- The Book of Shaders: Uniforms
- three.js docs: ShaderMaterial
- Unity Manual: Shaders
- Iris Shaders
- Iris Shaders: Download
- Iris: användarguide på GitHub
- OptiFine
- Minecraft.net: Vibrant Visuals, 22 mars 2025
- Minecraft.net: Chase the Skies and Vibrant Visuals playable today, 17 juni 2025
- Minecraft.net: Vibrant Visuals on Java Edition, 16 april 2025
Uppgifterna kontrollerades 28 oktober 2026.