Přejít k navigační liště

Zdroják » Webdesign » LESS: stejné CSS za méně peněz

LESS: stejné CSS za méně peněz

Články Webdesign

Kaskádové styly jsou dnes až na výjimky přijímány jako standard pro popis vizualizace formátu hypertextových dokumentů. Koncepce jednoduchého popisu s sebou ale nese některé nevýhody, které se snaží překonat různé nadstavby a preprocesory. Jedním z nich je LESS, který si představíme v dnešním článku.

LESS, tedy Leaner CSS, je knihovna, která je možná známa programátorům v Ruby. Zavádí do CSS některé vlastnosti, známé z programovacích jazyků, jako jsou „proměnné“, „výrazy“ nebo „makra“ (termíny berte, prosím, v uvozovkách). Kromě implementace v samotném Ruby je dostupná i implementace v JavaScriptu, kterou publikoval Dmitrij Fadějev pod názvem less.js, nebo PHP implementace LESS PHP.

K čemu je LESS?

Začneme nikoli teorií, ale skočíme přímo in medias less. S preprocesorem LESS můžeme napsat CSS pravidla např. takto:

@the-border: 1px;
.rounded_corners (@radius: 5px) {
  -moz-border-radius: @radius;
  -webkit-border-radius: @radius;
  border-radius: @radius;
}
#header {
  color: @base-color * 3;
  border-left: @the-border;
  border-right: @the-border * 2;
  .rounded_corners;
}
#footer {
  .rounded_corners(10px);
}

I bez hlubšího vysvětlování je každému, kdo se kdy setkal s programováním, zhruba zřejmé, oč se tu jedná. V jedné ukázce je vidět vytvoření „pojmenované konstanty“ @the-border, pojmenované sady pravidel („makra“) .rounded_corners, včetně použití parametru @radius s přednastavenou hodnotou, a jejich využití.

Podobný zápis samosebou nedokáže prohlížeč sám o sobě zpracovat. O přetvoření výše uvedeného zápisu na čisté CSS se stará právě preprocesor LESS. Vznikl, jak jsme si už řekli, v prostředí Ruby (jeho předchůdcem byl např. známý Sass) a záměrem autorů bylo zjednodušit zápis pravidel v CSS a především usnadnit jejich správu zavedením některých principů, známých z programovacího jazyka.

Prasárna!

Slovo z mezititulku se v komentářích na Zdrojáku vyskytuje poslední dobou velmi často; téměř pravidlem bývá u neobvyklých řešení. Tohoto hrdého označení se tak dostává všem tématům, co jsou nová, nečekaná, inovativní či zkrátka „jiná“. Byl jím poctěn JavaScript, Node.js, a ani LESS nezůstal stranou (viz). K tomuto přístupu se ještě někdy vrátíme a zasadíme si jej do kontextu vývojářství; teď se spíš věnujme tomu, zda je LESS opravdu, řekněme, ideově pochybený a špatný.

Diskuse o tom, zda do CSS zavést proměnné, výrazy či makra probíhají už mnoho let a padá v nich mnoho argumentů pro i proti. Zjednodušeně řečeno jsou pro ti, co s tím musí denně pracovat, proti pak ti, kterým leží na srdci formální čistota jazyka. Autoři LESS patří evidentně do té první kategorie.

Každý CSS kodér ví, že stylopis bývá plný například „magických konstant“, rozmístěných na různých místech, leckdy i v různých souborech, a případná změna tak není vždy triviální; leckdy změna jednoho rozměru jednoho prvku znamená dopočítávání okrajů u několika dalších prvků, změnu odsazení u jiných a další čas na odladění. U středně rozsáhlého projektu se vždy vynoří otázka „Změnil jsem to opravdu všude, kde je potřeba?“ A právě pro takové situace je vhodné použití CSS preprocesoru.

