Rychlost strßnek

Proto╛e na dne╣nφm Internetu je spousta konkurence, je t∞╛kΘ Φtenß°e upoutat. Rychlost naΦφtßnφ a zobrazovßnφ strßnek je p°itom klφΦovß veliΦina.

Co ovliv≥uje dΘlku Φekßnφ

Datovß velikost

Pr∙m∞rnΘmu u╛ivateli se jeden kilobajt naΦφtß asi p∙l sekundy a╛ sekundu. (Existujφ samoz°ejm∞ rozdφly, to je jen pro ilustraci.) Pr∙m∞rnß velikost strßnky (bez obrßzk∙) na webu je asi 5 a╛ 10 kB, z toho vychßzφ dv∞ a╛ deset sekund na naΦtenφ strßnky. Nane╣t∞stφ je navφc nutno zapoΦφtat dobu na stahovßnφ v╣ech objekt∙ strßnky, v to pat°φ:

Je ╛ßdoucφ, aby celkov² souΦet datov²ch objem∙ byl co nejmen╣φ.

Obrßzky

Zßsadnφ roli p°itom hrajφ obrßzky, proto╛e jsou nejΦast∞j╣φ a v∞t╣inou datov∞ nejv∞t╣φ objekty na strßnce. Ty lze zmen╣it:

Podrobn∞j╣φ tipy na kompresi vΦetn∞ tabulky velikostφ jsem popsal u p°φpravy obrßzk∙.

Datovß velikost textu 

Zßvisφ jednak na dΘlce textu (s tφm nic nenad∞lßme) a na formßtovßnφ. Formßtovßnφm myslφm r∙znΘ deklarace pφsma, barev a tak. Je b∞╛nΘ, ╛e se tyto deklarace zadßvajφ mnohokrßt Φast∞ji, ne╛ je t°eba. To zp∙sobujφ p°evß╛n∞ editory.

Odhaduji, ╛e v dne╣nφm Internetu jsou strßnky pr∙m∞rn∞ dvakrßt datov∞ v∞t╣φ, ne╛ by musely b²t. (Existujφ i texty zprasenΘ natolik, ╛e jsou a╛ desetkrßt v∞t╣φ, ne╛ je nutnΘ, ale to je extrΘm.)

Jak text∙m datov∞ odlehΦit:

Skripty, definice rßm∙, applety, stylopisy, hudba

V╣echny odkazovanΘ vlo╛enΘ objekty se do v²slednΘ velikosti strßnky takΘ p°iΦφtajφ, ale zpravidla nehrajφ vß╛n∞j╣φ roli, proto╛e b²vajφ malΘ (s v²jimkou applet∙), nebo nejdou moc zmen╣it (applety).

Jedinou zßludnostφ je zde poΦet http spojenφ. Na otev°enφ protokolu pro ka╛d² soubor jsou pot°ebnß takΘ n∞jakß data (http hlaviΦky) a pokud je takto naΦφtan²ch objekt∙ p°φli╣ mnoho, tak to m∙╛e zp∙sobit zpomalenφ. Nßzory na mφru tohoto zpomalenφ se r∙znφ, jß osobn∞ nevφm.

Paralelnφ naΦφtßnφ

Kdy╛ prohlφ╛eΦ p°i anal²ze dokumentu narazφ na obrßzek (obecn∞ jak²koli odkazovan² objekt), tak se ho pokusφ stßhnout ze serveru okam╛it∞. Navß╛e http spojenφ se serverem a obrßzek stahuje souΦasn∞ se zbytkem strßnky. Tφmto zp∙sobem se ze serveru m∙╛e zßrove≥ naΦφtat velmi mnoho objekt∙.

TakovΘ paralelnφ stahovßnφ je ve v∞t╣in∞ p°φpad∙ ╛ßdoucφ. N∞kdy ale stahovanΘ obrßzky ucpou linku, tak╛e se naΦφtßnφ vlastnφho textu strßnky velmi zpomalφ. Autor strßnek s tφm nem∙╛e nic moc d∞lat, nicmΘn∞ Φtenß°i si kv∙li tomu rßdi vypφnajφ obrßzky.  

Cache pam∞ti

