En preprosessor er et verktøy som utvider mulighetene til CSS ved å legge til ekstra funksjoner og egenskaper. Det er en fil med kode som kompileres til CSS. Preprosessorer tilbyr ulike funksjoner, inkludert variabler, nøsting, funksjoner, mixins og lignende.

Noen populære preprosessor-språk for CSS inkluderer Sass, Less og Stylus. Disse preprosessor-språkene er utviklet for å gjøre CSS mer effektivt og enklere å arbeide med, og brukes av mange utviklere i store prosjekter.

Det er ingen vesentlig forskjell mellom dem. Hovedkonseptet er det samme, så vi vil vurdere alle fordelene med preprosessorer ved hjelp av eksempler fra sass.

Fordeler

• Prosjektstrukturering – Kode kan skrives i ulike filer og mapper, noe som gjør strukturen ryddig og forutsigbar;
• Funksjonalitet – Kode kan skrives mer håndterbart og effektivt takket være ekstra funksjonalitet fra preprosessoren;
• Kompatibilitet – sass-syntaks er fullt kompatibel med eksisterende css-regler, slik at ferdig css-kode kan inkluderes i en sass-fil, men ikke omvendt.

Ulemper

• Syntaks – Det kreves tid for å lære syntaksen og venne seg til den ekstra funksjonaliteten;
• Kompilering – Det må gjennomføres et ekstra steg for å konvertere sass til css.