Použití preprocesoru je i v CSS stejné jako v jakémkoli jiném jazyce: Zjednodušuje zápis, a tím i správu některých konstrukcí, za cenu toho, že před vlastním zpracováním je nutné „předzpracování“, které tyto konstrukce nahradí validním zápisem. Možná to někomu připadá jako „znásilňování principů jazyka“, ale je na místě připomenout, že makra, konstanty, podmíněné bloky či vkládání souborů (#include), bez nichž si nedovedeme představit programování v jazyce C, byly původně také řešeny preprocesorem cpp – tolik k ideové čistotě použití preprocesoru.

A teď se s těmi, kterým leží na srdci spíš snadná použitelnost a správa zdrojových kódů než ideová čistota použitých prostředků, podíváme na možnosti LESS.

Co přináší LESS pro CSS kodéry?

Preprocesor LESS nabízí možnost zapsat do CSS kódu proměnné, makra, zanořené definice a další věci, které bychom mohli považovat za „syntaktický cukr“. Nepřidává tedy nové funkce pro popis vzhledu, ale zjednodušuje či zpřehledňuje v některých případech zápis pravidel.

Proměnné

Měli bychom spíš říct „pojmenované konstanty“, ale terminologie dokumentace LESS hovoří o proměnných (variables), přidržíme se tedy jí. V dokumentaci je uveden příklad, z něhož je patrný zápis i použití proměnných:

@nice-blue: #5B83AD;
@light-blue: @nice-blue + #111;
#header { color: @light-blue; }

Jméno proměnné (pojmenované konstanty, viz výš) začíná znakem @ a podléhá stejným pravidlům jako např. jména tříd. Za jménem je dvojtečka a hodnota, ukončená středníkem. Hodnotou může být i jednoduchý výraz. Ve výše uvedeném příkladu bude mít proměnná @light-blue hodnotu proměnné @nice-blue, zvýšenou o #111 (což je zkrácený zápis pro #111111). poslední řádek bude tedy vyhodnocen jako

#header { color: #6c94be; }

Mixins

Autoři označují tuto vymoženost slovem „mixins“, my si můžeme její fungování přiblížit termínem makro s parametrem.

Bez parametru je zápis mixinu stejný jako zápis pravidel pro určitou třídu či id. Můžeme zapsat jedno či více pravidel, a pak je použít jako „pojmenovanou sadu“. Například:

.okraje { border-top: 2px dotted black;
          border-bottom: 2px dotted blue;
        }
#header li {
             color: #eee;
             .okraje;
           }

Tedy lze sadu pravidel pro nějakou třídu (či id) vložit přímo do jiné sady pravidel. Mixin může mít parametry, jako v následujícím příkladu:

.debug (@barva: #f00) {
          border: 2px solid @barva;
        }
#header li {
             color: #eee;
             .debug;
           }
#content p {
             .debug(#00f);
           }

Můžeme tak snadno zapisovat nejen sady pravidel s různými vendor prefixy, jak bylo naznačeno v úvodním příkladu na začátku článku, ale můžeme jej např. použít pro ladění – v ostré verzi bude seznam pravidel pro třídu .debug prázdný a do výsledného CSS kódu se „ladicí okraje“ nevloží.

Vnoření pravidel

Další „syntaktický cukr“ zjednodušuje zápisy dlouhých selektorů, jako jsou např.:

#header { color: black; }
#header .navigation {
  font-size: 12px;
}
#header .logo {
  width: 300px;
}
#header .logo:hover {
  text-decoration: none;
}

S LESS je můžeme zapsat takto:

#header {
  color: black;
  .navigation {
    font-size: 12px;
  }
  .logo {
    width: 300px;
    :hover { text-decoration: none }
  }
}

Ve výsledném CSS bude taková konstrukce samosebou převedena na tu výše uvedenou. Tato konstrukce by se dala považovat s trochou nadsázky za zavedení principu DRY do CSS.

Výrazy

LESS umí počítat jednoduché matematické výrazy, přičemž rozlišuje jednotky, rozlišuje i barvy a rozměry, takže se vám nepodaří např. sčítat „5px + blue“. Ale můžete zapsat „1px + 5“ (=6px), můžete použít „#888 / 4“ nebo výše uvedené zesvětlení barvy přes „@nice-blue + #111“. Ve výrazech můžete použít čísla, barvy i proměnné.

