Ako optimalizovať web

Optimalizácia webu alebo e-shopu nie je niečo, čo riešiš až v momente, keď vznikne problém. V tom momente už väčšinou len hasíš dôsledky zlého rozhodnutia na začiatku.

Treba si otvorene povedať jednu vec: optimalizovať zle postavený web alebo e-shop je časovo náročné, drahé a často len čiastočné riešenie. Oveľa efektívnejšie je myslieť na optimalizáciu už pri samotnej tvorbe.

Cache nie je riešenie na začiatku

Veľa ľudí robí chybu, že hneď po spustení nasadí cache a má pocit, že tým vyriešil výkon. Cache ale nie je základ. Je to len vrstva navyše.

Používa sa hlavne:

• pri vysokej návštevnosti
• ako doplnok dobre postaveného systému

Reálny príklad z praxe

Na e-shope (tvojpar.sk) nebola na začiatku nasadená žiadna cache. A nebol s tým absolútne žiadny problém. Stránka bola rýchla, plynulá, bez akéhokoľvek spomalenia.

Problém nastal až počas marketingovej kampane.

Po nasadení základnej cache sa dáta načítavali z RAM, procesor sa odľahčil a e-shop fungoval bez problémov.

Pointa: ak by bol e-shop pomalý už pred cache, cache by nepomohla. Preto web musí byť rýchly bez cache.

Hosting má zásadný vplyv

Rýchlosť webu výrazne ovplyvňuje hosting. Veľa hostingových spoločností síce nevyzerá lacno, ale reálny výkon je slabý. Dôvod je jednoduchý – servery sú preťažené, aby firma maximalizovala zisk.

Na papieri môžeš mať napríklad pridelené 4 jadrá CPU. V realite ich má pridelených viac klientov naraz. To znamená, že všetci zdieľate výkon – ak jeden web server zaťaží, ostatní spomalia.

Hostingové firmy to riešia obmedzením výkonu, alebo úplným vypnutím webu.

Aký hosting zvoliť

Pri menších projektoch sa dá použiť klasický hosting, ale treba vybrať taký, ktorý má reálny výkon.

hostcreators.sk – pre väčšinu projektov

Z praxe odporúčame hostcreators.sk: stabilný výkon, kvalitná podpora, vhodné pre väčšinu webov a menších e-shopov.

exon.io – pre väčšie projekty

Pri väčších projektoch odporúčame exon.io: dedikovaný výkon, vyššia kontrola, vhodné skôr pre developerov. Treba rátať s tým, že nie je to jednoduché prostredie – pracuje sa viac technicky (napr. cPanel a podobne).

Vlastný server

Tretia možnosť je vlastný server. Výhody sú jasné: pevne daný výkon, plná kontrola, možnosť optimalizácie na mieru. Nevýhoda: treba vedieť, čo robíš – alebo to zveriť niekomu, kto server nastaví, optimalizuje a spravuje.

Obrázky vedia zabiť výkon

Veľmi častý problém. Bežná chyba sú obrázky s rozlíšením 4 000 px a veľkosťou 10–15 MB. Ak máš na stránke viac produktov, prehliadač musí stiahnuť desiatky až stovky MB – to je extrém.

Správny prístup:

• používať menšie rozlíšenie (cca do 1 000 px)
• komprimovať obrázky
• používať moderné formáty

Z formátov je dnes štandardom WEBP. Formát AVIF je síce menší, ale treba dávať pozor na podporu v prehliadačoch.

Fonty a CDN

Menšie veci, ktoré pomáhajú:

• Fonty – ideálne načítavať lokálne, nie z externých služieb
• CDN (napr. Cloudflare) – obsah sa načítava z najbližšieho servera, čo znamená rýchlejšie načítanie pre používateľa

Minifikácia CSS a JS

Minifikácia je jednoduchá vec, ktorú veľa ľudí ignoruje. Prehliadač číta každý znak – aj komentáre, aj prázdne riadky.

Príklad klasického CSS

/*sluzi na tlacidlo, ktore je na HP*/
.tlacidlo-domov {
    margin-top: 50px;
    margin-left: 20px;
    background-color: red; /*tu si mozeme zmenit farbu*/
}

/*CSS pre mini-cart*/
.shop-left {
    padding: 20px;
    color: white;
    gap: 15px /*urcujeme medzeru*/
}

Tento kód je pre človeka čitateľný, ale zbytočne veľký. Obsahuje komentáre, prázdne riadky a medzery.

Minifikovaná verzia

.tlacidlo-domov{margin-top:50px;margin-left:20px;background-color:red}.shop-left{padding:20px;color:#fff;gap:15px}

Menej dát, rýchlejšie načítanie. Pri veľkých projektoch je rozdiel výrazný. Riešiť sa to dá cez cache plugin (napr. WP Rocket) alebo manuálne cez nástroje ako cssminifier.

Lazy loading

Lazy loading znamená, že sa načítava len to, čo používateľ vidí. Zvyšok až pri scrollovaní. Výsledok: rýchlejší prvý load a lepší pocit z webu.

Pluginy ako skrytý problém

Pluginy sú pohodlné, ale majú veľký dopad. Každý plugin pridáva kód, zapisuje do databázy a spomaľuje systém.

Častý problém je preťažená tabuľka postmeta, čo vedie k pomalému načítaniu a pomalým dotazom. Veľa vecí sa dá spraviť priamo v kóde – čistejšie, rýchlejšie, bez balastu.

Zhrnutie

Ak chceš rýchly web alebo e-shop:

• musí byť dobre postavený od začiatku
• musí fungovať rýchlo bez cache
• musí bežať na kvalitnom hostingu
• musí mať optimalizované obrázky
• musí minimalizovať pluginy

Cache, CDN a podobné nástroje sú len doplnok – nie riešenie.

Záver

Web alebo e-shop má zarábať peniaze. Ak je pomalý, zákazník odchádza a konverzie klesajú. Ak je postavený zle, optimalizácia ho nezachráni.