R∙znΘ vyrovnßvacφ pam∞ti, "Temporary Internet Files" a cacheovacφ proxiny vyu╛φvajφ jednoduchΘ my╣lenky: proΦ stahovat znovu n∞co, co u╛ mßm sta╛enΘ? 

Prohlφ╛eΦ se p°i anal²ze strßnky u ka╛dΘho objektu (t°eba obrßzku) nap°ed podφvß do svΘ cache pam∞ti, jestli tam ten objekt u╛ nemß. Pokud ho najde, tak ho nestahuje. (Podle svΘho nastavenφ se maximßln∞ podφvß, zda se objekt na serveru nezm∞nil (stßhne si pouze datov² ·daj)). To samoz°ejm∞ velmi zrychluje celkovΘ naΦφtßnφ strßnky. 

Filosofickß odboΦka: znßte ekologickou pouΦku, ╛e "nejlevn∞j╣φ energie je ta, kterou nenφ t°eba vyrobit"? Parafrßze: nejrychleji p°enesenß data jsou ta, kterß nenφ nutno p°enß╣et. 

Po╛adovanß data se v cache pam∞ti (Φti [ke╣]) vyskytujφ p°ekvapiv∞ Φasto, proto╛e p°φbuznΘ strßnky ze stejnΘho serveru majφ ve zvyku naΦφtat stejnΘ obrßzky. Klasick²m p°φkladem je pozadφ nebo logo firmy. P°i stahovßnφ prvnφ strßnky serveru se obrßzky stßhnou, p°i dal╣φm prochßzenφm strßnek se Φtou z cache pam∞ti. Dß se formulovat obecnΘ pravidlo: 

Na v╣ech p°φbuzn²ch strßnkßch pou╛φvejte tytΘ╛ obrßzky. To se t²kß v╣ech naΦφtan²ch objekt∙: externφch stylopis∙ nebo knihoven skript∙.

Hrubou chybou je umis╗ovßnφ stejn²ch obrßzk∙ do webu jako soubor vφcekrßt na r∙znß mφsta, proto╛e pak prohlφ╛eΦ nemß ╣anci zjistit, ╛e je to to samΘ. Postrachem webmaster∙ jsou v tomto ohledu marketingovφ mana╛e°i, kte°φ by cht∞li mφt logo na strßnkßch t°ikrßt r∙zn∞ velkΘ a dvanßctkrßt jinak otoΦenΘ.

NaΦφtßnφ dop°edu 

N∞kte°φ auto°i razφ my╣lenku tzv. vstupnφ chodby (termφn jsem nalezl u Satrapy), co╛ je ·vodnφ strßnka serveru, na kterΘ skoro nic nenφ, jenom maximßln∞ jmΘno firmy/serveru, pßr v∞t a odkaz na hlavnφ strßnku. V∞t╣inou to sice pokazφ n∞jak² zbyteΦn² velk² obrßzek, ale i tak je vstupnφ chodba dokonal²m mφstem pro naΦφtßnφ obrßzk∙ dop°edu. 

Dejme tomu, ╛e budu chtφt p°edem naΦφst logo firmy. Obrßzek s logem umφstφm na zßv∞r strßnky vstupnφ chodby a zneviditelnφm ho (rozm∞ry 1, 1 a display: none). Prohlφ╛eΦ si ho naΦte a a╛ u╛ivatel p°ejde na hlavnφ strßnku, bude logo u╛ naΦtenΘ. 

Obrßzk∙ m∙╛e b²t samoz°ejm∞ vφce. Dajφ se dokonce dop°edu naΦφtat celΘ strßnky pomocφ neviditelnΘho elementu <iframe>. Problematika p°ed-naΦφtßnφ objekt∙ je ╣irokß; jejφ techniky se pou╛φvajφ hlavn∞ p°i skriptovßnφ. 

Nutno poznamenat, ╛e neviditelnΘ naΦφtßnφ dat m∙╛e pozornΘho u╛ivatele p∞kn∞ zmßst -- pokud tedy bude Φekat na dokonΦenφ naΦφtßnφ. 

FyzickΘ umφst∞nφ cache pam∞ti