Komentáře

Kromě komentářů známých z CSS, které jsou zapsané pomocí /* ... */, dovoluje LESS zapsat jednořádkový komentář v syntaxi známé z C-like jazyků, tedy pomocí dvou lomítek  na začátku řádku.

Vkládané soubory

Jako každý správný preprocesor umí i LESS vkládat jiné soubory. Slouží k tomu direktiva @import "..." a její syntaxe je jednoduchá:

@import "definice";
@import "fonty.css";

Pokud má vkládaný soubor doporučenou příponu „.less“, nemusíme ji uvádět.

Pokročilé možnosti

Zatím jsme si uvedli jednoduché vlastnosti LESS, které, s trochou nadsázky řečeno, zvládne i lepší editor se sadou maker. LESS však nabízí i některé vlastnosti, spojované spíš s programovacími jazyky, jako jsou jmenné prostory a oblast viditelnosti.

Lokální proměnné

Proměnné v LESS mají svou „oblast viditelnosti“ podobně jako v programovacích jazycích, kdy proměnná, definovaná v bloku, má přednost před globální. Stejně tak v LESS dostává přednost proměnná, definovaná v mixinu, před tou globální:

@pozadi: red;
#content {
    @pozadi: white;
    p {
         background-color: @pozadi;
      }
}

Jmenné prostory

Pomocí jmenných prostorů můžeme sady pravidel, proměnných či mixinů spojovat do „pojmenovaných balíčků“. Syntaxe je opět poměrně intuitivní:

#UIformular {

  .button {
    font-size: 12px;
    border: 3px solid #eee;
    :hover {font-weight: bold;}
  }
  input { ... }
  label { ... }
}
#menu ul li a {
    color: #335;
    #UIformular > .button;
}

Struktury

LESS obsahuje i náznak struktur – v jmenném prostoru lze definovat proměnné či konstanty a k nim pak přistupovat jako k hodnotám. Dokumentace opět uvádí příklad:

#defaults {
  @width: 960px;
  @color: black;
}
.article { color: #294366; }
.comment {
  width: #defaults[@width];
  color: .article['color'];
}

Jak to použít?

Pokud chcete při kódování použít LESS, můžete zvolit několik způsobů, jak s ním naložit. Můžete psát soubory .less a ty před testem pomocí řádkové utility převést na CSS (např. jako hook při commitu). Můžete je nahrávat přímo na server a tam je on-the-fly konvertovat pomocí skriptu na CSS (a cachovat, samosebou). Nebo můžete použít i řešení na straně klienta, posílat mu přímo styly v less ( <link rel="stylesheet/less" ...>) a pomocí less.js je konvertovat až v prohlížeči u uživatele.

Co s LESS?

Je na každém kodérovi, jak k LESS přistoupí. Někdo může vnímat podobné snahy jako neústrojné nekompatibilní nekodifikované zpotvořenosti, které jdou proti duchu jazyka – v takovém případě na LESS zapomeňte. Pokud na LESS nahlížíte jako na další příležitost, kde řešit cizí chyby, vyhněte se mu taky. Pro jiné ale mohou být funkce tohoto preprocesoru cenné, buď tím, že jim ušetří a zjednoduší práci, nebo třeba i tím, že něco podobného sami řeší či hodlají řešit a hledají vhodný nástroj.

LESS lze použít, jak jsme si řekli, jak v prohlížeči, tak na serveru, ale může ho použít i kodér sám pro sebe, mít .less soubory jen jako své zdroje a před odesláním klientovi je převést na tradiční CSS. Pro klienta se tím nic nezmění, nepřijde o možnost vlastních úprav, není potřeba řešit, že „zákazníkův nový kodér nezná syntaxi LESS“ – a přitom lze využít všech výhod, které LESS nabízí, od snazšího zápisu po jednodušší údržbu kódu. Což je v mnoha případech výhoda, která bohatě vyváží nutnost překladu LESS na CSS i pohoršení jazykových puristů. Ostatně: nikdo nemusí vědět, jak si usnadňujete práci.

Komentáře

Subscribe
Upozornit na
guest
43 Komentářů
Nejstarší
Nejnovější Most Voted
Inline Feedbacks
View all comments
mat

diky za clanek! moc me to zaujalo. Teoretici zrejme budou mit plno vyhrad, ale my praktici neco podobneho hodne potrebujeme. Ja to resim vetsinou php a pak vkladam casti css kodu, ktere to vyzaduji do hlavicky html, ale neni to idealni.

jdu to hned vyzkouset.

blizzboz

ja všetko riešim cez PHP, spájam všetky CSS súbory do jedného aby som znížil počet HTTP požiadavok, komprimujem CSS a zobrazujem ho z chace, môj CMS dokonca zvláda aj výnimky pre rôzne prehliadače atď atď, LESS je podľa mňa len zbytočnosť veď všetko sa dá riešiť omnoho robustnejšie.

bohyn

Díky za info. Kolikrát sem už přemýšlel o tom si něco takovýho sám napsat.

Josef Richter

Vždycky, když tě napadne, že by sis mohl něco sám napsat, tak je dobrý nejdřív trochu zagooglit ;-) V 99% případů zjistíš, že už to někdo napsal. Navíc tohle přece nejsou žádný žhavý novinky. Haml & Sass se používají už několik let, Less (což je obdoba Sass) je taky minimálně rok starej.

