it-swarm-eu.dev

Redukce CSS pro rychlejší načítání / menší šířku pásma

Je zhutnění CSS/Odstranění nevyužitých pravidel pro konkrétní stránku užitečné z hlediska šířky pásma nebo se můžeme spolehnout na ukládání do mezipaměti (záhlaví/naposledy změněno), abychom odstranili tuto režii v přírodě?

Na zdraví

Také hodně štěstí s beta verzí!

9
Aiden Bell

Snížení velikosti souborů jistě sníží šířku pásma a zkrátí dobu načítání stránky. Když uživatel poprvé navštíví váš web, nebude mít nic v mezipaměti a pro většinu webů jsou návštěvníci, kteří poprvé navštíví, většinu provozu.

Dále se ujistěte, že máte povolenou kompresi gzip. Tím se výrazně sníží šířka pásma.

8
Matthew Shanley

Existuje mnohem více potenciálních míst pro optimalizaci, která budou mít větší dopad ...

Pokud hledáte přísně zvýšení výkonu, optimalizace zdroje CSS je v potravinovém řetězci poměrně nízká.

Při prvním načtení stylů dojde k malému zásahu ve zdroji CSS. Mezipaměť by se od té doby měla o problém postarat.

2
Evan Plaice

Nemyslím si, že je to buď nebo. Zmenšení velikosti souboru pomůže uživateli při prvním přístupu k souboru. Ukládání do mezipaměti pomůže při jejich druhé návštěvě.

2
jessegavin

Kdykoli můžete odstranit věci, zlepšíte rychlost načítání, pokud jen zanedbatelně. Doporučujeme také odstranit věci, které nepoužíváte pro přehlednost kódu.

1
Jason

Můžete získat to nejlepší z obou světů, soubor minifikovat v době provádění a gzipovat výstup.
Zdrojový soubor je stále čitelný, pokud jej potřebujete upravit, ale je stažen, když jej stáhnete

nejprve: pomocí htaccess řekněte Apache, aby zacházel se všemi css soubory jako s php skripty a komprimoval výstup, když psal text/css

v .htaccess AddHandler php5-cgi .css AddType text/css .css AddOutputFilterByType DEFLATE text/css

zadruhé: použijte výstupní vyrovnávací paměť s funkcí zpětného volání pro minimalizaci kódu css před zahájením stahování, také nastavte čas vypršení platnosti, aby byl soubor uložen do mezipaměti

v souboru css

<?php
ob_start("trima");
header("Content-type: text/css; charset=utf-8");
ob_start();
date_default_timezone_set('GMT');
$lasmod = "Last-Modified: " . strftime ("%a, %d %b %Y %T GMT", filemtime (__FILE__));
Header($lastmod);
$offset = 3600*24*30*12;
$expire = "Expires: " . date("D, d M Y H:i:s", time() + $offset) . " GMT";
Header($expire);
function trima($str) {
    $str = str_replace(array("\n", "\r", "\t", "\o", "\xOB"), '', $str); // remueve enter tabs y demas
    $str = preg_replace('!/\*[^*]*\*+([^/][^*]*\*+)*/!', '', $str); // remueve comentarioa
    $str = ereg_replace("[ ]+", " ", $str);                         //remueve espacios multiples
    $rep = array( '{ '=>'{', ' }'=>'}', '; '=>';', ', '=>',', ' {'=>'{', '} '=>'}', ': '=>':', ' ,'=>',', ' ;'=>';' ); // remueve espacios inecesarios
    $str = strtr($str, $rep);
    return $str;
}
?>
css content here

Za třetí: zisk?

0

Mám podezření, že to závisí na dynamice vašeho webu. Pokud máte mnoho opakujících se návštěvníků a málo nových návštěvníků, ukládání do mezipaměti je pravděpodobně dost. Pokud však máte spoustu nových návštěvníků (a zejména pokud chcete udělat dobrý první dojem), myslím, že byste měli co nejvíce snížit velikost vašeho CSS.

0

Odstranění nepoužitého CSS zřejmě zlepší dobu načítání na jedné stránce, ale musíte to také vyrovnat s účinkem na několika stránkách. Také se chcete vyhnout příliš velkému množství požadavků HTTP.

Nezapomeňte, gzipping CSS je zdaleka nejúčinnějším způsobem, jak urychlit načítání CSS. Rozdíl mezi jedním souborem se vším ve druhém a druhým s několika odstraněnými zbytečnými bloky je po gzip zanedbatelný.

0
DisgruntledGoat

I když se výkon sníží odstraněním nepoužitého CSS na stránce (a jsem docela přesvědčen, že ukládání do mezipaměti by převažovalo, pokud nebudete mluvit o radikálně odlišných stránkách), je třeba zohlednit čas potřebný k údržbě. . Pokud nejste Google, pravděpodobně nestojí za to strávit několik dní po celou dobu životnosti webu, aby každý uživatel ušetřil desetinu sekundy.

Hodně z toho souvisí s profilem využití vašeho webu. Pokud jste opravdu lepkaví, pak ukládání do mezipaměti vyhraje ruce dolů. Pokud však máte vysokou míru okamžitého opuštění, můžete být s optimalizovaným CSS lepší (nebo trávíte čas, který ztrácíte na optimalizaci CSS, takže vaše stránky budou nalepeny!).

Jedním z přístupů, které byste mohli použít, pokud máte označení pro konkrétní stránku, je mít obecný soubor CSS pro celý web a vložit do hlavičky dokumentu HTML pravidla na stránku.

0
JasonBirch