SASS

Z technicznego punktu widzenia, SASS (Syntactically Awesome Style Sheets) jest tzw. preprocessorem dla standardowego CSS’a, czyli jego wzbogaceniem o część mechanizmów używanych w tradycyjnych językach programowania. W poczet takiej listy wpisać można bardzo wiele funkcji, niedostępnych w standardzie CSS3. Pisany przez programistę kod jest następnie przetwarzany zgodnie z nową składnią, a w efekcie końcowym następuje jego kompilacja do standardu kodu natywnego. Jest to niezwykle istotny proces, ponieważ musi zapewnić zgodność ze wszystkimi przeglądarkami internetowymi.

Bardzo istotnym czynnikiem SASS jest składnia, pozwalająca na tworzenie kodu zarówno SASS oraz SCSS. Podstawową różnicą pomiędzy SASS, a SCSS jest forma w jakiej definiowane są bloki. W pierwszym przypadku stosowane są wcięcia, natomiast dla SCSS wykorzystywane będą nawiasy klamrowe, podobnie jak w przypadku standardowego kodu CSS.

Nasza Agencja w praktyce wykorzystuje SASS w połączeniu z Gulpem, który automatyzuje pracę programistów, polegająca na kompilacji kodu. Dzięki specjalnej wtyczce gulp-sass, kompilacja kodu odbywa się błyskawicznie po wpisaniu jednej linijki kodu.

Jednym z atutów SASS jest zaawansowane zagnieżdżanie logiczne, poprawiające nie tylko czytelność kodu, ale również znacząco zmniejszające jego objętość. W efekcie kod źródłowy jest wykonywany szybciej aniżeli w swojej podstawowej postaci.

Na uwagę zasługują także tzw. wstawki, które pozwalają na globalne odnoszenie się do poszczególnych fragmentów kodu. Wstawki deklarujemy używając @mixin, a odwołania do nich poprzedzamy sformułowaniem @include. Jest to niezwykle istotne w momencie, kiedy mamy do czynienia z arkuszem stylów rozbitym na kilka osobnych plików lub nasz kod CSS posiada bardzo dużą ilość linijek. SASS wspiera dziedziczenie, co pozwala na skuteczną eliminację powtórzeń fragmentów kodu.