blizzboz

ale keď si niečo napíšeš sám tak si to môžeš urobiť presne na mieru.

Oldis

minimalne ale podle svych zvyklosti a navyku.

Ivan Nový

deklarativně popisovat procedurální chování je prasárna.

xurfa

A kde popisuje CSS a HTML „proceduralni chovani“? He?

Ivan Nový

třeba hover. Jinak všude. Je to vlastně definičně zamrzlé volání funkcí konstruujících DOM. Taky z toho plyne chaos, který vytváří tvůrci prohlížečů. V rámci konkurenčního boje vytvářejí vlastní „zadrátované“ definiční tvary, aby se odlišili od konkurence. Na úrovni procedur to není nikdy tak dramatické, protože proceduru můžete vždy v rámci jazyka a tedy čistě nahradit. Navíc definiční pojetí nic neusnadňuje, každá definice je stejně prohlížečem převedena do volání procedury.

v6ak

Takže takové data binding je taky prasárna?

Ivan Nový

No to je ale něco jiného, protože se to děje standardními prostředky jazyka, proto je to vždy možno předefinovat podle potřeby, to u CSS ale není možné, stáváte se otrokem autora prohlížeče. A praxe je taková, protože takový je i reálný svět, že potřebujete udělat i věci, na které autor prohlížeče nepomyslel, protože vás k tomu žene zase vaše konkurence. No i program samotný jsou strukturovaná data, takže by se dala určitá omezená třída programů psát bez použití programových smyček. A to je přesně situace CSS, program bez cyklů. Jenže to už dnes nestačí, vzhledem k tomu, k čemu se CSS používá. Prohlížené dokumenty nemají už povahu dokumentů (strukturovaných dat bez programových smyček), ale aplikací popsaných pseudostruktu­rovanými daty.

mat

vyvetrejte si a zacnete delat neco uzitecnejsiho nez je teoretizovani prosim!

Ivan Nový

Na začátku bylo vše jen teoretizování :-)

v6ak

Ačkoli to může vypadat, že generování kódu přináší jen samá pozitiva, má to i svoje hranice, které je dobré si uvědomit. Generuji-li kód, pak je vhodné pracovat pouze s původním kódem a ne s tím vygenerovaným, jinak je možné při dalších úpravách narazit. Úprava toho původního kódu se totiž obvykle nemůže projevit ve výsledném, aniž by zrušila všechny jeho úpravy.

Více jsem se o tom před časem rozepsal na http://v6ak.profitux.cz/clanky/proc-negenerovat-zdrojovy-kod.php .