Kdy╛ u╛ pφ╣u o cache pam∞tφch prohlφ╛eΦ∙, tak Internet Explorer si uklßdß data do c:\windows\Temporary Internet Files, ostatnφ prohlφ╛eΦe do podslo╛ek vedle svΘ instalace. Pokud n∞komu cache pam∞╗ vadφ p°i testovßnφ strßnek, m∙╛e si tyto soubory smazat. Ale Internet Explorer (a mo╛nß i jinΘ prohlφ╛eΦe) si udr╛uje poslednφch p∞t strßnek i v RAM pam∞ti (tak╛e se musφ i zav°φt a otev°φt prohlφ╛eΦ).

Rychlost zobrazovßnφ

Cht∞l bych zd∙raznit rozdφl mezi naΦφtßnφm a zobrazovßnφm.

Mnoho strßnek je ╣patn∞ strukturovan²ch. Prohlφ╛eΦ pak sice naΦφtß data slu╣n²m tempem, ale dlouho je vid∞t pouze bφlß plocha. Nebo text r∙zn∞ poskakuje b∞hem naΦφtßnφ.

Trocha psychologie: mßm-li u╛ co Φφst (zaΦßtek strßnky), p°φli╣ mi nevadφ, ╛e strßnka nenφ naΦtenß celß. Na druhou stranu pokud musφm koukat na prßzdnou strßnku (maximßln∞ s n∞jak²m logem), tak m∞ to p∞kn∞ otrßvφ.

ProblΘmy se zobrazovßnφm jsou zp∙sobeny:

VelkΘ tabulky

Jednodu╣e °eΦeno: tabulka se zobrazφ a╛ po tΘ, co se naΦte celß. Pokud je v jednΘ tabulce celß strßnka, tak prohlφ╛eΦ prost∞ Φekß na poslednφ pφsmenko a teprve potom to vykreslφ. Autor, kter² ladφ strßnku na lokßlnφm disku, si tento problΘm neuv∞domφ, proto╛e k n∞mu poslednφ pφsmenko dorazφ rychle.

Je to skliΦujφcφ skuteΦnost; tabulka p°es celou strßnku byl donedßvna jedin² zp∙sob, jak dßt strßnce trochu slu╣n² design (pokud nechci pou╛φvat rßmy). Tv∙rci prohlφ╛eΦ∙ a jazyka HTML tak utekli sk°et∙m, aby se nechali chytit vlky. ╪e╣enφ jsou pracnß:

V∞t╣ina ambici≤znφch server∙ dnes svφzel s velk²mi tabulkami ignoruje a nechßvß svΘ Φtenß°e Φekat.

Rozm∞rovßnφ obrßzk∙

Kdy╛ u obrßzku (tag <img>) uvedu rozm∞ry (atributy width a height), tak si prohlφ╛eΦ pro ten obrßzek vymezφ mφsto. Kdy╛ je neuvedu, tak prohlφ╛eΦ po nata╛enφ zaΦßtku obrßzku musφ p°epoΦφtat zobrazenφ, co╛ jednak poskoΦφ a jednak to na pomalej╣φch poΦφtaΦφch docela zdr╛uje.

Tabulky + nerozm∞rovanΘ obrßzky

Tabulka se zobrazφ, a╛ kdy╛ se naΦte celß, ale 

Tento p°φpad klasicky nastßvß u poΦitadel. Mßlokdo mß ve zvyku poΦitadlo rozm∞rovat (proto╛e prost∞ b²vß r∙zn∞ velkΘ), navφc se poΦitadlo stahuje dlouho, proto╛e se poΦφtß. Je-li uvnit° tabulky, celß tabulka na n∞j Φekß. To m∙╛e zp∙sobit naprostou nefunkΦnost strßnky. Krom∞ poΦitadel je to b∞╛nΘ i u reklam.

Komplikovanß rßmovß struktura

Rßmy se naΦφtajφ paraleln∞, ale majφ prioritu v╛dy ve stejnΘm po°adφ: nap°ed se naΦφtajφ hornφ a levΘ. Rßm s vlastnφm textem b²vß v pravΘm dolnφm rßmu, kter² se natahuje naposled. 

Obsahuje-li hornφ rßm hodn∞ obrßzk∙
p°iΦem╛
lev² rßm
asi takΘ 
obsahuje
hodn∞ 
obrßzk∙,
tak se linka ucpe paralelnφm p°enosem mnoha soubor∙, mezi nimi╛ mß hlavnφ text malou prioritu.

