Tento průvodce obsahuje 9 tipů, které vám ukáží, jak zkrátit čas načítání téměř jakéhokoli webu WordPress na 1–2 sekundy. Dostává pravidelné aktualizace a v prvním čtvrtletí roku 2020 byl rozšířen o několik dalších bonusových tipů.
Pokud jste si vybrali hostitelského partnera a zdroje (téma, pluginy atd.), které jsou od základů vytvořeny pro rychlost a očekáváte, že budou dobře fungovat s velkým objemem provozu (mnoho z nich není), pak můžete oslovit zlomky sekund doby načítání na stránku, váš web uložený v mezipaměti by měl snadno zvládnout nárůsty více než 500 současných návštěvníků a 20 000 nebo více den zobrazení stránek by nemělo být problém. Tato příručka vám také pomůže získat nejlepší známky v syntetických benchmarcích, jako je GTMetrix a Google Page Speed.
Zde je přehled toho, do čeho se chystáme:
V TOMTO ČLÁNKU
Vydejte se snadnou cestou…
Jednoduše tím, že budete svůj web WordPress hostovat pomocí Websavers a povolíte plugin pro ukládání do mezipaměti, jako je WP Super Cache nebo WP Rocket + pluginy pro optimalizaci obrázků, jako je Imagify nebo ShortPixel, uděláte každý jednotlivý krok této příručky buď za vás, nebo zautomatizujete. Pěkné, co?
KOUKNI NA TOChcete-li začít, čtěte dále!
Tato příručka nebude :
- Pomůže vám vyřešit problémy s vaším poskytovatelem hostingu nebo jeho špatným výkonem. Použití vysoce kvalitního hostitele WordPress je obrovský rozdíl.
- Pomůže vám s problémy s pluginy nebo motivy, které by mohly výrazně zpomalit činnost nebo přispívat ke špatnému skóre syntetických srovnávacích testů. Například mnoho pluginů a témat provádí externí volání zdrojů, které nemůžete ovládat, což ve své podstatě sníží rychlost (a srovnávací skóre) vašeho webu. Podobně mnoho pluginů a motivů používá špatné kódovací postupy, které zbytečně vyžadují náročné zpracování dat. Proto možná budete muset zakázat části svého webu (téma, pluginy atd.), aby se s vaším pluginem pro ukládání do mezipaměti dobře hrálo. Pokud používáte motivy a pluginy, které optimalizují výkon, zjistíte, že povolení ukládání do mezipaměti bude fungovat perfektně bez velkého šťourání.
- Umožněte vám dát si svůj dort a také ho sníst:možná se budete muset smířit se ztrátou funkčnosti nebo kvality ve prospěch lepšího výkonu a nejlepších známek v syntetických měřítcích, jako je Google PageSpeed Insights . Pokud máte rádi výjimečně vysoce kvalitní obrázky, které mají každý 1 MB+ nebo nedostatečně komprimované video soubory, pak nikdy nezískáte nejlepší známky v nástrojích pro srovnávání webových stránek. Podobně, pokud máte část svého webu, která načítá dynamický obsah při každém načtení stránky, možná budete muset tuto funkci vypnout nebo najít jiný způsob, jak ji načíst, abyste dosáhli optimálního výkonu.
Pokud se setkáte s problémem, kdy stránce trvá déle než 10 sekund, než vůbec začne načítat obsah, často se jedná o základní problém s WordPress nebo konfigurací hostingu, který musíte vyřešit, než se pustíte do ukládání do mezipaměti pro řešení. Kliknutím sem zobrazíte nápovědu k odstraňování problémů s náhle velmi pomalým načítáním stránek.
Pokud jste spokojeni se všemi pokyny v tomto článku, měli byste je udělat všechny, abyste zlepšili výkon svého webu. Pokud jste základní uživatel, je také v pořádku vyplňovat pouze sekce, které vám vyhovují. Stále uvidíte zlepšení výkonu, jen ne tolik, jako když budete moci dokončit všechny možnosti.
Některé části poskytnou masivní zlepšení doby načítání, zatímco jiné budou zanedbatelné. Některé části způsobí, že syntetický test rychlosti, jako je rychlostní test Google PageSpeed nebo GTMetrix, bude váš web hodnotit vysoce, ale nemusí způsobit rozdíl v době načítání v reálném světě. Taková je povaha syntetických nástrojů pro benchmarking.
Bez dalších řečí je zde 9 věcí, které můžete udělat, abyste výrazně zlepšili výkon svého webu:
1. Použijte webhosting, který se stará o výkon
Pokud váš poskytovatel webhostingu zatěžuje své servery tisíci webů nebo neví, jak ze svých serverů vytěžit maximum, pak je nevyhnutelné, že se budete setkávat s častým zpomalením.
Pokud používáte sdílený hosting, ujistěte se, že váš hostitel uměle omezuje celkový počet webů na server, aby zajistil, že váš web bude mít zdroje, které potřebuje k dobrému výkonu. Pokud máte vlastní VPS, zeptejte se svého hostitele, jak je nakonfigurován a jaké části konfigurace jsou navrženy pro zajištění špičkového výkonu. Pokud jejich odpověď nezahrnuje věci jako úložiště SSD, webový server nginx nebo lightspeed a vlastní optimalizované konfigurace pro poskytování statických souborů mezipaměti, pak je čas najít lepšího hostitele WordPress.
Pokud jste velmi Pokud máte obavy o výkon, doporučujeme pořídit si vlastní VPS, abyste zajistili, že váš web bude mít vyhrazené zdroje. Často doporučujeme nejprve vyzkoušet náš nedostatečně vytížený sdílený hosting, a pokud zjistíte, že potřebujete ještě větší výkon, vždy můžete přejít na VPS.
2. Použijte nejnovější verzi PHP
Zde se můžete podívat na některé metriky. Pokud můžete použít PHP 8.x nebo 7.4, poskytne to dalších 30–70 % zlepšení výkonu oproti 7.2 a starším. Ale vezměte na vědomí:tohoto vylepšení si na front-end stránkách uložených v mezipaměti nevšimnete. Toto zlepšení výkonu se projeví na dobách načítání stránky, když váš modul pro ukládání do mezipaměti stránku poprvé uloží do mezipaměti a když procházíte oblast správy WordPress.
To zní skvěle... ale jak to mám používat?
- Nejprve se přihlaste do Plesk
- V rámci příslušné domény přejděte na „Nastavení PHP“
- V horní části stránky budou dvě rozbalovací nabídky; jeden pro verzi PHP, jeden pro PHP Handler. Pro verzi vyzkoušejte nejnovější verzi, a pokud narazíte na problémy, opakovaně snižte verzi, dokud web nebude fungovat. Pokud uděláte narazíte na problémy s nejnovější verzí PHP, nakonec bude nejlepším řešením najít zdroj problému a opravit jej, jako je aktualizace nekompatibilního pluginu nebo motivu, ale uznáváme, že to není vždy možné.
- Posuňte se dolů a klikněte na „OK“ nebo „Použít“
3. Povolte kompresi Brotli nebo Gzip
Používáte sdílený hosting Websavers nebo VPS s praktickou podporou? Pokud ano, již jsme pro vás povolili kompresi Brotli (s gzip záložní)! Ještě nepociťujete rozdíl ve Websavers? No, snad se brzy uvidíme.
Pokud u nás nehostujete, většina zásuvných modulů pro ukládání do mezipaměti se o to postará za vás, pokud však ne, přidejte tyto hodnoty do svého souboru .htaccess ke kompresi reklam GZIP na svém webu:
<IfModule mod_deflate.c> # Compress HTML, CSS, JavaScript, Text, XML and fonts AddOutputFilterByType DEFLATE application/javascript AddOutputFilterByType DEFLATE application/rss+xml AddOutputFilterByType DEFLATE application/vnd.ms-fontobject AddOutputFilterByType DEFLATE application/x-font AddOutputFilterByType DEFLATE application/x-font-opentype AddOutputFilterByType DEFLATE application/x-font-otf AddOutputFilterByType DEFLATE application/x-font-truetype AddOutputFilterByType DEFLATE application/x-font-ttf AddOutputFilterByType DEFLATE application/x-javascript AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE font/opentype AddOutputFilterByType DEFLATE font/otf AddOutputFilterByType DEFLATE font/ttf AddOutputFilterByType DEFLATE image/svg+xml AddOutputFilterByType DEFLATE image/x-icon AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE text/html AddOutputFilterByType DEFLATE text/javascript AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/xml </IfModule>
To říká Apache, aby před odesláním komprimoval veškerý kompatibilní obsah – šetří čas a šířku pásma!
Používáte pouze Nginx? Použijte toto ve svých direktivách Nginx k povolení brotli s gzip záložní:
brotli on; brotli_types text/plain text/css application/json application/javascript application/x-javascript text/xml application/xml application/xml+rss text/javascript; gzip on; gzip_disable "MSIE [1-6]\\.(?!.*SV1)"; gzip_proxied any; gzip_comp_level 5; gzip_types text/plain text/css application/javascript application/x-javascript text/xml application/xml application/xml+rss text/javascript image/x-icon image/bmp image/svg+xml; gzip_vary on;
4. Povolit dlouhé vypršení platnosti pro mezipaměť prohlížeče
Nejprve je důležité pochopit, co přesně je mezipaměť prohlížeče. Už vám někdy někdo řekl, abyste „vymazali mezipaměť“ ve svém prohlížeči? Je to proto, že moderní prohlížeče jsou nakonfigurovány tak, aby stahovaly kopie zdrojů (HTML/CSS/JS/obrázky), aby se urychlila rychlost stránek při dalších návštěvách. Ve výchozím nastavení jsou však některé z těchto položek nastaveny tak, aby „vypršely“ velmi rychle – což rychlosti příliš nepomáhá!
V pozdější části budeme hovořit o používání modulu pro ukládání do mezipaměti pro WordPress. Pokud používáte výhradně webový server Apache, všechny pluginy pro ukládání do mezipaměti vám povolí také hodnoty s dlouhou platností pro ukládání do mezipaměti prohlížeče .
Toto nedoporučujeme, pokud svůj web stále vyvíjíte. Tuto konfiguraci používejte pouze tehdy, když je web aktivní.
To znamená, že pokud je váš web aktivní a chcete z něj vymáčknout trochu vyšší výkon, můžete nakonfigurovat svůj server tak, aby návštěvníkům řekl, jak dlouho si mají určité zdroje ponechat.
Tyto příkazy posílá server, aby instruoval prohlížeč každého návštěvníka, jak dlouho se má ‚držet‘ u různých typů souborů.
Používáte webový server Apache?
Přidejte následující do souboru .htaccess.
## EXPIRES CACHING ## <IfModule mod_expires.c> ExpiresActive On ExpiresByType image/jpg "access plus 1 year" ExpiresByType image/jpeg "access plus 1 year" ExpiresByType image/gif "access plus 1 year" ExpiresByType image/png "access plus 1 year" ExpiresByType text/css "access plus 1 month" ExpiresByType text/html "access plus 1 week" ExpiresByType application/x-compressed "access plus 1 week" ExpiresByType application/x-gzip "access plus 1 week" ExpiresByType application/pdf "access plus 1 month" ExpiresByType text/x-javascript "access plus 1 month" ExpiresByType application/x-javascript "access plus 1 month" ExpiresByType application/x-shockwave-flash "access plus 1 month" ExpiresByType image/x-icon "access plus 1 year" ExpiresDefault "access plus 1 week" </IfModule> ## EXPIRES CACHING END ##
Používání nginx s Plesk
- Přihlaste se do Plesk a přejděte do „Nastavení Apache &nginx“ pod doménou, kterou optimalizujete.
- V části Platnost vyprší> Zadejte vlastní hodnotu zadejte 365 dní . a zaškrtněte políčko:odpovězte pomocí záhlaví Expires pouze pro statické soubory
- Zaškrtněte políčka vedle položky Inteligentní zpracování statických souborů a Poskytovat statické soubory přímo společností nginx
V případě, že možnost „Podávat statické soubory přímo pomocí nginx“ nemá všechny tyto přípony statických souborů uvedeny (buď s mezerami nebo | mezi nimi), vložte to do poskytnutého pole:
ac3|atom|avi|bmp|bz2|css|csv|cue|dat|doc|docx|dts|eot|exe|flv|gif|gz|htm|html|ico|img|iso|jpeg|jpg|js|map|mid|midi|mkv|mp3|mp4|mpeg|mpg|m4a|ogg|ogv|otf|pdf|png|ppt|pptx|qt|rar|rm|rss|rtf|svg|svgz|swf|tar|tgz|ttf|txt|wav|webp|woff|woff2|xls|xlsx|zip
Nyní klikněte na Použít nebo OK pro uložení změn.
Používání barebones nginx
Přidejte toto do své konfigurace nginx:
location ~* \.(css|js)$ {
gzip_vary on;
expires 30d;
}
location ~* \.(ac3|atom|avi|bmp|bz2|css|csv|cue|dat|doc|docx|dts|eot|exe|flv|gif|gz|htm|html|ico|img|iso|jpeg|jpg|js|map|mid|midi|mkv|mp3|mp4|mpeg|mpg|m4a|ogg|ogv|otf|pdf|png|ppt|pptx|qt|rar|rm|rss|rtf|svg|svgz|swf|tar|tgz|ttf|txt|wav|webp|woff|woff2|xls|xlsx|zip)$ {
gzip_vary on;
expires max;
log_not_found off;
}
5. Použijte generátor statické mezipaměti na straně serveru
V našem testování je nejlepší komerční možností WP Rocket a nejlepší bezplatnou možností je WP Super Cache. Oba vytvoří statické soubory mezipaměti pro každou ze stránek a příspěvků vašeho webu a oba budou mimořádně dobře fungovat s naší vlastní konfigurací nginx, která automaticky detekuje statické soubory a slouží těm, aniž by bylo nutné spouštět těžší proces Apache a/nebo PHP. Výhody, které jsme zjistili při platbě za WP Rocket ve srovnání s bezplatnými pluginy pro ukládání do mezipaměti, jsou téměř výhradně v části věcí miniifikace a optimalizace kódu webových stránek. Další informace naleznete v části 6 této příručky níže.
Na všech našich serverech používáme vlastní konfiguraci nginx, abychom automaticky zjišťovali použití nejběžnějších pluginů pro ukládání stránek do mezipaměti na straně serveru a automaticky poskytovali jejich statické html soubory přímo s nginx, aniž bychom museli cestovat přes apache nebo PHP procesor, čímž se snižuje využití CPU a paměti. Naše systémy mohou automaticky detekovat a obsluhovat statický výstup mezipaměti z WP Rocket, WP Super Cache, WP Fastest Cache, W3 Total Cache a WP Optimize. Je smutné, že Hummingbird nemůže pracovat s našimi systémy, protože používají náhodně generované statické názvy souborů mezipaměti. Pokud chcete používat Hummingbird, požádejte podporu WPMUDEV o opravu názvů souborů mezipaměti.
Tyto pluginy pro generování statické mezipaměti mohou vašemu webu umožnit zvládnout masivní nárůsty provozu, aniž by se zapotili i na našich sdílených hostingových službách!
Tyto konfigurace jsme použili k tomu, abychom web na sdíleném hostingu bez problémů přinesli přibližně 100 000 unikátních zobrazení denně a web s vlastním VPS na více než 500 000 jedinečných zobrazení denně při průměrném zatížení 1,0.
Pokud váš hostitel nemůže držet krok, podívejte se na naše kanadské možnosti hostování WordPress. Ještě lepší je, že s optimalizacemi popsanými v tomto kroku, kroku 6 (optimalizace) a kroku 7 (komprese obrázku), může váš web přejít ze selhávajícího nebo jinak nízkého skóre rychlosti stránky Google na 90+ v závislosti na tématu. a použité pluginy.
Zde je návod, jak získat statický výstup mezipaměti z našich dvou oblíbených pluginů pro ukládání do mezipaměti:
- WP Rocket :Zde je návod, jak nainstalovat a aktivovat WP Rocket pomocí jejich průvodce. Po aktivaci začne automaticky vytvářet statickou mezipaměť.
- WP Super Cache :přihlaste se ke své instalaci WordPress a přejděte na Pluginy> Přidat nový. Nainstalujte WP Super Cache a aktivujte ji. Přejděte do Nastavení> WP Super Cache a vyberte „Zapnout ukládání do mezipaměti“ a stiskněte tlačítko Aktualizovat stav. Klepněte na kartu Upřesnit. Zaškrtněte vše s nápisem „Doporučeno“ vedle toho. Stiskněte tlačítko Aktualizovat stav. Přejděte dolů do části „Čas vypršení platnosti a sběr odpadu“ a nastavte interval na jednou nebo dvakrát denně a poté stiskněte tlačítko „Změnit vypršení platnosti“.
Někteří lidé preferují W3 Total Cache a jiní jako WP Fastest Cache, mezi mnoha další moduly pro ukládání do mezipaměti. Obecně jsou tyto pluginy skvělé při zvládání vylepšení výkonu a kterýkoli z výše uvedených bude skvěle fungovat při generování statických souborů mezipaměti pro rychlejší výkon webu. Ne všechny mají tendenci být tak trvale dobré v optimalizaci, jak je popsáno v kroku 6 níže.
Nyní otevřete jiný prohlížeč, než ve kterém jste přihlášeni do WordPressu, a načtěte libovolnou stránku na svém webu. Po načtení stránku obnovte. Měli byste zjistit, že aktualizace je nyní výrazně rychlejší než počáteční načítání stránky. Není to *jen* proto, že váš prohlížeč použil první načtení stránky k ukládání zdrojů do mezipaměti, ale také (nejvýznamněji) proto, že server použil toto počáteční načtení stránky k vytvoření statického souboru mezipaměti, který se pak zobrazí při dalších návštěvách.
Povolení statického ukládání stránek do mezipaměti by nemělo mít žádný vliv na funkčnost vašeho webu, ale výrazně zlepší TTFB (čas do prvního bajtu) vašeho webu, protože server bude schopen dodávat každou stránku mnohem rychleji než dříve. Jedinou výjimkou je, pokud máte dynamická data, která se mění na webu, který nepoužívá AJAX; tato část vašeho webu se nebude automaticky aktualizovat při každém načtení stránky. Pokud k tomu dojde, promluvte si s vývojářem svého webu a požádejte ho, aby změnil funkci tak, aby používala AJAX.
V části 6 níže si můžete přečíst o tom, jak nakonfigurovat buď WP Rocket nebo SuperCache + Autoptimize, aby zvládly agresivnější optimalizace na webu, které dramaticky zlepší vaše skóre rychlosti stránky Google.
6. Použijte Minifikátor kódu a Plugin pro optimalizaci
Obecně řečeno, chcete se držet pouze jednoho optimalizačního pluginu, ale WP Super Cache a Autoptimize jsou ve skutečnosti navrženy tak, aby spolupracovaly. WP Rocket má funkci WP Super Cache a Autoptimize kombinovanou tak, že generuje statické soubory mezipaměti (jak je popsáno v části 5 výše) a minimalizuje a optimalizuje kód webu.
Autoptimize funguje s WP Rocket v tom, že WP Rocket jednoduše deaktivuje svou optimalizační funkci, když je detekována Autoptimze, ale ve většině případů jsme to považovali za zbytečné, protože WP Rocket má stejnou funkci již zabudovanou. Optimalizační funkce WP Rocket má také tendenci být lepší v nenarušování webových stránek než Autoptimize, když jsou povoleny funkce jako minifikace a odkládání skriptů.
Pokud jde o optimalizaci kódu webu (jako je minifikace), která je často potřebná k získání vyšších skóre s Google Page Speed nebo GTMetrix, nikdy jsme nebyli schopni zprovoznit W3 Total Cache nebo WP Fastest Cache (mimo jiné). jako funkce Autoptimize nebo optimalizace WP Rocket.
Poznámka:Toto je fáze, kdy povolení některých optimalizací může poškodit části vašeho webu, zejména pokud motiv, plugin nebo vlastní kód nebyl napsán tak, aby s optimalizací dobře fungoval. Pokud k tomu dojde, přečtěte si prosím níže uvedené kroky pro odstraňování problémů, kde se dozvíte, jak to opravit.
WP Rocket (naše oblíbené, placené)
Pokud jste nedokončili část 5 výše, nainstalujte a aktivujte WP Rocket pomocí jejich průvodce. Poté přejděte do Nastavení> WP Rocket a začněte.
Karta Mezipaměť:
- Povolte ukládání do mezipaměti pro mobilní zařízení . Pokud používáte zcela samostatný mobilní web (nedoporučuje se) nebo pokud jej používáte hodně prvků, které se zobrazují pouze na mobilních zařízeních (jako je záměna částí stránky mezi mobilní verzí a verzí pro počítače), poté zaškrtněte políčko Oddělit soubory mezipaměti pro mobilní zařízení .
- Povolte ukládání do mezipaměti pro přihlášené uživatele WordPress
Uložit změny
Karta Optimalizace souborů:
- Minifikujte CSS: povoleno
- Kombinovat soubory CSS: zakázáno*
- Optimalizace doručování CSS: doporučujeme použít možnost „Načíst CSS asynchronně“, protože je mnohem spolehlivější než (aktuálně ve verzi beta) Odstranit nepoužívané CSS. Remove Unused CSS poskytuje dramatické zvýšení výkonu, ale není spolehlivé pro běžné používání nebo pro slabé povahy. Pokud jej používáte, připravte se na řadu ručních úprav, abyste jej dostali tak akorát.
- Minifikujte soubory JavaScript: povoleno
- Kombinovat soubory JavaScript:zakázáno*
- Načtení JavaScriptu odloženo: povoleno
- Zpoždění spuštění JavaScriptu: povoleno**
Nyní vymažte mezipaměť WP Rocket a načtěte svůj web v jiném prohlížeči
* samostatné soubory je lepší, když váš webový server podporuje http/2 nebo http/3 (jako náš), protože modul webového serveru bude soubory odesílat souběžně.
** Zkontrolujte, zda na kartě konzoly webového inspektora vašeho prohlížeče nejsou chyby. Pokud uvidíte nějaké chyby, které vypadají jako:„jQuery není definován“ nebo „jQuery nebyl nalezen“, budete muset buď zjistit, proč plugin, téma nebo vlastní kód nenačítá své prostředky správně, a ty nezbytné vyloučit. z funkce Odložit a/nebo Zpoždění Javascriptu, nebo použijte jednoduchou cestu a použijte výchozí vyloučení pro Zpoždění spuštění Javascriptu zobrazeno na této stránce nastavení WP Rocket.
Pokud uvidíte nějaké další chyby JavaScriptu, budete muset buď deaktivovat Odloženo načítání JavaScriptu, nebo určit, proč není možné odložit soubor JavaScript, po dohodě s vývojářem pluginu nebo motivu.
Karta Média:
- Povolte vše na této stránce.
Karta Doplňky:
- Pokud máte na svém webu povolenou službu Google Analytics (ale ne prostřednictvím Správce značek Google ) povolit doplněk Google Tracking. [Poznámka:plugin MonsterInsights není kompatibilní s tímto doplňkem. Chcete-li použít tento doplněk Rocket, budete muset odebrat MonsterInsights a zahrnout analytický kód pomocí jiného pluginu, jako je SiteKit Google, nebo ručním zkopírováním a vložením kódu UA do pole kódu záhlaví vašeho motivu.]
- Pokud na svém webu používáte měřicí kód Facebook Pixel, povolte doplněk Facebook Pixel.
- Pokud váš server používá mezipaměť Varnish (náš ne, protože místo toho je k dispozici ukládání do mezipaměti nginx), měli byste zde povolit doplněk Varnish.
- Pokud ke generování obrázků WEBP pro svůj web používáte Shortpixel nebo Imagify, můžete zde aktivovat možnost, aby se zobrazovaly přednostně před obrázky JPG/PNG.
WP Super Cache + Autoptimize (zdarma)
Pokud jste nedokončili část 5 výše, udělejte tak nyní, poté se přihlaste ke své instalaci WordPress a přejděte na Pluginy> Přidat nový a nainstalujte a aktivujte Autoptimize
Konfigurace automatické optimalizace
- Přejděte do Nastavení> Automatická optimalizace a ujistěte se, že je povolen JavaScript, CSS a miniifikace HTML.
- Na kartě Extra vedle Písma Google vyzkoušejte možnost „Asynchronně kombinovat a načítat písma s webfont.js“ a také „Odebrat řetězce dotazů“.
- Stiskněte „Uložit změny“.
Odstraňování problémů s poškozenými prvky
Po povolení optimalizací ve WP Rocket nebo Autoptimze je možné, že na webu uvidíte nefunkční prvky v závislosti na použitých pluginech, vašem motivu a řadě dalších věcí. Zde je několik běžných důvodů a oprav:
Chybí obrázky nebo videa:
Pokud váš tvůrce motivů nebo stránek používá k načítání obrázků na váš web JavaScript, Lazyload pro obrázky a videa možnost to může přerušit a budete muset zakázat lazyload na stránkách s tímto obsahem. Informace o tom, jak to provést, naleznete níže v části „Na stránku“.
Globální části mého webu nefungují, například menu
Pokud se jedná o vlastní kód, je nejlepší pokusit se opravit odpovědný kód. Pokud se jedná o funkci poskytovanou motivem nebo pluginem, zkuste tuto funkci nahradit jiným motivem nebo pluginem (protože motiv nebo plugin pravděpodobně nejsou stavěny pro rychlost). Problém s kompatibilitou můžete také nahlásit vývojáři motivu nebo pluginu, aby jej mohli opravit.
Pokud nejste schopni opravit kód nebo vyměnit software, který není optimalizován pro rychlost, deaktivujte každý z typů minifikace (např. na kartě Optimalizace souborů ve WP Rocket) jeden po druhém, dokud neuvidíte, že problém zmizel, pak znovu povolte vše kromě nastavení, které jste naposledy deaktivovali, protože to způsobovalo problém.
Pokud jste pokročilý uživatel, můžete znovu povolit nastavení, které pro vás nefungovalo, a poté pomocí webového inspektora prozkoumat stránku a zjistit, který soubor způsobuje problém. Jakmile jej najdete, přejděte do konfigurace WP Rocket nebo Autoptimize a vylučte z minifikace pouze tento jedinečný soubor. (To pravděpodobně sníží vaše skóre rychlosti stránky)
Vyloučení na stránku
Pokud zjistíte, že problémy mají pouze vybrané stránky, můžete zakázat možnost způsobující problémy pouze na této stránce. Upravte stránku ve WordPress a vyhledejte pole „Možnosti mezipaměti“ vpravo.
Pokud víte, která část modulu pro ukládání do mezipaměti způsobuje problémy, zrušte zaškrtnutí. Pokud ne, zrušte jejich zaškrtnutí po jednom a zobrazte stránku, abyste zjistili, zda je problém vyřešen. Tento postup opakujte pro každou možnost, dokud nenajdete nastavení problému.
Pokud používáte Remove Unused CSS (WP Rocket)
V závislosti na situaci existují dvě možnosti, jak to opravit:
- Právě začínáte s Odstranit nepoužívané CSS? Řekli jsme vám, že se to pravděpodobně stane. Na tom však nezáleží; jednoduše vyhledejte CSS identifikátory všech prvků, které se „zbláznily“, a přidejte je do seznamu vyloučení ve WP Rocket. Poté znovu načtěte stránku v jiném prohlížeči a potvrďte, že je problém vyřešen. Pokud ne, najděte další prvek CSS a vyzkoušejte jej – pochopíte to a přesto byste měli zaznamenat výrazné zvýšení výkonu vašeho webu.
- Pokud už nějakou dobu běží Remove Unused CSS a najednou se vám to rozbilo, zkuste to obnovit tak, že přejdete na WP Rocket -> Clear Used CSS. To se může stát v případě některých aktualizací pluginů / motivů a WP Rocket musí být vyzván k regeneraci svých souborů.
7. Komprimujte soubory obrázků
To vám poskytne pouze malé znatelné zvýšení rychlosti, pokud nepoužíváte pomalé internetové připojení nebo jste na svůj web nenahráli extrémně velké obrázky, ale může to docela zlepšit skóre rychlosti vaší stránky Google, protože jejich skóre Core Web Vitals pro mobilní zařízení je založeno na rychlostech internetu 3G.
Poznámka:Pokud to s optimalizací svého webu myslíte vážně, abyste dosáhli poslední kapky výkonu, měli byste očekávat pokles kvality obrázků . Pokud dáváte přednost obrázkům ve vyšší kvalitě, pak volíte tuto možnost na úkor a) doby načítání stránky při pomalejším připojení ab) syntetického skóre benchmarků, jako je Google PageSpeed a Core Web Vitals. Musíte si vybrat, čemu dáváte přednost:vysoce kvalitní obrázky nebo lepší skóre ve srovnání. Nemůžete mít obojí.
Původní ruční metoda: Spusťte všechny soubory PNG přes kompresor a poté je nahrajte přes jejich předchozí verze. Možná nemáte tyto nástroje k dispozici, ale otevřel jsem všechny soubory PNG ve Photoshopu a exportoval je na web. Pokud to uděláte, ujistěte se, že se soubory nedělají zahrnout metadata, protože to může zabrat velké části souborů – zejména u ikon.
Snazší, placená metoda: Používáme Imagify, aby to zvládli za nás, na celé straně serveru. Je to fantastický plugin poskytovaný stejnými lidmi jako WP Rocket, který bude automaticky spravovat kompresi vašich obrázků buď jako jednorázovou nebo průběžnou. Další možností je plugin s názvem ShortPixel, funguje stejně dobře jako Imagify v našem testování a navíc nabízí velmi férové ceny. Podívejte se na vše z našich doporučených zdrojů zde.
Ukládání Gravatarů do mezipaměti
Vzhledem k tomu, že se jedná o obrázky (ty, které používají autoři příspěvků), připadalo mi to jako správné místo, kde o tom mluvit. WP Rocket a WP Super Cache ve výchozím nastavení neukládají do mezipaměti gravatary, což znamená, že pokud máte ke svým příspěvkům mnoho komentářů od různých autorů, načítání externích obrázků gravatarů může prodloužit celkovou dobu vykreslování vaší stránky.
Blog WP Rocket má skvělý článek o tom, jak to zvládnout, podstatou je nainstalovat plugin s názvem „FV Gravatar Cache“.
8. Nakonfigurujte Nginx tak, aby načítal výstup statické mezipaměti [Pokročilé]
Tuto možnost mohou využít pouze ti, kteří používají hostitele s reverzním proxy serverem nginx. To platí pro každého, kdo používá Plesk 12 nebo novější, pokud hostitel nedělá divné věci s konfigurací svého serveru.
Protože nginx je lehčí webový server než Apache, konfigurací nginx tak, aby přímo obsluhoval tyto statické soubory, dramaticky zlepšujeme výkon. Pro každý jednotlivý požadavek namísto použití vlákna nginx ke spuštění procesu Apache ke zpracování požadavku nakonfigurujeme nginx tak, aby pouze používal vlákno nginx a vůbec se neobtěžoval načítat apache pro všechny stránky, pro které máme statický soubor mezipaměti . Skvělé, že?
Pokud je váš hosting s Websavers, nemusíte nic z toho dělat, protože to děláme automaticky u všech sdílených hostingů a spravovaných hostingových účtů VPS.
Pokud váš hosting není u nás, pak musíte mít přístup správce k Plesku aby bylo možné tyto změny aplikovat. Obvykle budete mít přístup pro správce pouze v případě, že máte vlastní VPS nebo dedikovaný server.
Nakonfigurujte nginx tak, aby načítal statické soubory mezipaměti WP Super Cache
Pamatujete si výše, když jsme řekli WP Super Cache, aby používal mod_rewrite k poskytování našich souborů mezipaměti? To je v podstatě automatické, pokud používáte Apache, protože WP Super Cache automaticky upraví váš soubor .htaccess tak, aby obsahoval nezbytná pravidla mod_rewrite.
Vložením následujícího do konfigurace nginx sdělíte nginxu, aby při obsluhování statického výstupu WP Super Cache zcela obešel apache. V Plesku to provedete v doméně „Nastavení Apache &nginx“ a poté v poli Další direktivy nginx.
### WP Super Cache Below ###
set $cache_uri $request_uri;
# POST requests and urls with a query string should always go to PHP
if ($request_method = POST) {
set $cache_uri 'null cache';
}
if ($query_string != "") {
set $cache_uri 'null cache';
}
# Don't cache uris containing the following segments
if ($request_uri ~* "(/wp-admin/|/xmlrpc.php|/wp-(app|cron|login|register|mail).php|wp-.*.php|/feed/|index.php|wp-comments-popup.php|wp-links-opml.php|wp-locations.php|sitemap(_index)?.xml|[a-z0-9_-]+-sitemap([0-9]+)?.xml)") {
set $cache_uri 'null cache';
}
# Don't use the cache for logged in users or recent commenters
if ($http_cookie ~* "comment_author|wordpress_[a-f0-9]+|wp-postpass|wordpress_logged_in") {
set $cache_uri 'null cache';
}
# Use cached or actual file if they exists, otherwise pass request to WordPress
location ~ / {
try_files /wp-content/cache/supercache/$http_host/$cache_uri/index.html $uri /index.php;
}
Je důležité si uvědomit, že pokud používáte WordPress v podadresáři, můžete mít nějaké problémy s dodanými pravidly nginx, zvláště pokud máte „vnořenou“ instalaci (s WordPress v základním adresáři a další instalací WordPressu v podadresáři). Lze to provést spoustou složitých změn dodaných pravidel, ale rozhodně je ve všech ohledech snazší, pokud změníte strukturu tak, aby používala subdoménu místo podsložky.
Nakonfigurujte nginx tak, aby načítal statické soubory mezipaměti WP Rocket
Využili jsme tuto užitečnou konfiguraci WP Rocket nginx vygenerováním konfigurace (postupujte podle pokynů k instalaci) a poté vložením výsledku do umístění direktiv pokročilé konfigurace nginx v Plesku.
Upravili jsme konfiguraci, o které jsme zjistili, že nejlépe vyhovuje našemu prostředí; pokud byste chtěli využít výhod našich optimalizací, podívejte se na hosting s Websavers!
9. Zakázat nepoužívané moduly PHP [Pokročilé]
Je vyžadován přístup správce Plesk (pouze VPS)
Pokud máte úplný přístup správce k vašemu VPS, můžete skutečně deaktivovat moduly PHP, které nepotřebujete. Méně věcí k načítání do paměti, menší využití paměti, méně intenzivní zpracování a rychlejší výkon. Toto je však velmi pokročilá záležitost, takže buď víte, co děláte nebo neděláte to na živém serveru, takže nic nepokazíte 😉
- Přejděte na Nástroje a nastavení v Plesku
- V části Obecná nastavení klikněte na Nastavení PHP
- Vyberte verzi PHP a obslužný program, pro který chcete změnit nastavení
- Vypněte moduly PHP, které nepoužíváte
- Klikněte na tlačítko OK nebo Použít uložit
Nyní se vraťte na svůj web a ujistěte se, že nic není rozbité! Možná nevíte, jaké moduly se používají v každém aspektu vašeho webu, takže k tomu, abyste to správně pochopili, může být docela dost pokusů a omylů.
Bonusový tip č. 1:ReCAPTCHA v3
Pokud používáte Google ReCAPTCHA pro ochranu robotů, ať už ve formuláři kontaktu/nabídky, nebo k ochraně komentářů k příspěvku na blogu, neobviňujeme vás, je to slušný systém, jak zabránit robotům v odesílání vašich formulářů.
ReCAPTCHA v2 je typ captcha, který každý zná a trochu nenávidí, kde „zaškrtnutím políčka“ potvrdíte, že nejste robot. Nenávist přichází, když systém vyskočí ověření, kde musíte kliknout na obrázky, které odpovídají popisu jako „vyberte všechny obrázky s nákladním autem“. Zní vám to povědomě?
ReCAPTCHA v3 je „neviditelný“ v tom, že není vyžadováno žádné zaškrtávací políčko, což přispívá k lepší uživatelské zkušenosti. Má však určité nevýhody v rychlosti webu v tom, že musí načíst všechny své skripty na každou stránku vašeho webu . Sleduje uživatele, když se pohybují na vašem webu, protože jejich chování pomůže určit, zda jsou roboty nebo ne.
Protože se tyto skripty načítají na každé stránce, jediný způsob, jak můžete zabránit tomu, aby byly tyto zdroje označeny GTMetrixem a dalšími syntetickými benchmarkovacími nástroji, je přepnutím zpět na v2 (pokud to váš formulář nebo plugin recaptcha umožňuje), protože pak budou zdroje pouze načteno na stránkách, kde existují formuláře.
Advanced users:you can write a WordPress hook that dequeues the ReCAPTCHA v3 resources on all pages except those with your forms, but you should know that doing this will very likely decrease the effectiveness of ReCAPTCHA’s protection.
Bonus Tip #2:Detect and Reduce Dynamic Processing
There’s a few common cases where, regardless of all the caching and optimizations, we just implemented, your server will still launch dynamic PHP processes to serve the requests, thus requiring CPU and memory to handle that request.
Check out our guide to analyzing dynamic processing with WordPress!
UPDATE HISTORY:
- Jan 12, 2022:Updates to PHP Versions, simplify wording, add brotli compression details
- Aug 28, 2020:Add notes about content encoding headers, MonsterInsights incompatibility with WP Rocket’s GA Addon, Gravity Forms incompatibility with deferred jQuery
- Apr 30, 2020:Add Bonus Tip 2:Detecting and Reducing Dynamic Processing
- Apr 26, 2020:Add tip for caching Gravatar images.
- Jan 10, 2020:Add improved instructions for configuring browser caching rules in Plesk to improve scores on synthetic benchmarks like Google Page Speed and GTMetrix.
- Dec 31, 2019:Remove our recommendation to use nginx direct to PHP-FPM processing and instead use rules that will ensure nginx will directly serve your caching plugin’s static cache file output, bypassing apache. This results in identical performance for most website visitors, but much better security, if your host has Plesk’s web application firewall properly configured.
- Oct 15, 2019:Split step 5 into 2 sections (now 5 and 6) — static cache generating in step 5 (which improves performance but doesn’t break websites) and optimization of resources in step 6 (which improves scores on things like Google Page Speed, but which can also break your website).
- Feb 4, 2019:Replace Better WordPress Minification with Autoptimize as recommended minification system.
- Jan 9, 2019:Add PHP 7.3 Info
- Dec 3, 2018:Reformatted post for better understanding of difference between browser cache vs. nginx->php-fpm direct mode. Use Plesk recommended rewrite rules for nginx.
- Jul 4, 2017:Added ShortPixel as an image compression option, reformatted post.
- Feb 20, 2016:Added commercial option, WP Rocket, as a great paid replacement for WP Super Cache + WP Minify.
- Jun 16, 2017:Added some hosting/server tips.
- Dec 25, 2013:Original Post Date.