LESS

LESS je dynamicky před-procesovací stylový jazyk, který může být kompilován do CSS (Cascading Style Sheets). Může být spouštěn na straně klienta nebo serveru. Navrhl ho Alexis Sellier a byl ovlivněn SASSem a zároveň ovlivnil novou SCSS syntax SASSu, která využívá blokovou syntax podobnou CSS.

LESS je open-sourcový a byl původně naprogramován v Ruby, v pozdějších verzích bylo ale použití Ruby nahrazeno JavaScriptem. Less je vnořený metajazyk, protože validní CSS soubor je zároveň validním LESS kódem se stejnou sémantikou. LESS v sobě zahrnuje následující prvky: proměnné, vnoření, mixiny, operátory a funkce. Hlavním rozdílem mezi LESS a ostatními před-procesory CSS je to, že LESS umožňuje kompilaci v reálném čase za využití less.js přímo v prohlížeči.

Porovnání se SASS

SASS i LESS jsou před-procesory CSS, které umožňují psaní čistého CSS v programovacím konstruktu na místo statických pravidel.

LESS se SASSem inspiroval. SASS byl původně navržen tak, aby zjednodušil a zároveň rozšířil CSS, proto odstranil ze zápisu složené závorky. LESS byl na druhou stranu navržen tak, aby byl co nejpodobnější CSS, což vedlo k tomu, že CSS může být použito jako validní LESS kód.

Tím se následně inspiroval i SASS, do kterého byla zavedena druhá alternativa syntaxi označená SCSS neboli Sassy CSS.

Použití na stránkách

LESS může být na stránkách použit různými způsoby. Jednou z možností je vložil less.js soubor v JavaScriptu, který kód konvertuje v reálném čase a prohlížeč pak vrací výstupy v CSS. Další alternativou je převést LESS kód do čistého CSS a následně na stránku nahrát toto čisté CSS. Při této možnosti nejsou nahrány přímo na stránku žádné .less soubory a není potřeba JavaScriptový konvertor less.js.

Výhody použití LESS

• LESS je CSS před-procesor. Po kompilaci dokáže vygenerovat čisté CSS, které funguje napříč všemi prohlížeči.
• LESS podporuje kompatibilitu napříč prohlížeči.
• LESS kód je jednoduchý, čistý a dobře zorganizovaný díky vnořování.
• Udržování LESS kódu je rychlejší, protože umožňuje využití proměnných.
• LESS nabízí seznam operátorů, což zrychluje psaní kódu a šetří tak čas při vývoji.
• LESS zjednodušuje znovupoužití celých tříd tím, že na ně může jednoduše odkázat v sadě pravidel.
• LESS je novější a oproti konvenčnímu CSS preferovaný jazyk, protože redukuje časově náročné psaní stylů.
• Mixiny napomáhají vyřešit znovupoužitelnost kódu a přenesou vlastnosti jedné třídy na jinou třídu jednoduchým zahrnutím jména této třídy do svých vlastností.
• LESS má mnoho matematických operací a operačních funkcí, jako je například ztmavit nebo zesvětlit.
• Je možné do LESS souboru importovat další LESS soubory, což umožňuje znovupoužití proměnných z těchto souborů.
• LESS obsahuje předdefinované funkce, ale zároveň umožňuje programátorovi nebo designerovi aby si definoval vlastní funkce, které pak může používat napříč kódem.
• LESS se kompiluje rychleji nežli ostatní CSS před-procesory.
• LESS podporuje funkcionalitu líného načítání, což znamená, že soubor může definovat proměnné kdekoliv, před i za prvním použitím této proměnné.

Nevýhody použití LESS

• Je potřeba strávit nějaký čas jeho učením.
• LESS má k dispozici méně frameworků nežli jeho starší předchůdci, jako je například SASS, který obsahuje frameworky jako je Compass, Gravity nebo Susy.
• V LESS jsou moduly úzce provázány, proto je náročnější znovu použít moduly nebo otestovat závislé moduly.
• Hledání chyb je náročné, protože vzhledem k tomu, že je potřeba projít kompilací, čísla CSS řádků, kde se nachází chyba, nejsou směrodatné.
• Kompilace vývoj zpomaluje. Čekání na kompilaci je oproti čistému CSS krok navíc, který také zabírá čas.
• Výkon. Zdrojový soubor může být malý, ale vygenerované CSS může být rozsáhlé.