Spud

Jen pro informaci, nasel jsem i .NET implementaci, i kdyz ne primo od stejnych autoru. Ale muze se nekomu hodit.
viz
http://blog.smoothfriction.nl/archive/2009/08/13/lesscss-the-.net-edition.aspx
http://github.com/erikvanbrakel/less.net/

v6ak

Nezkoušel jsem, ale možná se bude hodit v nejen mi: http://www.asual.com/blog/lesscss/2009/11/05/less-for-java.html

Ja

Asi by mne dost mátlo, že „jazyk“ less používá stejné či podobné prvky jako selektory css – sice v místech kde selektory nejdou běžně použít, ale pro rychlou orientaci ve stylesheetu je to dost nepřehledné. Třeba http://sandbox.pocoo.org/clevercss/ mi připadá přehlednější (podotýkám, že nejsem zarputilý pythonář :-).

On

Pak doporučuju podívat se i na SASS, který je v Ruby a nabízí stejnou formu zápisu (vedle .SCSS což má zase blíže k LESS), nicméně je aktivněji vyvýjený a nabízí velký ekosystém rozšíření. Když se k tomu připojí Compass, a na to nějaký CSS framework, je to nedostižná kombinace.

jardam

Pro projekťáky: ze zkušenosti můžu říct, že díky LESS se člověku absolutně neznalému CSS výrazně zkrátila doba zaučení. Stačí všude dodržovat kaskádování a odpadnou začátečnické problémy s dědičností a bordelem v kódu (ano, za cenu trochu většího výsledného objemu atd.).

Jakub Nešetřil

Používám LESS intezivně už přes půl roku (developer.go­oddata.com, wrathjs.com a jiné) a jsem z něj dost nadšený. Pár postřehů pro diskutující:

  • Obecně indirekci a překlad jednoho jazyka do druhého moc nakloněný nejsem, ale na LESS je pěkné, že to je poměrně minimalistické, inkrementální rozšíření. Stále to působí, že píšete CSS – s pár „vylepšeními“.
  • Nejužitečnější pro mne jsou mixins, vnořování pravidel a @import. Vnořování je skvělé kvůli code-folding (můžete si zkolapsovat všechny sekce a dívat se pouze na pravidla pro jeden konkrétní segmet vašeho webu).
  • Mixins jsou výborné na CSS3. Když už nic jiného, tak kvůli tomuto byste měli LESS používat:

    .box_shadow(@x: 0px, @y: 0px, @blur: 10px, @color: #000) {
    -webkit-box-shadow: @x @y @blur @color;
    -moz-box-shadow: @x @y (@blur/2) @color;
    -o-box-shadow: @x @y @blur @color;
    box-shadow: @x @y @blur @color;
    }

    // a někde úplně jinde

    #nice-box { .box_shadow(3px, 3px, 10px, #ccc) }

    Až zjistíte, že IE9 podporuje nějaký CSS konstrukt zatím pouze s -ms- předponou, stačí pouze upravit pár CSS3 maker ve separátní @import-ované knihovně a je vystaráno.

  • Trochu komplikace samozřejmě přináší nutnost kompilace. Já mám ve svých projektech automatizovaný build/deploy process, ale chápu že ne každý má takhle mechanizovaný přístup. Pokud máte štěstí a používáte rozumný nástroj, možná zvládá LESS-kompilaci on-the-fly (např. v node.js je to compiler modul Connectu). Situaci neusnadňuje nekompatibilita starších verzí LESS s novějšími.
luboskmetko

Ano, s nastupujucim CSS3 a vendor prefixes toto bude asi najvacia vyhoda LESS.

Inak vyhodnost alebo nevyhodnost pouzitia takychto nastrojov zavisi aj od grafickeho podkladu. Vela dizajnerov nepouzije jeden odtien modrej (@nice-blue) ale vela roznych odtienov. Alebo spolocnych grafickych prvkov, ktore by sa dali zadefinovat a znovu pouzivat je minimum.