Tak╛e se zobrazφ pozd∞.

Rychlost serveru

Na rychlosti serveru se podφlφ:

Ty tam jsou doby, kdy autor strßnek musel b²t zßrove≥ sprßvcem serveru. Dnes je obecnou praxφ hostovat n∞kde na pßte°nφ sφti u profesionßlnφch poskytovatel∙. Ve v∞t╣in∞ p°φpad∙ u╛ nem∙╛e autor strßnek serverovou slo╛ku rychlosti nijak ovlivnit (a╛ na pou╛itφ serverov²ch skript∙). No ale kdyby to n∞koho zajφmalo:

NßroΦnost serverovΘho °e╣enφ

V poslednφ dob∞ stoupß obliba serverov²ch skript∙, zejmΘna PHP. ServerovΘ skripty umo╛≥ujφ hodn∞ v∞cφ, p°iΦem╛ ale nenφ problΘm napsat aplikaci, kterß bude velmi pomalß a zßrove≥ bude zat∞╛ovat server. Pokud s psanφm serverov²ch skript∙ zaΦφnßte, tak to nepodce≥ujte. 

Rozdφl mezi rychlostφ odeslßnφ obyΦejnΘ HTML strßnky oproti serverovΘmu skriptu 

Nechßpu autory (a je jich hodn∞), kte°φ se sna╛φ i banßlnφ strßnky psßt v PHP, kdy╛ by staΦilo HTML. P°itom Φasto zbyteΦn∞ pou╛φvajφ databßze, kterΘ cel² proces generovßnφ takΘ n∞kdy zpomalujφ. 

VelkΘ servery (zpravodajskΘ slu╛by, katalogy) databßze pou╛φvat musejφ, proto kv∙li urychlenφ pou╛φvajφ "p°edgenerovßnφ" strßnek. Strßnka se na serveru jednou sestavφ dynamicky, ale ulo╛φ se do statickΘho souboru. N∞kterΘ technologie pou╛φvajφ p°edgenerovßnφ implicitn∞ (JSP servlety, XML translety). 

Hardware 

╪φkat, ╛e na provoz web serveru je nov∞j╣φ poΦφtaΦ lep╣φ ne╛ star╣φ, je zbyteΦnΘ. Otßzka ale znφ o kolik je hor╣φ -- je to otßzka mφry. Mß smysl investovat do lep╣φho stroje? Obecn∞ nelze odpov∞d∞t. Ale mßte-li strßnky na stroji, kter² mß mßlo volnΘ pam∞ti a pomal² disk, p°em²╣lejte o n∞jakΘ zm∞n∞. 

Zatφ╛enost serveru

Do stejnΘ kategorie s hardwarem pat°φ i otßzka zatφ╛enosti. Obecn∞ se o tom zase nedß °φci skoro nic. Jestli╛e jeden poΦφtaΦ funguje zßrove≥ jako LAN-server, pracovnφ stanice a web server, je to asi ╣patn∞ (t°eba╛e Radim∙v domßcφ Linux takhle fungoval bez restartu p°es p∙l roku). Ale i stroj, kter² funguje pouze jako web server, m∙╛e b²t p°etφ╛en², pokud na n∞j p°ichßzφ p°φli╣ mnoho po╛adavk∙ nebo na n∞m b∞╛φ p°φli╣ mnoho slu╛eb. 

Softwarov² server a jeho konfigurace

Mezi nejΦast∞j╣φ zßstupce server∙ pat°φ IIS od Microsoftu a voln∞ ╣i°iteln² Apache. Oba majφ srovnateln² v²kon, v poslednφ dob∞ v∞°φm spφ╣e Apachi. Oba servery se dajφ snadno konfigurovat a u obou je snadnΘ konfiguraci n∞jak zkazit, tak╛e je pak server pomalej╣φ. Jde tam o r∙znΘ moduly a podobnΘ v∞ci. Moc tomu nerozumφm, proto rad∞ji sv∞°uji sprßvu serveru povolan∞j╣φm odbornφk∙m. 

Rychlost linky

Kdy╛ ╛enete oveΦky p°es propast, tak je jejich rychlost dßna neju╛╣φm mφstem mostu. Podobn∞ je to s p°enosem dat: rychlost je urΦena nejmΘn∞ propustnou linkou. ┌zkΘ mφsto m∙╛e b²t:

