Zrychlen\u00ed WordPress webu, je \u010dast\u00e9 t\u00e9ma \u010dl\u00e1nk\u016f na r\u016fzn\u00fdch bloz\u00edch, proto\u017ee to je neduh tohoto redak\u010dn\u00edho syst\u00e9mu. Ale m\u00e1lokter\u00fd v\u00e1m \u0159ekne, jak n\u00e1kladn\u00e9 to m\u016f\u017ee b\u00fdt a kolik v\u00e1s to bude st\u00e1t.<\/p>\n\n\n\n
Na za\u010d\u00e1tek se mus\u00edm p\u0159iznat, \u017ee o tomto t\u00e9matu jsem u\u017e p\u0159em\u00fd\u0161lel del\u0161\u00ed dobu, proto\u017ee \u010dl\u00e1nky o tom, jak zrychlit WordPress se na \u010desk\u00e9m internetu objevuj\u00ed snad co t\u00fdden. Bohu\u017eel, v\u011bt\u0161ina z nich je stokr\u00e1t to sam\u00e9. P\u0159e\u010dtete jeden a zn\u00e1te ostatn\u00edch 90%. \u010cest v\u00fdjimk\u00e1m.<\/p>\n\n\n\n
Ned\u00e1vno jsem si st\u00e1hl e-book o zrychlen\u00ed webu, ob\u011btoval jsem email a v\u00e1\u017en\u011b jsem cht\u011bl zjistit, zda se situace zlep\u0161ila. Bohu\u017eel nezlep\u0161ila. Ch\u00e1pu, \u017ee se ten \u010dlov\u011bk sna\u017eil, ale stokr\u00e1t nic umo\u0159ilo osla.<\/p>\n\n\n\n
Ale zp\u011bt k dne\u0161n\u00edmu \u010dl\u00e1nku. Vzal jsem body, kter\u00e9 jsou evergreenem ka\u017ed\u00e9ho n\u00e1vodu a ke ka\u017ed\u00e9mu jsem p\u0159ipsal sv\u016fj n\u00e1zor na jeho pou\u017eit\u00ed. V druh\u00e9 \u010d\u00e1sti jsem sepsal, jak to vid\u00edm s ekonomi\u010dnost\u00ed zrychlen\u00ed webu podle podobn\u00fdch n\u00e1vod\u016f a co m\u00e1 podle mne smysl d\u011blat a kdy. No a na z\u00e1v\u011br jsem p\u0159idal seznam \u010dl\u00e1nk\u016f, kter\u00e9 jsem na\u0161el p\u0159i letm\u00e9m nakouknut\u00ed do Google serpu, a\u0165 si m\u016f\u017eete ud\u011blat p\u0159edstavu. Pokud jste sepsali podobn\u00fd \u010dl\u00e1nek a chcete odkaz, napi\u0161te do koment\u00e1\u0159\u016f, kdy\u017e budu m\u00edt chv\u00edli a chu\u0165, p\u0159id\u00e1m jej k ostatn\u00edm.<\/p>\n\n\n\n
Prvn\u00ed bod je velmi d\u016fle\u017eit\u00fd, i kdy\u017e p\u0159\u00edmo s lad\u011bn\u00edm nesouvis\u00ed. Co nezn\u00e1te, nem\u016f\u017eete \u0159e\u0161it. Existuje spousta online n\u00e1stroj\u016f, kter\u00e9 m\u016f\u017eete pro testov\u00e1n\u00ed pou\u017e\u00edt, nejzn\u00e1m\u011bj\u0161\u00ed jsou https:\/\/www.webpagetest.org\/<\/a> a https:\/\/tools.pingdom.com\/<\/a>. Pingdom d\u00e1v\u00e1 o n\u011bco pozitivn\u011bj\u0161\u00ed v\u00fdsledky, Webpagetest je podrobn\u011bj\u0161\u00ed, pou\u017e\u00edv\u00e1m jej. V \u010dl\u00e1nc\u00edch se zmi\u0148uje i GT Metrics, ale ten nem\u00e1 servery bl\u00edzko \u010cR, tak\u017ee za mne nepou\u017eiteln\u00fd. Velmi dob\u0159e v\u00e1m m\u016f\u017ee poslou\u017eit i developer n\u00e1stroj v Chrome.<\/p>\n\n\n\n Testy v\u00e1m uk\u00e1\u017e\u00ed, kde m\u00e1te slab\u00e9 m\u00edsto. V\u011bt\u0161inou to b\u00fdv\u00e1 velikost str\u00e1nky, chyb\u011bj\u00edc\u00ed soubory ( st\u00e1v\u00e1 se dost \u010dasto u r\u016fzn\u00fdch plugin\u016f, kdy prohl\u00ed\u017ee\u010d \u010dek\u00e1 na na\u010dten\u00ed neexistuj\u00edc\u00ed ikony ), nebo dlouh\u00e1 odezva serveru.<\/p>\n\n\n\n N\u00e1klady<\/strong>: zdarma<\/p>\n\n\n\n Jeden z nej\u010dast\u011bji zmi\u0148ovan\u00fdch zp\u016fsob\u016f zrychlen\u00ed webu. Velmi zjednodu\u0161en\u011b \u0159e\u010deno, prohl\u00ed\u017ee\u010d mus\u00ed va\u0161i str\u00e1nku st\u00e1hnout, aby si ji mohl n\u011bkdo p\u0159e\u010d\u00edst. \u010c\u00edm v\u011bt\u0161\u00ed bude, t\u00edm d\u00e9le to bude trvat. A mas\u00edvn\u00ed nav\u00fd\u0161en\u00ed velikosti m\u016f\u017ee zp\u016fsobit neopatrn\u00fd u\u017eivatel, jen\u017e t\u0159eba do Revolution Slideru nahraje fotky p\u0159\u00edmo z fotoapar\u00e1tu. Plugin fotky nijak neoptimalizuje a lehce se stane, \u017ee jen hloup\u00fd slider, ud\u011bl\u00e1 na str\u00e1nce n\u011bkolik mega velikosti. \u0158e\u0161en\u00edm je optimalizovat datovou velikost obr\u00e1zk\u016f. Proto\u017ee v\u0161ak nem\u00e1te kontrolu nad n\u00e1hledov\u00fdmi obr\u00e1zky, kter\u00e9 vytv\u00e1\u0159\u00ed WordPress, nevyhnete se n\u011bkter\u00e9 ze slu\u017eeb, kter\u00e9 optimalizaci d\u011blaj\u00ed. V\u011bt\u0161ina z nich je placen\u00e1 a m\u00e1 plugin do WordPressu, kter\u00fd propoj\u00ed slu\u017ebu a v\u00e1\u0161 web. V\u00fdhodou je automatick\u00e9 komprese p\u0159i nahr\u00e1v\u00e1n\u00ed obr\u00e1zk\u016f do m\u00e9di\u00ed. J\u00e1 pou\u017e\u00edv\u00e1m Shortpixel<\/a>.<\/p>\n\n\n\n N\u00e1klady<\/strong>: des\u00edtky dolar\u016f, dle velikosti webu<\/p>\n\n\n\n Jinou z\u00e1le\u017eitost\u00ed jsou \u0161patn\u00e9 rozm\u011bry obr\u00e1zk\u016f. M\u016f\u017ee se st\u00e1t a ji\u017e jsem to za\u017eil, \u017ee program\u00e1tor \u0161patn\u011b nap\u00ed\u0161e k\u00f3d pro zobrazen\u00ed miniatury (bylo to v carouselu) a WordPress pak pou\u017eije origin\u00e1ln\u00ed obr\u00e1zek, proto\u017ee po\u017eadovanou velikost nenajde. Tak\u017ee m\u00edsto obr\u00e1zku 200×200 pixel\u016f, na\u010d\u00edt\u00e1 prohl\u00ed\u017ee\u010d 1200×600 pixel\u016f, co\u017e je podstatn\u011b v\u011bt\u0161\u00ed obr\u00e1zek. Je ale mo\u017en\u00e9, \u017ee program\u00e1tor v pluginu nadefinoval velikost n\u00e1hledu spr\u00e1vn\u011b, ale vy jste nov\u00e9 velikosti nevygenerovali. Pom\u016f\u017ee plugin https:\/\/cs.wordpress.org\/plugins\/regenerate-thumbnails\/<\/a><\/p>\n\n\n\n N\u00e1klady<\/strong>: hodinov\u00e1 sazba program\u00e1tora\/kod\u00e9ra – ned\u00e1 se p\u0159esn\u011b ur\u010dit, z\u00e1le\u017e\u00ed p\u0159\u00edpad od p\u0159\u00edpadu<\/p>\n\n\n\n Pokud chcete zrychlit WordPress, vypn\u011bte pluginy, kter\u00e9 jej zpomaluj\u00ed, sma\u017ete nepou\u017e\u00edvan\u00e9 a hlavn\u011b jich instalujte co nejm\u00e9n\u011b.<\/p>\n\n\n\n Tuto mantru najdete snad v ka\u017ed\u00e9m \u010dl\u00e1nku. Samoz\u0159ejm\u011b, \u017ee kdy\u017e vypnete v\u0161echny pluginy, kter\u00e9 web zpomaluj\u00ed, bude rychl\u00fd. Ot\u00e1zkou je co d\u011blat, kdy\u017e takov\u00fd plugin pot\u0159ebujete. WordPress je skv\u011bl\u00fd a pom\u011brn\u011b levn\u00fd, kdy\u017e se s va\u0161imi pot\u0159ebami tref\u00edte p\u0159esn\u011b do toho, co konkr\u00e9tn\u00ed plugin um\u00ed. Je to jako s elektronikou. V notebooku je to, co tam je a celkem s t\u00edm nic nem\u016f\u017eete d\u011blat. Bu\u010f se s t\u00edm sm\u00ed\u0159\u00edte, nebo si nech\u00e1te plugin napsat na m\u00edru. P\u0159\u00edpadn\u011b o\u017eel\u00edte funkce, kter\u00e9 plugin nab\u00edz\u00ed. Tady to bude v\u017edy n\u011bjak\u00fd kompromis – rychlost vs. funkce.<\/p>\n\n\n\n Nepou\u017e\u00edvan\u00e9 pluginy – zde to je jasn\u00e9, pokud plugin nepou\u017e\u00edv\u00e1te, sma\u017ete jej. Nevyp\u00ednejte, ale sma\u017ete. Tyto pluginy jsou \u010dasto p\u0159i aktualizac\u00edch p\u0159ehl\u00ed\u017een\u00e9 a mohou b\u00fdt potencion\u00e1ln\u011b nebezpe\u010dn\u00e9, pokud v nich bude zranitelnost a vy se vyka\u0161lete na update.<\/p>\n\n\n\n Co nejm\u00e9n\u011b nainstalovan\u00fdch plugin\u016f je op\u011bt p\u0159\u00edpad, kdy mus\u00edte pou\u017e\u00edt selsk\u00e9 my\u0161len\u00ed. Nen\u00ed toti\u017e plugin jako plugin a v p\u0159\u00edpad\u011b „velk\u00fdch“, jako jsou WooCommerce, WPML, BuddyPress dojde k zat\u00ed\u017een\u00ed a zpomalen\u00ed webu. \u010casto ale m\u016f\u017eete m\u00edt nainstalov\u00e1ny jednoduch\u00e9 pluginy, obsahuj\u00edc\u00ed p\u00e1r funkc\u00ed a pak je jedno, zda jich je 5, nebo 10. Zvl\u00e1\u0161tn\u00ed p\u0159\u00edpad jsou pluginy, kter\u00e9 se na frontendu nijak neprojevuj\u00ed. Nap\u0159\u00edklad n\u00e1stroje pro optimalizaci datab\u00e1ze. Takov\u00fd plugin v\u00e1m na\u010d\u00edt\u00e1n\u00ed webu nijak neovlivn\u00ed.<\/p>\n\n\n\n Na\u0161t\u011bst\u00ed, pro b\u011b\u017en\u00e9 z\u00e1le\u017eitosti se najdou v\u017edy n\u011bjak\u00e9 alternativy, m\u016f\u017eete vyzkou\u0161et v\u00edce mo\u017enost\u00ed a t\u0159eba najdete n\u011bjak\u00fd plugin, kter\u00fd bude podstatn\u011b lep\u0161\u00ed ne\u017e ten, kter\u00fd pou\u017e\u00edv\u00e1te. V tomto bodu nehodnot\u00edm kvalitu k\u00f3du, kter\u00fd tak\u00e9 m\u016f\u017ee zpomalit web, ale to b\u011b\u017en\u00fd u\u017eivatel nezjist\u00ed.<\/p>\n\n\n\n N\u00e1klady<\/strong>: \u010das na nalezen\u00ed nejvhodn\u011bj\u0161\u00edho a nejlep\u0161\u00edho pluginu pro va\u0161e pot\u0159eby – velmi individu\u00e1ln\u00ed n\u00e1klady, ale proto\u017ee m\u00e1me tendenci nepo\u010d\u00edtat sv\u016fj \u010das, tak jej \u0159ad\u00edm mezi m\u00e9n\u011b n\u00e1kladn\u00e9 \u010d\u00e1sti optimalizace<\/p>\n\n\n\n U \u0161ablon je situace podobn\u00e1, jako u plugin\u016f. V\u011bt\u0161ina lid\u00ed pou\u017e\u00edv\u00e1 ji\u017e vytvo\u0159en\u00e9 produkty a t\u011bm se mus\u00ed p\u0159izp\u016fsobit. Tak\u017ee v\u00fdb\u011br \u0161ablony je velmi d\u016fle\u017eit\u00fd. Nav\u00edc, u pr\u00e9miov\u00fdch produkt\u016f se sna\u017e\u00ed prodejci co nejv\u00edce „nale\u0161tit“ v\u00fdsledek, tak\u017ee takov\u00e9 \u0161ablony jsou pln\u00e9 vcelku zbyte\u010dn\u00fdch js a css soubor\u016f. M\u00e1te sice mo\u017enost \u010d\u00e1ste\u010dn\u011b ovlivnit na\u010d\u00edt\u00e1n\u00ed soubor\u016f pomoc\u00ed dequeue v child \u0161ablon\u011b, ale \u010dasto jsou tyto soubory v n\u011bjak\u00e9 z\u00e1vislosti a vy pak zbo\u0159\u00edte cel\u00fd vzhled. V\u011bt\u0161inou se bez pomoci program\u00e1tora neobejdete. Tak\u017ee v\u00e1m zb\u00fdv\u00e1, vybrat si jinou \u0161ablonu, nebo pou\u017e\u00edt cache, viz. bod 12.<\/p>\n\n\n\n N\u00e1klady<\/strong>: individu\u00e1ln\u00ed – na v\u00fdb\u011br a testov\u00e1n\u00ed vhodn\u00e9 \u0161ablony<\/p>\n\n\n\n Dal\u0161\u00ed mo\u017enost\u00ed, jak vylep\u0161it na\u010d\u00edt\u00e1n\u00ed webu v tomto bodu, je stavba vlastn\u00ed optimalizovan\u00e9 \u0161ablony. Zde si m\u016f\u017eete p\u0159esn\u011b definovat co budete v \u0161ablon\u011b cht\u00edt a pohl\u00eddat si v\u00fdsledek. Rychlost pak ur\u010dit\u011b lep\u0161\u00ed ne\u017e u zakoupen\u00e9 \u0161ablony.<\/p>\n\n\n\n N\u00e1klady<\/strong>: 20 – 100 tis\u00edc, dle zad\u00e1n\u00ed a slo\u017eitosti.<\/p>\n\n\n\n Optimalizace datab\u00e1ze v\u011bt\u0161inou spo\u010d\u00edv\u00e1 v promaz\u00e1n\u00ed vypr\u0161en\u00fdch do\u010dasn\u00fdch z\u00e1znam\u016f, vymaz\u00e1n\u00ed reviz\u00ed ulo\u017een\u00fdch post\u016f, odstran\u011bn\u00ed „osi\u0159el\u00fdch“ dat po smaz\u00e1n\u00ed n\u011bjak\u00e9ho obsahu. Smaz\u00e1n\u00ed osi\u0159el\u00fdch variant je pom\u011brn\u011b prosp\u011b\u0161n\u00e9 u WooCommerce, kde m\u016f\u017ee z n\u011bjak\u00e9ho d\u016fvodu, z\u016fstav datab\u00e1zi varianta produktu, bez nad\u0159azen\u00e9ho variantn\u00edho produktu. \u010casto takov\u00e9 promaz\u00e1n\u00ed zna\u010dn\u011b zmen\u0161\u00ed tabulku postmeta, \u010d\u00edm\u017e se zrychl\u00ed datab\u00e1zov\u00e9 dotazy. Existuje \u0159ada plugin\u016f, kter\u00e9 v\u00e1m s t\u00edm pomohou, nap\u0159\u00edklad https:\/\/cs.wordpress.org\/plugins\/wp-sweep\/<\/a>, ale pamatujte na z\u00e1lohu p\u0159ed ka\u017edou optimalizac\u00ed.<\/p>\n\n\n\n N\u00e1klady<\/strong>: minim\u00e1ln\u00ed – pouze \u010das na spu\u0161t\u011bn\u00ed procedur optimaliza\u010dn\u00edho pluginu.<\/p>\n\n\n\n Tohle je obl\u00edben\u00e1 \u010d\u00e1st pro v\u0161echny st\u011b\u017eovatele. Nen\u00ed snad t\u00fdden, aby se v diskuz\u00edch neobjevilo vl\u00e1kno, kde si n\u011bkdo st\u011b\u017euje na to, \u017ee m\u00e1 pomal\u00fd web a m\u016f\u017ee za to hosting. A z\u00e1rove\u0148 jsou tato vl\u00e1kna nejpopul\u00e1rn\u011bj\u0161\u00ed. Nebudu jmenovat, ale jeden z \u010desk\u00fdch hosting\u016f je p\u0159\u00edmo hromosvod pro takov\u00e9 lidi.<\/p>\n\n\n\n Neexistuje pomal\u00fd hosting. To, co si plat\u00edte, je tarif hostingu. Ka\u017ed\u00fd hosting jich nab\u00edz\u00ed n\u011bkolik a dostanete to co si zaplat\u00edte. Kdy\u017e si koup\u00edte sd\u00edlen\u00fd hostingov\u00fd tarif za p\u00e1r desetikorun m\u011bs\u00ed\u010dn\u011b, nesm\u00edte se divit, \u017ee rychlost va\u0161eho webu kol\u00eds\u00e1. V\u00fdkon stroje, na kter\u00e9m je v\u00e1\u0161 web je sd\u00edlen s ostatn\u00edmi weby na serveru.<\/p>\n\n\n\n V \u010dl\u00e1nc\u00edch se uv\u00e1d\u00ed, \u017ee \u010das, kdy server odpov\u00ed ( ozna\u010dovan\u00fd jako TTFB ), z\u00e1vis\u00ed na tom jak v\u00fdkonn\u00fd hosting m\u00e1te. To je i nen\u00ed pravda. V tu chv\u00edli, kdy zapnete cache plugin, server v\u00e1m vrac\u00ed html str\u00e1nku a odpov\u011b\u010f by m\u011bla b\u00fdt co nejkrat\u0161\u00ed. Pokud toto ud\u011bl\u00e1te a TTFB budete m\u00edt dlouh\u00fd, pak je t\u0159eba za\u010d\u00edt hledat probl\u00e9m. A t\u00edm m\u016f\u017ee b\u00fdt i nedostate\u010dn\u00fd v\u00fdkon stroje a jeho p\u0159et\u00ed\u017een\u00ed, kdy zpracov\u00e1v\u00e1 po\u017eadavky a v\u00e1\u0161 stoj\u00ed ve front\u011b.<\/p>\n\n\n\n Pak by p\u0159i\u0161la na \u0159adu zm\u011bna tarifu hostingu. \u00damysln\u011b p\u00ed\u0161i tarifu, proto\u017ee ka\u017ed\u00e1 firma v\u00e1m bude schopna nab\u00eddnout lep\u0161\u00ed v\u00fdkon, ale samoz\u0159ejm\u011b za del\u0161\u00ed pen\u00edze. Toto rozhodnut\u00ed je p\u0159edev\u0161\u00edm na v\u00e1s, ale po\u010d\u00edtejte s t\u00edm, \u017ee \u010d\u00edm lep\u0161\u00ed stroj, t\u00edm v\u011bt\u0161\u00ed rychlost hlavn\u011b u WooCommerce eshop\u016f, co\u017e pozn\u00e1te p\u0159edev\u0161\u00edm na pokladn\u011b, kde se na pozad\u00ed prov\u00e1d\u00ed \u0159ada PHP funkc\u00ed, kter\u00e9 v\u011bt\u0161inou nejsou cacheovan\u00e9.<\/p>\n\n\n\n Pokud p\u0159ejdete na lep\u0161\u00ed stroj, pozn\u00e1te zlep\u0161en\u00ed na prvn\u00ed pohled p\u0159edev\u0161\u00edm v administraci WordPressu.<\/p>\n\n\n\n N\u00e1klady<\/strong>: individu\u00e1ln\u00ed – sd\u00edlen\u00fd hosting desetikoruny m\u011bs\u00ed\u010dn\u011b, virtu\u00e1ln\u00ed server – stokoruny m\u011bs\u00ed\u010dn\u011b, dedikovan\u00fd server – tis\u00edcikoruny m\u011bs\u00ed\u010dn\u011b.<\/p>\n\n\n\n Tyto body jsem shrnul do jednoho, proto\u017ee se jedn\u00e1 o v\u011bci, kter\u00e9 nejsou p\u0159\u00edmo u\u017eivatelsk\u00e9, ale v\u011bt\u0161ina z nich by m\u011bla ji\u017e b\u00fdt b\u011b\u017en\u00e1 na v\u0161ech hostinz\u00edch. Proto\u017ee jsou v n\u00e1vodech na zrychlen\u00ed uv\u00e1d\u011bny, pat\u0159\u00ed to sem tak\u00e9.<\/p>\n\n\n\n Verze PHP zrychl\u00ed v\u00e1\u0161 web – ano i ne. Zrychl\u00ed prov\u00e1d\u011bn\u00ed PHP, co\u017e zaznamen\u00e1te u \u010d\u00e1st\u00ed, na kter\u00e9 nen\u00ed pou\u017eit\u00e1 cache. T\u0159eba u ajax dotaz\u016f asi nam\u011b\u0159\u00edte zlep\u0161en\u00ed, ale rychlost nez\u00e1vis\u00ed jen na PHP, ale i na tom, jak je napsan\u00e1 js \u010d\u00e1st, jak rychle dojde k nav\u00e1z\u00e1n\u00ed spojen\u00ed, atd. Proto\u017ee by ale m\u011bla b\u00fdt PHP verze 7 automaticky ji\u017e na ka\u017ed\u00e9m hostingov\u00e9m tarifu, beru to jako samoz\u0159ejmost. Pokud nem\u00e1te PHP 7+, po\u017e\u00e1dejte v\u00e1\u0161 hosting o nav\u00fd\u0161en\u00ed a pokud to nep\u016fjde, je \u010das p\u0159ej\u00edt jinam.<\/p>\n\n\n\n HTTP 2 – podobn\u011b jako verze PHP, zrychl\u00ed na\u010dten\u00ed va\u0161eho webu a m\u011blo by b\u00fdt na hostinz\u00edch ji\u017e automaticky. \u010cetl jsem n\u011bkolik \u010dl\u00e1nk\u016f, kter\u00e9 sice n\u011bjak\u00e9 dramatick\u00e9 zlep\u0161en\u00ed rozporuj\u00ed, ale ni\u010demu to neubl\u00ed\u017e\u00ed a rychlost to zlep\u0161it m\u016f\u017ee. Jen kr\u00e1tce, jak to funguje – prohl\u00ed\u017ee\u010d u p\u0159edchoz\u00edho protokolu nav\u00e1zal spojen\u00ed, st\u00e1hl css soubor, pak nav\u00e1zal dal\u0161\u00ed spojen\u00ed a st\u00e1hl dal\u0161\u00ed soubor v po\u0159ad\u00ed. U HTTP 2 prohl\u00ed\u017ee\u010d nav\u00e1\u017ee spojen\u00ed n\u011bkolik na jednou a stahuje soubory. Doch\u00e1z\u00ed tak k men\u0161\u00edm prodlev\u00e1m p\u0159i opakovan\u00e9m navazov\u00e1n\u00ed spojen\u00ed. U HTTP se proto doporu\u010dovalo spojovat css a js soubory do jednoho v\u011bt\u0161\u00edho, aby se po\u010det spojen\u00ed co nejv\u00edce sn\u00ed\u017eil.<\/p>\n\n\n\n CDN – je zjednodu\u0161en\u011b \u0159e\u010deno rozkop\u00edrov\u00e1n\u00ed statick\u00fdch soubor\u016f (obr\u00e1zky, css, js a podobn\u011b) na v\u00edce server\u016f po cel\u00e9m sv\u011bt\u011b tak, aby Prohl\u00ed\u017ee\u010d tyto soubory stahoval z um\u00edst\u011bn\u00ed, kter\u00e9 je bli\u017e\u0161\u00ed, ne\u017e v\u00e1\u0161 hosting. Sni\u017euje se tak prodleva p\u0159i p\u0159esunu dat, proto\u017ee ze serveru v Thajsku budete obr\u00e1zek stahovat del\u0161\u00ed dobu ne\u017e ze serveru v Praze. Pokud tedy nejste v Thajsku. CDN je nezbytn\u00e9 pro v\u0161echny projekty, kter\u00e9 maj\u00ed mezin\u00e1rodn\u00ed ambice, u lok\u00e1ln\u00edch webu to zas a\u017e takov\u00fd v\u00fdznam nem\u00e1. Existuje \u0159ada slu\u017eeb, kter\u00e9 v\u00e1m pou\u017eit\u00ed DNS umo\u017en\u00ed, nap\u0159\u00edklad CloudFlare. V\u011bt\u0161ina z nich m\u00e1 i WordPress plugin, pomoc\u00ed kter\u00e9ho se slu\u017ebou propoj\u00edte.<\/p>\n\n\n\n N\u00e1klady<\/strong>: – minim\u00e1ln\u00ed, pouze u CDN dle pou\u017eit\u00e9 slu\u017eby, poplatky za pou\u017eit\u00ed.<\/p>\n\n\n\n Po obr\u00e1zc\u00edch jsou javascriptov\u00e9 soubory nejv\u011bt\u0161\u00ed brzdou na\u010d\u00edt\u00e1n\u00ed webu a op\u011bt z\u00e1le\u017e\u00ed na tom, jakou m\u00e1te \u0161ablonu a jak\u00e9 jste pou\u017eili pluginy. Pokud nem\u016f\u017eete vytvo\u0159it vlastn\u00ed \u0161ablonu a pluginy, abyste optimalizovali k\u00f3d, mus\u00edte se spolehnout na to, jak jsou napsan\u00e9 ty, kter\u00e9 jste pou\u017eili. \u010casto tak m\u016f\u017eete na\u010d\u00edtat v podstat\u011b duplicitn\u00ed, nebo zbyte\u010dnou funk\u010dnost a jedinou mo\u017enost\u00ed, jak zrychlit web, je minifikace soubor\u016f, nebo jejich asynchronn\u00ed na\u010d\u00edt\u00e1n\u00ed. Proto\u017ee to je celkem b\u011b\u017en\u00e1 sou\u010d\u00e1st cache plugin\u016f, sta\u010d\u00ed to v\u011bt\u0161inou nastavit. Zde ale m\u016f\u017eete narazit na probl\u00e9m, kdy po aktivaci odlo\u017een\u00e9ho na\u010dten\u00ed js soubor\u016f v\u00e1m p\u0159estane fungovat \u010d\u00e1st webu. To je proto\u017ee, nem\u00e1te plnou kontrolu nad t\u00edm, jak a v jak\u00e9 z\u00e1vislosti jsou js soubory vkl\u00e1d\u00e1ny do str\u00e1nky. Dal\u0161\u00edm probl\u00e9mem u WordPressu m\u016f\u017ee b\u00fdt, p\u0159esunut\u00ed na\u010d\u00edt\u00e1n\u00ed js souboru do pati\u010dky, jak doporu\u010duje t\u0159eba Google, ale proto\u017ee je v\u011bt\u0161ina plugin\u016f a \u0161ablon z\u00e1visl\u00e1 na jQuery, m\u016f\u017eete si t\u00edm zad\u011blat na probl\u00e9m.<\/p>\n\n\n\n N\u00e1klady<\/strong>: minim\u00e1ln\u00ed, proto\u017ee minifikace a asynchronn\u00ed na\u010d\u00edt\u00e1n\u00ed je sou\u010d\u00e1st\u00ed cache plugin\u016f. Optimalizaci js k\u00f3du zde v\u016fbec neuva\u017euji, n\u00e1klady na takovou optimalizaci se mohou vy\u0161plhat na desetitis\u00edce.<\/p>\n\n\n\n Css soubory jsou dal\u0161\u00ed \u010d\u00e1sti, kter\u00e9 se velmi \u010dasto zmi\u0148uj\u00ed p\u0159i optimalizaci webu, pro rychlej\u0161\u00ed zobrazen\u00ed. D\u00e1 se \u0159\u00edci, \u017ee pro n\u011b plat\u00ed podobn\u00e9 pravidle, jako pro js soubory, tedy minifikace. Ta, na rozd\u00edl od minifikace js soubor\u016f spo\u010d\u00edv\u00e1 jen v odstran\u011bn\u00ed mezer v souboru a koment\u00e1\u0159\u016f. St\u00e1le plat\u00ed, \u017ee rozhoduj\u00edc\u00ed je velikost webu a pokud budete cht\u00edt u\u0161et\u0159it co nejv\u00edce, m\u016f\u017eete optimalizovat css k\u00f3d odstran\u011bn\u00edm duplicitn\u00edch pravidel. \u010c\u00edm v\u00edce zmen\u0161\u00edte velikost souboru, t\u00edm l\u00e9pe. Stejn\u011b jako u javascritpu plat\u00ed, \u017ee tato optimalizace m\u016f\u017ee b\u00fdt pom\u011brn\u011b n\u00e1kladn\u00e1, na rozd\u00edl od minifikace a spojen\u00ed soubor\u016f, kterou um\u00ed ka\u017ed\u00fd cache plugin. Pozn\u00e1mka na konec – inline styly nejde cacheovat a to sam\u00e9 plat\u00ed i o stylech nacpan\u00fdch hlavi\u010dky pomoc\u00ed customiz\u00e9ru, tak\u017ee pou\u017e\u00edvat co nejm\u00e9n\u011b, pouze v nejnutn\u011bj\u0161\u00edch p\u0159\u00edpadech. Co\u017e m\u016f\u017ee b\u00fdt i vykreslen\u00ed kritick\u00e9ho css https:\/\/www.vzhurudolu.cz\/blog\/35-critical-css<\/p>\n\n\n\n N\u00e1klady<\/strong>: minim\u00e1ln\u00ed, nastaven\u00ed obsahuj\u00ed v\u0161echny cache pluginy. Optimalizaci neuva\u017euji.<\/p>\n\n\n\n Stejn\u011b, jako css a js soubory, lze minifikovat i html k\u00f3d. St\u00e1le jde o co nejv\u011bt\u0161\u00ed zmen\u0161en\u00ed velikosti str\u00e1nky a proto\u017ee to um\u00ed tak\u00e9 v\u011bt\u0161ina cache plugin, sta\u010d\u00ed to zapnout. N\u011bkter\u00e9 pluginy um\u00ed odstranit i koment\u00e1\u0159e z k\u00f3du, ale testujte, ob\u010das se web nezobrazuje spr\u00e1vn\u011b. Samoz\u0159ejm\u011b, \u017ee i zde lze pou\u017e\u00edt optimalizaci html k\u00f3du, ale op\u011bt, pokud na to nem\u00e1te budget, nepou\u0161t\u011bjte se do toho. a pokud m\u00e1te dostatek financ\u00ed, rad\u011bji si nechte napsat rovnou \u0161ablonu na m\u00edru.<\/p>\n\n\n\n N\u00e1klady<\/strong>: minim\u00e1ln\u00ed – sou\u010d\u00e1st cache plugin\u016f, nebo free pluginy na WordPress.org<\/p>\n\n\n\n Dost\u00e1v\u00e1me se k \u010d\u00e1sti, kter\u00e1 v\u00e1m m\u016f\u017ee velmi vylep\u0161it u\u017eivatelsk\u00fd dojem, p\u0159i zobrazov\u00e1n\u00ed webu, p\u0159edev\u0161\u00edm u magaz\u00edn, eshop\u016f a web\u016f, kter\u00e9 maj\u00ed velk\u00e9 mno\u017estv\u00ed obr\u00e1zk\u016f. P\u0159i pou\u017eit\u00ed lazy loadingu se na\u010d\u00edtaj\u00ed obr\u00e1zky, kter\u00e9 jsou vid\u011bt na displeji za\u0159\u00edzen\u00ed a ty kter\u00e9 jsou „mimo“ obrazovku se nahrad\u00ed jednopixelov\u00fdm obr\u00e1zkem s minim\u00e1ln\u00ed velikost\u00ed. Tak jak za\u010dnete scrolovat str\u00e1nkou, jsou obr\u00e1zky dona\u010d\u00edt\u00e1ny. D\u00edky tomu se m\u016f\u017ee velikost p\u0159enesen\u00fdch dat radik\u00e1ln\u011b sn\u00ed\u017eit a web bude podstatn\u011b svi\u017en\u011bj\u0161\u00ed. V\u011bt\u0161ina cache plugin\u016f to um\u00ed, nebo je mo\u017en\u00e9 pou\u017e\u00edt free pluginy z WordPress.org.<\/p>\n\n\n\n K lazy loadingu chci \u0159\u00edci, \u017ee velmi postr\u00e1d\u00e1m jeho pou\u017eit\u00ed t\u0159eba u carousel\u016f, kdy se \u010dasto na\u010d\u00edt\u00e1 o 16 n\u00e1hled\u016f, i kdy\u017e viditeln\u00e9 jsou 4. Ale to je ji\u017e z\u00e1le\u017eitost program\u00e1tor\u016f.<\/p>\n\n\n\n Lazy loading se d\u00e1 pou\u017e\u00edt i na \u010d\u00e1sti html k\u00f3du, ale to je mimo rozsah tohoto \u010dl\u00e1nku.<\/p>\n\n\n\n N\u00e1klady<\/strong>: minim\u00e1ln\u00ed, cache pluginy um\u00ed, lze pou\u017e\u00edt free pluginy z WordPress.org.<\/p>\n\n\n\n Zde mus\u00edm napsat, \u017ee se budeme bavit o cache na stran\u011b webu, ne o serverov\u00e9 cache, co\u017e je z\u00e1le\u017eitost hostingu. A tak\u00e9, \u017ee se budeme bavit o pluginech, kter\u00e9 to um\u00ed, proto\u017ee to je nejlep\u0161\u00ed a nejlevn\u011bj\u0161\u00ed \u0159e\u0161en\u00ed. V podstat\u011b si takov\u00fd plugin ulo\u017e\u00ed html str\u00e1nku do n\u011bjak\u00e9ho souboru a m\u00e1 nastaveno, jak dlouho je ta ulo\u017een\u00e1 str\u00e1nka platn\u00e1. A kdy\u017e pak p\u0159ijde na web n\u00e1v\u0161t\u011bvn\u00edk, tento html soubor po\u0161le server prohl\u00ed\u017ee\u010di. A to je v podstat\u011b v\u0161e. D\u00edky tomu se neprov\u00e1d\u00ed php funkce a odpov\u011b\u010f serveru je t\u00e9m\u011b\u0159 okam\u017eit\u00e1. Pokud pou\u017eijete cache plugin, okam\u017eit\u011b v\u00e1m spadne ukazatel TTFB.<\/p>\n\n\n\n Jde v\u0161ak jen o zrychlen\u00ed prvn\u00edho zobrazen\u00ed webu. V p\u0159\u00edpad\u011b, \u017ee m\u00e1te na str\u00e1nk\u00e1ch n\u011bjak\u00fd js script, kter\u00fd p\u0159ekresluje \u010d\u00e1sti str\u00e1nek, nebo na pozad\u00ed n\u011bco vykon\u00e1v\u00e1, net\u00fdk\u00e1 se to ji\u017e t\u00e9to cache. Probl\u00e9m tak\u00e9 m\u016f\u017ee nastat, pokud umo\u017e\u0148ujete u\u017eivatel\u016fm se p\u0159ihl\u00e1sit a na n\u011bkter\u00e9 \u010dasti webu se cache nepou\u017e\u00edv\u00e1. Nap\u0159\u00edklad WooCommerce si ukl\u00e1d\u00e1 data produktu do datab\u00e1ze a pak na\u010d\u00edt\u00e1 tato data, aby je nemusela znovu generovat.<\/p>\n\n\n\n Na WordPress.org najdete \u0159adu cache plugin\u016f, kter\u00e9 jsou zdarma a \u0159adu z nich jsem vyzkou\u0161el. V\u011bt\u0161inou jsem je musel kombinovat, nap\u0159\u00edklad s pluginem Autoptimize<\/a>, ale nakonec jsem \u0161\u00e1hnul po plugin WP Rocket, kter\u00fd je sice placen\u00fd, ale m\u00e1 nejlep\u0161\u00ed v\u00fdsledky z hlediska pom\u011bru v\u00fdkon\/cena\/nastavov\u00e1n\u00ed. V podstat\u011b sta\u010d\u00ed zapnout.<\/p>\n\n\n\n N\u00e1klady<\/strong>: minim\u00e1ln\u00ed, p\u0159i pou\u017eit\u00ed free plugin\u016f\/ 50 dolar\u016f ro\u010dn\u011b p\u0159i pou\u017eit\u00ed WP Rocket<\/p>\n\n\n\n AMP je form\u00e1t, kter\u00fd posledn\u00ed dobou docela propaguje Google, p\u0159edev\u0161\u00edm pro mobiln\u00ed za\u0159\u00edzen\u00ed. Jde o to, \u017ee ze str\u00e1nky osek\u00e1 v\u0161e nepodstatn\u00e9 a nech\u00e1 jen obsahovou \u010d\u00e1st. Vhodn\u00e9 pro blogy a magaz\u00edny, pro eshopy moc ne. Web se pak na\u010d\u00edt\u00e1 bleskov\u011b. Na Musilda.cz m\u00e1m AMP aktivn\u00ed, ale nikdy jsem to nem\u011b\u0159il, tak\u017ee v\u00e1m nemohu \u0159\u00edci, jak pou\u017e\u00edvan\u00e9 to je. Pro nasazen\u00ed pou\u017eijte free plugin z WordPess.org https:\/\/cs.wordpress.org\/plugins\/amp\/<\/a><\/p>\n\n\n\n N\u00e1klady<\/strong>: minim\u00e1ln\u00ed, instalace free pluginu.<\/p>\n\n\n\n Aktualizace se zmi\u0148uj\u00ed sp\u00ed\u0161e ve spojen\u00ed s bezpe\u010dnost\u00ed, ale i rychlost webu \u010dasto souvis\u00ed s aktualizovan\u00fdmi pluginy. M\u016f\u017ee se st\u00e1t, \u017ee plugin pou\u017e\u00edv\u00e1 n\u011bjakou knihovnu, um\u00edst\u011bnou na extern\u00edm serveru a po ur\u010dit\u00e9 dob\u011b se zm\u011bn\u00ed jej\u00ed um\u00edst\u011bn\u00ed. Prohl\u00ed\u017ee\u010d se pak sna\u017e\u00ed na\u010d\u00edst neexistuj\u00edc\u00ed soubor a web bude zpomalen. P\u0159\u00edpadn\u011b si v\u00fdvoj\u00e1\u0159i uv\u011bdom\u00ed n\u011bjak\u00fd probl\u00e9m, kter\u00fd jejich plugin zp\u016fsobuje a oprav\u00ed jej. P\u0159\u00edkladem mohou b\u00fdt webhooky ve WooCommerce, kdy se plugin sna\u017eil na\u010d\u00edtat i neaktivn\u00ed webhooky. Probl\u00e9m byl v aktu\u00e1ln\u00ed verzi pluginu odstran\u011bn.<\/p>\n\n\n\n N\u00e1klady<\/strong>: n\u00edzk\u00e9 – \u010das na aktualizace a testov\u00e1n\u00ed funk\u010dnosti webu.<\/p>\n\n\n\n V p\u0159\u00edpad\u011b, \u017ee se v\u00e1m zd\u00e1 v\u00e1\u0161 web pomal\u00fd a chcete jej zrychlit, projdete si n\u011bkolik n\u00e1vod\u016f na zrychlen\u00ed, bude v\u00e1s zaj\u00edmat, co to bude st\u00e1t.<\/p>\n\n\n\n Vyjdeme z p\u0159edpokladu, \u017ee m\u00e1te b\u011b\u017en\u00fd WordPress web, nebo magaz\u00edn, \u017e\u00e1dn\u00e9 rozs\u00e1hl\u00e9 datab\u00e1ze, \u010di eshop a zvl\u00e1d\u00e1te z\u00e1kladn\u00ed pr\u00e1ci s WordPressem, jako je instalace a nastevn\u00ed plugin\u016f a \u0161ablon.<\/p>\n\n\n\n A to je v podstat\u011b v\u0161echno, pokud nem\u00e1te k dispozici rozpo\u010det v des\u00edtk\u00e1ch tis\u00edc korun. V\u00fdsledky z\u00e1le\u017e\u00ed na tom, jak\u00fd je v\u00fdchoz\u00ed stav. Ob\u010das m\u016f\u017eete narazit na titulky – Jak jsme zrychlili web o 380%<\/strong> a podobn\u011b.<\/p>\n\n\n\n Je ale rozd\u00edl, zda se sna\u017e\u00edte optimalizovat web, kter\u00fd se na\u010d\u00edt\u00e1 12 vte\u0159in a web, kter\u00fd se na\u010d\u00edt\u00e1 3 vte\u0159iny.<\/p>\n\n\n\n Pokud ud\u011bl\u00e1te to co jsem popsal v\u00fd\u0161e, je velk\u00e1 pravd\u011bpodobnost, \u017ee pokud nebude \u0161ablona opravdu \u0161patn\u00e1, dos\u00e1hnete v\u00fdsledku mezi 2 a 3 vte\u0159inami. Co\u017e je dosta\u010duj\u00edc\u00ed v\u00fdsledek, kdy\u017e budeme nohama na zemi.<\/p>\n\n\n\n Samoz\u0159ejm\u011b, \u017ee m\u016f\u017eete cht\u00edt dos\u00e1hnout je\u0161t\u011b v\u011bt\u0161\u00ed rychlosti. Ale zde pak rostou velmi v\u00fdrazn\u011b n\u00e1klady na optimalizaci a bez program\u00e1tora, nebo kod\u00e9ra se neobejdete. Tak\u017ee, pokud m\u00e1te web, kter\u00fd generuje n\u011bjak\u00fd zisk a chcete do optimalizace investovat, rad\u011bji se rozhodn\u011bte pro vlastn\u00ed \u0161ablonu, kter\u00e1 bude ji\u017e od za\u010d\u00e1tku uzp\u016fsoben\u00e1 va\u0161im pot\u0159eb\u00e1m a nebude obsahovat nic nav\u00edc, co by web brzdilo.<\/p>\n\n\n\n P.S.: v\u017edy se daj\u00ed naj\u00edt cesty, jak drobn\u011b po kousk\u00e1ch web zrychlovat a pokud t\u011bch mali\u010dkost\u00ed ud\u011bl\u00e1te dostatek, web bude opravdu svi\u017en\u00fd. Kdy\u017e si v\u0161ak spo\u010d\u00edt\u00e1te hodnotu vlastn\u00ed pr\u00e1ce, budete zase na desetitis\u00edc\u00edch.<\/p>\n\n\n\n Zrychlen\u00ed WordPress webu, je \u010dast\u00e9 t\u00e9ma \u010dl\u00e1nk\u016f na r\u016fzn\u00fdch bloz\u00edch, proto\u017ee to je neduh tohoto redak\u010dn\u00edho syst\u00e9mu. Ale m\u00e1lokter\u00fd v\u00e1m \u0159ekne, jak n\u00e1kladn\u00e9 to m\u016f\u017ee b\u00fdt a kolik v\u00e1s to bude st\u00e1t. Na za\u010d\u00e1tek se mus\u00edm p\u0159iznat, \u017ee o tomto t\u00e9matu jsem u\u017e p\u0159em\u00fd\u0161lel del\u0161\u00ed dobu, proto\u017ee \u010dl\u00e1nky o tom, jak zrychlit WordPress se na<\/p>\n","protected":false},"author":1,"featured_media":8644,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"rank_math_lock_modified_date":false,"footnotes":""},"categories":[30],"tags":[],"class_list":["post-5153","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-wordpress"],"_links":{"self":[{"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/posts\/5153"}],"collection":[{"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/comments?post=5153"}],"version-history":[{"count":0,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/posts\/5153\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/media\/8644"}],"wp:attachment":[{"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/media?parent=5153"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/categories?post=5153"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/tags?post=5153"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}2\/ Velikost obr\u00e1zk\u016f<\/h2>\n\n\n\n
3\/ „\u0160patn\u00e9“ a nepou\u017e\u00edvan\u00e9 pluginy<\/h2>\n\n\n\n
4\/ \u0160patn\u00e9 a pomal\u00e9 \u0161ablony<\/h2>\n\n\n\n
5\/ Optimalizace datab\u00e1ze<\/h2>\n\n\n\n
6\/ Pomal\u00fd hosting<\/h2>\n\n\n\n
7\/ PHP, HTTP 2, CDN<\/h2>\n\n\n\n
8\/ Javascript<\/h2>\n\n\n\n
9\/ CSS<\/h2>\n\n\n\n
10\/ HTML<\/h2>\n\n\n\n
11\/ Lazy loading<\/h2>\n\n\n\n
12\/ Cacheov\u00e1n\u00ed<\/h2>\n\n\n\n
13\/ AMP<\/h2>\n\n\n\n
14\/ Aktualizace<\/h2>\n\n\n\n
Co se v\u00e1m vyplat\u00ed ud\u011blat a kdy?<\/h2>\n\n\n\n
\n
\u010cl\u00e1nky o zrychlen\u00ed WordPress webu:<\/h2>\n\n\n\n
\n