Co mi vadi asi najviac je nutnost kompilacie. I s automatizovanym build procesom, je to stale zdrzanie oproti priamenu pisaniu CSS a nejakemu refresh toolu v prehliadaci.

v6ak

Znám dva způsoby, jak to dělat automaticky, a kterýkoli z nich mi nepřijde jako zdržení:
a) Mít na to nějaký handler pro IDE. Stačí uložit, IDE to nechá zkompilovat a je to.
b) Použít ve vývojářském módu např. mod_rewrite a CSS v případě změny alespoň jednoho zdrojového souboru přegenerovat.

Jakub Nešetřil

A dotřetice doplním že pokud jde o flexibilitu/rychlost vývoje, tak pokud LESS transparentně nepřekládá váš server (jak jsem psal Connect to dělá, Jekyll má taky verzi s LESS) – tak lze do HTML includnout less.js a je vystaráno – LESS je překládáno Javascriptem přímo v browseru – a nepostřehnutelně rychle. Před deployem se less.js může odstranit a nahradit zkompilovanou verzí.

Honza Sládek

Zkoušel jsem LESS před nějakým časem (asi půl roku), takže se mohlo něco změnit (kdo máte zkušenosti, opravte mě případně prosím):

Zkoušel jsem LESS jako metodu pro lepší implementaci OOCSS od Nicole Sullivan. Fungovalo to poměrně velmi dobře. Jenže časem jsem zjistil, že se mi OOCSS špatně udržuje prostě proto, že se mi ten styl subjektivně nelíbí. Moc tříd, málo závislostí. Pro programátory paráda, pro mě jako nadšence do sémantiky místy utrpení. Ale každopádně lze LESS pro OOCSS doporučit.

K výše zmíněnému projektu jsem se vrátil po půl roce a chtěl něco upravit. Při té příležitosti jsem updatoval LESS a zjistil, že se změnila implementace některých věcí. Chtěl jsem používat novou verzi a její výhody, ale LESS mi to neumožnil. Poučil jsem se o používání rychle vyvíjených projektů a projekt přepsal do čistého CSS.

Kvůli používání LESS jsem musel jemně upravit své kodérské náviky. Moc rád používám nejnovější CSS3 triky a media-queries mi v LESS nefungovaly. To mě fakt štvalo.

Na konec to hlavní, co se mi na LESS líbilo byla specifikace barev a mixins. Ani jednoho nepovažuji za takovou výhodu, abych se nechal omezovat tím zbytkem.

LESS je podle mě nástroj pro programátory, kteří potřebují kódovat. Pro mě to je užitečný nástroj, který mi vůbec nesedl.

Sebastian

Super, asi 3dny zpět jsem si říkal, že něco podobného bych rád… Potěšili jste mě! :))

mat

http://www.barelyfitz.com/projects/csscolor/

coz me nikdy nenepadalo tak udelat, diky clanku jsem zacal o tom vice premyslet a hledat… diky tomu, ze to jde udelat mi pak nejake extravagantni jazyky, ktere bezny hosting nepodporuje prijdou jako ne uplne rozumne :-)

v6ak

A záleží opravdu na podpoře hostingu? Ono je možné to před nahráním zkompilovat a na hostingu nezáleží.

František Kučera

Z počátku jsem si říkal, že je nesmysl zavádět nový jazyk, když si to generování CSS můžu napsat v nějakém existujícím jazyce, ale má to něco do sebe (např. jednoduché „přičítání“ barev pomocí operátoru +, to by se v obecném jazyce dělalo složitěji, nebo by si člověk musel dopsat vlastní pomocné funkce). LESS podle mého prasárna není, někdy prostě deklarativní zápis nestačí a je potřeba trochu „programovat“ (vyhnout se opakujícímu se kódu a magickým konstantám), jen bych ho použil v době „kompilace“ nikoli v době běhu (to mi trochu jako prasárna přijde, zvlášť ten JavaScript, ale použití jako preprocesoru, např. zmiňované navázání na commit v SCM, mi přijde OK).

balki

