Spořící účet ING Konto
7. května 2004 6:48
Online komprimace CSS
Před dvěma dny jsem řešil problém s přehledným a znovupoužitelným CSS:
Za přehlednost a znovupoužitelnost se ale platí větší velikostí CSS souboru. Větší komfort webdesignera je tedy vykoupen o trošku delším čekáním uživatele. S tím se musí počítat a každý si musí zvážit, co je pro něj výhodné. Např. na lokále mít přehlednou verzi a uživatelovi posílat její zkomprimovanou podobu.
No a dnes jsem narazil na Online CSS Optimizer. Zadáte do něj vlastní CSS a on vám vrátí jeho zkomprimovanou podobu. Každý si řekne pár mezer. To uživatelovi nevadí, že bude stahovat. Ale mu to vadí! Třeba já jsem ušetřil 1,3 z cca 6 KB (via CSS Vault).
Zdrojové kódy nejsou pro uživatele - optimalizujte je!
Seriál: Upravujeme CSS
- Online komprimace CSS [7. května 2004 6:48]
- Přehledné a znovupoužitelné CSS [5. května 2004 15:59]
- Komprimace CSS genetickým algoritmem [29. ledna 2004 6:28]
- Pište efektivní CSS [8. prosince 2003 19:20]
Komentáře
7. května 2004 9:03
skutečné terno nastává při použití gzip komprimace. Tu dnes podporuje naprostá většina prohlížečů, a těm, co nepodporují, samozřejmě pošleme nezkomprimované stránky.
Redukce ze 17kB na 4kB (u CSS) a ze 17kB na 5kB (u HTML) je více než významná.
Redukce ze 17kB na 4kB (u CSS) a ze 17kB na 5kB (u HTML) je více než významná.
7. května 2004 9:18
O nejruznejsich komprimacich (nejen gzipem)HTML, CSS a JS, a s tim spojenych problemech pojednava detailne knizka "Zrychlete sve WWW stranky" od Andrew B. Kinga, vydal Zoner Press. Leo
7. května 2004 9:23
3# rony
ja by som skor prijal optimalizator CSS - program, ktory rozumie CSS dedicnosti a pod. veciam a zbytocne opakovane prikazy eliminuje a spolahne sa na dedicnost. u obzvlast blbo pisanych CSs, ktore presli ladenim sa najde dost priestoru ako puhym zmazavanim medzier ;-)
7. května 2004 9:32
[3] to je neresitelny problem. Hierarchie se tvori az v HTML, tudiz u CSS ji nemuzes optimalizovat. Tedy krome zjevnych duplicit jako napr.
a b { color: red; }
a { color: red; }
Ovsem takove profik dela maximalne 3x za 10 let :-)
Pokud je potreba zmenšit CSS na minimum, je nejvhodnejsi pouziti optimalizatoru, ktery odstrani komentare a mezery, a pote gzip komprese.
a b { color: red; }
a { color: red; }
Ovsem takove profik dela maximalne 3x za 10 let :-)
Pokud je potreba zmenšit CSS na minimum, je nejvhodnejsi pouziti optimalizatoru, ktery odstrani komentare a mezery, a pote gzip komprese.
7. května 2004 11:45
[4] Riešiteľné to je, ale je to veľmi časovo náročné. Osobne som sa tým už zaoberal. Dokonca sa to tu aj linkovalo. http://www.zpravy.net/weblog/archiv/0401/komprimace-css-genetickym-algoritmem.php
Je to síce zjednodušené, ale keby sa to naviazalo na konkrétne HTML stránky a poriadny CSS vyhodnocovač pravidiel tak by to malo bez problémov fungovať. Teda až na tú časovú zložitosť.
Je to síce zjednodušené, ale keby sa to naviazalo na konkrétne HTML stránky a poriadny CSS vyhodnocovač pravidiel tak by to malo bez problémov fungovať. Teda až na tú časovú zložitosť.
7. května 2004 12:18
[5] johno, Tvůj článek jsem si (už v době publikace na Aboutu) četl, velmi mě to zaujalo.
Ale takový nástroj bych považoval spíš za kuriozitu. Tím, že optimalizaci navážeš na konkrétní HTML soubor(y), tak nebudeš mít jistotu, že CSS bude dobře fungovat i s dalšími HTML. Což jde proti samotné podstatě onoho oddělování obsahu od formy.
V případě celkem dobře navrženého CSS navíc ani nedojde k větší úspoře (řádově o procenta).
Slovy Jiřího Chomáta: "Někdo musí sdělit lidstvu 'tudy ne přátelé'..." (http://www.chomat.net/weboviny/archiv/2004-05.html#1083622455)
Ale takový nástroj bych považoval spíš za kuriozitu. Tím, že optimalizaci navážeš na konkrétní HTML soubor(y), tak nebudeš mít jistotu, že CSS bude dobře fungovat i s dalšími HTML. Což jde proti samotné podstatě onoho oddělování obsahu od formy.
V případě celkem dobře navrženého CSS navíc ani nedojde k větší úspoře (řádově o procenta).
Slovy Jiřího Chomáta: "Někdo musí sdělit lidstvu 'tudy ne přátelé'..." (http://www.chomat.net/weboviny/archiv/2004-05.html#1083622455)
7. května 2004 12:38
[6] Nevidím problém v tom, že by sa časom pridal nejaký íný HTML súbor. Jednoducho by sa to naviazalo aj na neho a spustilo celé odznova.
Som presvedčený o tom, že ušetriť týmto spôsobom nejaké rozumné percento je naozaj výnimočný prípad. Veď nakoniec preto som to nevyvíjal ďalej a neválam sa teraz už v peniazoch.
Oveľa prijateľnešie by sa mi zdalo keby sa CSS dalo posielať ako skomprimované priamo prehliadaču. Niečo ako type="gzip/css" ale to je asi hudba budúcnosti.
Som presvedčený o tom, že ušetriť týmto spôsobom nejaké rozumné percento je naozaj výnimočný prípad. Veď nakoniec preto som to nevyvíjal ďalej a neválam sa teraz už v peniazoch.
Oveľa prijateľnešie by sa mi zdalo keby sa CSS dalo posielať ako skomprimované priamo prehliadaču. Niečo ako type="gzip/css" ale to je asi hudba budúcnosti.
7. května 2004 12:44
[7] ale o tom tu celou dobu mluvim! Jeste jednou si precti první komentář. Takto funguje např. http://www.vitalita.cz.
7. května 2004 15:53
[8] Nebo Interval.cz - běžně komprimujeme z 50 Kb na 10 Kb ;-)
7. května 2004 19:01
[7], [8] - muzete trosku blize vysvetlit jak na to? (treba clanecek na intervalu? resp. v php skriptech kompresi take pouzivam, zajimalo by me jestli muzu proste css soubor zkomprimovat gzipem a nacitat ho jako normalni css. a podobne u statickych html.
7. května 2004 22:10
Komprimace má smysl i při "ušetření" jednoho kb. Pokud máte denně staženo ze serveru 200 tis. stránek a ušetříte na každé stránce dejme tomu 10kb, ušetříte na toku dat 2gb dat (počítám li správně). Využít se to dá poku dplatíte za přenesená data, nebo z nedostatku financí máte připojen server přes pomalou linku.
8. května 2004 10:04
[10] princip je nasledujici:
pokud klient odesle hlavicku Accept-Encoding: gzip, rika tim, ze je schopen gzip prijmout. To je vychozi podminka
Dale ty musis odeslat hlavicku Content-Encoding: gzip
A pote je mozne soubor posilat komprimovany.
To tomuto muzes pouzit i PHP, jelikoz ma zabudovanou podporu pro kompresi gzip. Více tady: http://cz.php.net/zlib
Ale bacha na jednu vec: pokud budes CSS prohanet pres PHP (napriklad tim, ze styl prejmenujes na style.css.php, nebo tak nakonfigurujes server), je taky vhodne osetrit sprave cachovani.
pokud klient odesle hlavicku Accept-Encoding: gzip, rika tim, ze je schopen gzip prijmout. To je vychozi podminka
Dale ty musis odeslat hlavicku Content-Encoding: gzip
A pote je mozne soubor posilat komprimovany.
To tomuto muzes pouzit i PHP, jelikoz ma zabudovanou podporu pro kompresi gzip. Více tady: http://cz.php.net/zlib
Ale bacha na jednu vec: pokud budes CSS prohanet pres PHP (napriklad tim, ze styl prejmenujes na style.css.php, nebo tak nakonfigurujes server), je taky vhodne osetrit sprave cachovani.
8. května 2004 10:05
[10] a jeste nezapomenout na něco jako:
header('Content-Type: text/css; charset=windows-1250');
header('Content-Type: text/css; charset=windows-1250');
16. května 2004 14:59
Editor PSPad http://www.pspad.com
umí nejen komprimovat ale i provést přeformátování CSS.
umí nejen komprimovat ale i provést přeformátování CSS.
17. května 2008 0:00
Další příspěvky
- Aktuální příspěvky
- Novější příspěvky
- Registrace do katalogů má smysl [12. května 2004 16:21]
- Registrace do vyhledávačů je přežitek [11. května 2004 16:30]
- CSS position:fixed i v IE [10. května 2004 18:42]
- Starší příspěvky
- Typografická pravidla [6. května 2004 23:29]
- Skrývání částí stránek [6. května 2004 4:52]
- Přehledné a znovupoužitelné CSS [5. května 2004 15:59]
- Všechny příspěvky za měsíc květen 2004