Pßte° je v²raz pro pßte°nφ sφ╗, co╛ je pßr docela dost rychl²ch kabel∙, kterΘ propojujφ hlavnφ internetovΘ uzly. Je to tak rychlß sφ╗, ╛e by se na nφ ·zkΘ mφsto (ve smyslu p°enosu strßnek) hledalo dost ╣patn∞.  

Rychlost linky u klienta rozhodn∞ neovlivnφte. Rychlost linky od serveru na pßte° je to jedinΘ, co vßs musφ zajφmat. Jde o to, aby nebyla pomalej╣φ ne╛ b∞╛nΘ p°ipojenφ u╛ivatel∙ (modem 56). P°itom je ale t°eba poΦφtat s reßlnou (nikoli s nominßlnφ) propustnostφ. Velk² objem p°enß╣en²ch dat reßlnou propustnost linky zpomaluje. Pokud t°eba na serveru b∞╛φ Napster stahujφcφ hafo MP3ojek nebo pokud je p°es linku napojena podnikovß sφ╗, tak vyd∞lte nominßlnφ propustnost dv∞ma, t°emi, Φty°mi. 

Hodn∞ poskytovatel∙ dnes nabφzφ web hosting p°φmo na pßte°i (vΦetn∞ freeweb∙ a poskytovatel∙ p°ipojenφ zdarma). V tom p°φpad∞ starosti s rychlostφ linky odpadajφ. 

Vizte tΘ╛: Zßklady nastavenφ serveru, Design pomocφ tabulek, P°φprava obrßzk∙ pro web, CSS - KaskßdovΘ styly, Programovßnφ strßnek

Pφ╣e Yuh∙
dusan@pc-slany.cz
mail formulß°em
Jak psßt web O tvorb∞, ·dr╛b∞ a zlep╣ovßnφ internetov²ch strßnek.

Zßklady HTML CSS FrontPage Hledßnφ

Obsah

Hlavnφ strßnka

Novinky

FAQ

Download

Zdroje

Hledßnφ


Roz╣φ°enΘ

Zßkladnφ kurs

Jak ud∞lat strßnku

Zßklady HTML

Publikovßnφ

Zßsady psanφ

Editory

R∙znΘ prohlφ╛eΦe

Editory

FrontPage 2000

FP Editor 98

Word 97

FrontPage Express

HTML tipy

P°φprava obrßzk∙

Obrßzky

Pozadφ

Odkazy

Vychytßvky odkaz∙

Zßlo╛ky

Aktivnφ mail

Tabulky

┌prava tabulek

Novinky tabulek

Design tabulkami

Rßmy

Formßtovßnφ rßm∙

Rßmy nepou╛φvat

Iframe

Formulß°e

Formulß°e v HTML

DokonalΘ formulß°e

Zßpis barev

Definice

Formßtovacφ chyby

Jak ud∞lat levΘ menu

Vyt∞╛ovßnφ strßnek

Provoz webu

Rychlost strßnek

VzdßlenΘ slu╛by

VyhledßvaΦe

Katalogy

Sprßva soubor∙

Ikona strßnky

Obsah / forma

╚e╣tina

Chyby Φe╣tiny

Tabulky k≤dovßnφ

Meta tagy

Nastavenφ serveru

Programovßnφ strßnek

ZaΦßtky PHP

Mo╛nosti PHP

Pou╛φvßnφ prohlφ╛eΦe

CSS styly

CSS styly

┌vod do CSS

Struktura textu

CSS prakticky

P╪EHLED VLASTNOST═ CSS

Slo╛it∞j╣φ deklarace

DΘlkovΘ jednotky

Pozicovßnφ

Sloupce pozicovßnφm

Okraje objekt∙

Odli╣enφ prohlφ╛eΦ∙

Omezenφ CSS

Odli╣n² tisk

DynamickΘ HTML

Filtry

P°φklady filtr∙

R∙znΘ barvy odkaz∙

Barva rolovacφ li╣ty

 


Jak psßt web: http://dusan.pc-slany.cz/internet/

Pφ╣e Yuh∙: autorova strßnka, mail: dusan@pc-slany.cz

Poslednφ aktualizace 22.12.2001