Znie to zaujimavo, je nieco podobne pre javu ?
Robim v Javaserver faces a nieco podobne by mi ulahcilo robotu.

v6ak

Stačí se porozhlédnout po komentářích (já jsem sem postoval link) nebo se zeptat strejdy fulltextu…

balki

Pozeral som aj predtym, ale nasiel som v kommentoch len less pre jruby, co za javu nepovazujem.

v6ak

http://zdrojak.root.cz/clanky/less-stejne-css-za-mene-penez/nazory/12401/ ?

Vypadá to na nějakou obálku nad tím. JRuby každopádně může s Javou relativně dobře spolupracovat (zvlášť s obálkou), takže bych problém neviděl. Nebo v tom je něco ideologického.

balki

Nie ideologicke, ale dalsia zbytocna vrstva, urcite to nie je 2x rychle. A ked robim projekt v J2EE, ma to aj tak samo o sebe tolko zavislosti, ze jednemu vstavaju vlasy dupkom :)

v6ak

Možná to není dvakrát rychl*é*, ale je to prý dvakrát rychl*ejší* než CRuby. I když ne hned po startu – ten obecně v Javě není výkonnostně nejlepší a v JRuby je to poznat ještě více.

Řešením může být taky kompilátor-daemon ve stylu fsc (fast Scala compiler).

Pokud chceš, můžeš vzít Ruby zdrojáky a přepsat je třeba do Mirah (staticky typovaný jazyk (type inference) se syntaxí blízkou Ruby běžíci na platformě Java). Snad Mirah bude schopné něco takového provozovat.

Jakub Bouček

Pokud se použije správně, je to vynikající nástroj. Neexistuje alternativa pro PHP?

Jakub Bouček

Můžete se tvářit, jako bych tu nic nepsal, prosím? Z nějakého důvodu jsem viděl jen Ruby verzi.

Tomas Janovsky

Osobne si nemyslim ze odpurcum LESS jde tolik o „ideovou cistotu“, ale treba taky o prakticke aspekty, jako napriklad deployment, debugovani v prohlizeci a podobne..

Prasarnu z kazde technologie dela az jeji nevhodne pouziti. Jsem si naprosto jisty ze nebude trvat dlouho a potkam v praxi projekt kde bude misto 400 radku standardniho css 300 radku kodu pro preprocessor, a vyvojar bude stastny jak „usnadnil udrzbu“.

Miluju vyraz „vyvojarstvi“ ve vyse zminenem kontextu, vybavily se me stovky diskuzi, mnoho byvalych kolegu.. ;)

Nox

…naopak toto mělo být do CSS implementované již dávno.
LESS (nemyslím teď konkrétní implementaci) doplňuje vlastnosti, které CSS těžce chybí a které jsou v jazycích samozřejmostí už od pravěku (možná jde o jiné typy jazyků, ale v praxi nevidím v dopadu změn rozdíl), tuhle iniciativu rozhodně vítám

Mj. nedávno se objevil plugin LessCSS pro Netbeans

konečně to nebude RY, ale DRY

Oldis

Implementace less v php je otřesná.

kahi

To by se dalo určitě sdělit i tak, aby to mělo pro čtenáře nějaký přínos… :-)

honza

V IE9 jsem objevil, že pokud zadáte adresu CSS v LINK jako dynamickou adresu, např. http://www.neco.cz/css/lessc.php?file=main.less, tak prohlížeč zkrátka to CSS zhusta ignoruje. Toto chování mi při testování vykazuje pouze IE9, nikoliv její starší verze nebo jiné browsery.

Koukal jsem se i na specifikaci a W3C hovoří o tom, že v HREF je URL, nikde ani slovo o tom co by mělo splňovat…

kahi

A je to css posíláno s MIME text/css?

Enum a statická analýza kódu

Mám jednu univerzální radu pro začínající programátorty. V učení sice neexistují rychlé zkratky, ovšem tuhle radu můžete snadno začít používat a zrychlit tak tempo učení. Tou tajemnou ingrediencí je statická analýza kódu. Ukážeme si to na příkladu enum.