Posuvníky pro fotogalerii a rychlost načítání stránky.

3. 8. 2012 13:36:57

Ahoj,

chtěl jsem poprosit o radu či nějaký tip na zvýšení rychlosti načítání web. stránek. Pro galerii fotek (jedna fotka cca 80 kB) a videí jsem zvolil posuvníky a pravděpodobně díky nim se stránka načítá velice pomale cca 7 sec a má 3,7 MB.

http://tools.pingdom.com/fpt/#!/OTDra8KBN/http://www.jezirka-brno.cz/new/zahradni-jezirka-inspirace-fotogalerie-a16

Svůj díl na to má i header, okolí a animace, HP se načítá cca 2 sec a má 2,2 MB, což je také není dobré.

Nicméně řešit chci způsob zobrazení fotek ve fotogalerii, tak aby se mi povedlo zrychlit načítání. Tzn. jiný způsob,jiný typ posuvníku nevím, uvítám radu i pro případné zlepšení HP Předem děkuju.

3. 8. 2012 13:36:57

https://webtrh.cz/diskuse/posuvniky-pro-fotogalerii-a-rychlost-nacitani-stranky/#reply792639

800XE

(8 hodnocení)

3. 8. 2012 14:14:13

- Jako první věc bych upgradoval jQuery. Používáš verzi 1.4.2, která už je zastaralá a pomalá - už jenom upgradem na 1.7.2 se podle mě načítání podstatně zrychlí. Může to vyžadovat pár úprav v kódu, ale většinou to není nic strašnýho a za to zrychlení to stojí.

- Místo navěšování dvaceti stejných handlerů pro ready:

hoď inicializaci carouselů do jednoho:

- Počet požadavků a velikost přenášených dat můžeš snížit pomocí nějaké knihovny pro minimalizaci a sloučení stylů nebo skriptů do jednoho souboru. Skvělou knihovnu pro tenhle účel najdeš například tady.

- U obrázků, které slouží jako náhledy, by se dalo uvažovat o zvýšení komprese.

- Za zvážení určitě stojí tzv. lazy load - carousely se inicializují až těsně před tím, než na ně uživatel doscrolluje.

- Pro paralelní inicializaci je možnost využít workery.

3. 8. 2012 14:14:13

https://webtrh.cz/diskuse/posuvniky-pro-fotogalerii-a-rychlost-nacitani-stranky/#reply792638

avensis

(11 hodnocení)

3. 8. 2012 15:11:02

Děkuji za rady, bohužel nemůžu dát hned zpětno vazbu, zda pomohly, programátor je na dovolené, jakmile se vrátím tak předám, případně s dalším pokud mi ještě někdo poradíte.

3. 8. 2012 15:11:02

https://webtrh.cz/diskuse/posuvniky-pro-fotogalerii-a-rychlost-nacitani-stranky/#reply792637

petrx

(8 hodnocení)

3. 8. 2012 20:05:21

http://www.webpagetest.org/result/120803_AG_SZQ/

vidím:

- Dlouhý Time to First Byte -- programátor by měl zapracovat na SQL dotazech a/nebo na cachování fragmentů HTML v aplikaci:

http://www.webpagetest.org/result/120803_AG_SZQ/1/performance_optimization/#first_byte_time

- Vypnutou HTTP kompresi -- nakopnout provozovatele hostingu / správce serveru:

http://www.webpagetest.org/result/120803_AG_SZQ/1/performance_optimization/#compress_text

- Nenastavené řádné cachování na klientu -- opět nutno řešit s vývojářem a se správcem serveru:

http://www.webpagetest.org/result/120803_AG_SZQ/1/performance_optimization/#cache_static_content

Další problémy hlásí Google:

- Obrázky nejsou servírovány jako sada CSS sprites, nakopnout grafika / kodéra

https://developers.google.com/speed/pagespeed/insights#url=http_3A_2F_2Fwww.jezirka-brno.cz_2Fnew_2Fzahradni-jezirka-inspirace-fotogalerie-a16&mobile=false&rule=SpriteImages

A zkuste servírovat obrázky přes CloudFlare

A až budete mít hotovo dle výše uvedeného, zkuste

http://gtmetrix.com/reports/www.jezirka-brno.cz/Nm7IyuCx

a klikněte na "Re-Test Page"

3. 8. 2012 20:05:21

https://webtrh.cz/diskuse/posuvniky-pro-fotogalerii-a-rychlost-nacitani-stranky/#reply792636

avensis

(11 hodnocení)

3. 8. 2012 21:25:05

...děkuji za další tipy, díky moc.

---------- Příspěvek doplněn 04.08.2012 v 07:11 ----------

...ještě mě napadlo jestli lze nějak ošetřit, aby při úvodním načtení HP neproblikla na cc 1 sec místo obrázku Headru, pod ním uložená zelená textura, jestli nejde něco zpozdit nebo tak http://www.jezirka-brno.cz/new/

3. 8. 2012 21:25:05

https://webtrh.cz/diskuse/posuvniky-pro-fotogalerii-a-rychlost-nacitani-stranky/#reply792635

Pro odpověď se přihlašte.

Přihlásit