Esikäsittelijä on työkalu, joka laajentaa CSS:n ominaisuuksia lisäämällä uusia toimintoja ja mahdollisuuksia. Se on tiedosto, joka sisältää koodia ja käännetään CSS:ksi. Esikäsittelijät tarjoavat erilaisia ominaisuuksia, kuten muuttujat, sisäkkäisyys, funktiot, mixinit jne.

Joitakin suosittuja CSS-esikäsittelijäkieliä ovat Sass, Less ja Stylus. Nämä esikäsittelijäkielet on suunniteltu tekemään CSS:stä tehokkaampaa ja helpompaa käyttää, ja monet kehittäjät hyödyntävät niitä laajoissa projekteissa.

Merkittäviä eroja niiden välillä ei ole. Pääperiaate on sama, joten tarkastelemme esikäsittelijöiden etuja sass-esimerkin avulla.

Edut

• Projektin jäsentely – Koodia voidaan kirjoittaa eri tiedostoihin ja kansioihin, mikä tekee rakenteesta selkeän ja ennakoitavan;
• Toiminnallisuus – Koodin kirjoittaminen on hallittavampaa ja tehokkaampaa esiprosessorin lisätoimintojen ansiosta;
• Yhteensopivuus – sass-syntaksi on täysin yhteensopiva olemassa olevien css-sääntöjen kanssa, joten valmista css-koodia voidaan sisällyttää sass-tiedostoon, mutta ei toisinpäin.

Haitat

• Syntaksi – Syntaksin opetteluun ja lisätoimintojen omaksumiseen täytyy käyttää aikaa;
• Kääntäminen – Sass täytyy muuntaa css:ksi yhtenä lisävaiheena.