WordPress – zrychlení načítání stránek

Plugin WP Performance Score Booster pomáhá s optimalizací rychlosti načítání stránky ve WordPress tak, že odstraní query string ze statických souborů, aktivuje GZIP kompresi a nastaví využití mezipaměti prohlížeče.

WP Performance Score Booster se nachází v oficiálním katalogu pluginů a můžete jej nainstalovat přímo z WordPress administrace.

WP Performance Score Booster

Plugin pomáhá s rychlostí načítání stránek. Ověření jeho funkčnosti můžete snadno otestovat pomocí Google PageSpeed Insights nebo Pingdom.

U nástroje PageSpeed Inisght je zisk 33 bodů a plugin pomůže s body Aktivujte kompresi a Využijte načítání do mezipaměti prohlížeče.

Bez pluginu WP Performance Score Booster

Co všechno plugin ve WordPress dělá?

  • Odstraní všechny query string ze statických zdrojů jako CSS a JS,
  • aktivuje GZIP kompresi (komprese textu, HTML, JavaScriptu, CSS, XML, atd..),
  • přidá hlavičku Accept-Encoding a
  • nastaví cache pro prohlížeč.

Nastavení WP Performance Score Booster

Po instalaci a aktivaci pluginu WP Performance Score Booster můžete jít do jeho nastavení, které najdete v Nastavení → WP Performance Score Booster. Nicméně tento krok není nutný. Vše v nastavení je automaticky povoleno ihned po aktivaci.

Nastavení WP Performance Score Booster

Nastavení WP Performance Score Booster

Remove query strings from static content –  odstraní query string ze statického obsahu.

Enable GZIP compression (compress text, html, javascript, css, xml and so on) – aktivuje GZIP kompresi.

Leverage Browser Caching (set expire caching) – nastaví využití mezipaměti prohlížeče.

Plugin WP Performance Score Booster je jedním, že tří velmi důležitých pluginů pro optimalizaci rychlosti načítání stránky.

Zbývající dva jsou Autoptimize a WP Super Cache.

Pokud chcete zlepšit výkon svého WordPress webu, tak plugin Autoptimize je skvělá volba. Tento minifikační plugin dokáže zrychlit vaší stránku tak, že optimalizuje HTML, CSS a JS.

Autoptimize

Autoptimize

Jak ale Autoptimize pracuje? Plugin komprimuje, minifikuje, slučuje a cachuje všechny scripty a styly. Samotné HTML pak minifikuje.

Minifikace je, že se v HTML, CSS a JavaScriptu zredukuje nepotřebný kód. Díky tomu se tyto soubory stanou menší a rychleji se načítají. Minifikace z kódu odstraňuje:

  • Prázdné mezery
  • Znaky na začátku nové  řádky
  • Komentáře
  • Blokuje oddělovače

Tyto znaky nejsou potřebné pro běh kódu, ale spíše činí kód přehlednější a čitelnější pro lidi.

Jak nastavit plugin Autoptimize

Plugin Autoptimize se nachází v oficiálním katalogu pluginů a jeho instalace se může provést přímo z WordPress administrace.

Po instalaci a aktivaci se do nastavení dostanete tak, že v administraci WordPress vyberete Nastavení -> Autoptimize.

Zde najdete jednoduché nastavení, kde stačí zaškrtnout políčka u optimalizace pro HTML, CSS a JS a uložit nastavení.

Autoptimize Options - základní nastavení

Autoptimize Options – základní nastavení

V tuto chvíli už plugin pracuje a máte nastavený dobrý základ, vhodné pro méně zkušené WordPress administrátory.

Pokročilé nastavení Autoptimize

Autoptimize nicméně obsahuje ještě pokročilé nastavení, které si zobrazíte pomocí tlačítka Show advanced settings v pravém horním rohu. Vzorové nastavení s popisky najdete níže.

HTML Options

HTML Options

HTML Options

  • Optimize HTML Code?  – aktivuje optimalizaci HTML, určitě zaškrtněte.
  • Keep HTML comments? – zaškrtnutím vynutíte ponechání HTML komentářů.

JavaScript Options

JavaScript Options

JavaScript Options

  • Optimize JavaScript Code? – aktivuje optimalizaci JS, určitě zaškrtněte.
  • Force JavaScript in <head>? – vynutí načítání JS v hlavičce, doporučuji nechat vypnuté, protože chcete, aby se JS načítal v patičce stránky a nezpomaloval načítání.
  • Also aggregate inline JS? – plugin slučuje JS do jednoho souboru, zaškrtnutím aktivuje slučování i inline vložených JS.
  • Exclude scripts from Autoptimize: – seznam JS, které má plugin přeskočit.
  • Add try-catch wrapping? – funkce vylepšující kompatibilitu, doporučuji aktivovat.

CSS Options

CSS Options

CSS Options

  • Optimize CSS Code? – aktivuje optimalizaci CSS, určitě zaškrtněte.
  • Generate data: URIs for images? – aktivováním vložíte malé obrázky sloužící pro background-image přímo do stylů.
  • Remove Google Fonts? – aktivováním odstraníte načítání písma z Google Fonts.
  • Also aggregate inline CSS? – aktivováním zapnete slučování i inline stylů.
  • Inline and Defer CSS? – umožňuje vložit CSS kód pro rychlé načítání stránek, musíte však vědět, který CSS to je.
  • Inline all CSS? – vložení všech stylů jako inline.
  • Exclude CSS from Autoptimize: – seznam CSS, které má plugin přeskočit.

CDN Options

CDN Options

CDN Options

Jestli používáte CDN, tak sem vložte root URL.

Cache Info

Cache Info

Cache Info

Tabulka s informací o uložení cachovaných souborů.

Misc Options

Misc Options

Misc Options

  • Save aggregated script/css as static files? – globální nastavení pro slučování CSS a JS, doporučuji nechat aktivované.
  • Also optimize for logged in users? – optimalizovat zobrazování stránky i pro přihlášené uživatele, doporučuji nechat aktivované.

Nutno dodat, že nastavení se může lišit v závislosti na šabloně a použitých pluginech, a proto je vždy důležité po uložení nastavení také šablonu řádně otestovat.

Pro ještě lepší výkon webu doporučuji plugin Autoptimize použít v kombinaci s cachovacím pluginem. Výsledek by pak měl být velmi znát. Další důležitý plugin pro optimalizaci rychlosti je i WP Performance Score Booster.

Nastavením WordPress cache získáte výrazné zlepšení výkonu vaší stránky. WordPress samostatně cache neobsahuje a budete tedy potřebovat plugin. Určitě vybírejte mezi W3 Total Cache nebo WP Super Cache. V tomto návodu budeme dále pokračovat s pluginem WP Super Cache.

Angl. cache [keš] znamená dočasně uložená pomocná data.

Po instalaci pluginu pokračujte do Nastavení -> WP Super Cache, kde se nachází nastavení pluginu.

WP Super Cache

Na vstupní stránce najdete základní nastavení pluginu a seznam záložek:

  • Easy – vstupní stránka, základní nastavení
  • Advanced – detailnější nastavení
  • CDN – nastavení Content Delivery Network
  • Contents – statistiky cachovaných stránek
  • Preload – umožňuje automatické vytvoření cache pro celý web
  • Plugins – nastavení doplňkových PHP skriptů
  • Debug – nastavení zobrazení chyb

 Záložka Easy

Najdete zde tři možnosti nastavení:

  1. Aktivace / deaktivace cachování.
  2. Tlačítko pro test cache.
  3. Smazání cache.
WP Super Cache - Easy

WP Super Cache – Easy

Pokud chcete tak můžete pouze nastavit Caching On a kliknout na tlačítko Update Status. Od této chvíle budete mít nastavené cache, nicméně doporučuji raději pokračovat do záložky Advanced, kde se dá cachování lépe přizpůsobit vaším potřebám.

Záložka Advanced

Najdete zde nastavení rozdělené do tří hlavních skupin Caching, Miscellaneous a Advanced. Dále zde můžete nastavit expiraci cache a výjimky.

Caching

  • Povolit cache (Enable Caching) – pokud chcete, aby cache fungovalo, mějte zaškrtnuté

Cache Delivery Method (Metoda doručování cache)

  • Jednoduchá (Simple) – použijte
  • Expert – je třeba vlastních úprav na serveru

Miscellaneous (Různé)

  • Nepoužívat cache pro známé uživatele (Don’t cache pages for known users.) – známými uživateli se myslí ti uživatelé, kteří vložili komentář přes WordPress komentáře, jsou přihlášení nebo mají v prohlížeči cookie autora. Doporučuji aktivovat.
  • Necachovat stránku s parametrem GET (Don’t cache pages with GET parameters. (?x=y at the end of a url)) – jedná se například o výsledky vyhledávání.
  • Komprimovat stránky a tím zrychlit jejich načítání (Compress pages so they’re served more quickly to visitors.) – jedná se o malé zrychlení načítání stránek. Nechte deaktivované, může způsobovat problémy.
  • Kešovat HTTP hlavičky s obsahem stránky (Cache HTTP headers with page content) – vynutí používání starší verze wp-cache. Tento způsob je pomalejší.
  • Obnovení cache. Poslání supercache souboru anonymním uživatelům, zatímco je vytvářen nový soubor. (Cache rebuild. Serve a supercache file to anonymous users while a new file is being generated.) – jedná se o zaslání starší supercache souborů. Funkce spočívá v tom, že pokud 10 návštěvníků vstoupí na stejnou stránku ve stejnou dobu. Pro prvního návštěvníka se začne generovat cache a ostatním 9 je poslán starší cache soubor. Toto se může stát pouze v případě, že starší soubor není starý více než 30 sekund. Pokud nemáte tuto možnost aktivovanou stane se, že se začne vytvářet 10 stejných cache souborů. Doporučuji aktivovat. poskytuje velké vylepšení výkonu stránek.
  • Chyba 304 indikuje, že od posledního požadavku se zdrojový dokument nezměnil. (304 Not Modified browser caching. Indicate when a page has not been modified since last requested.) – umožňuje říci prohlížeči, zda se obsah na dané stránce změnil. Pokud se obsah nezměnil využije prohlížeč své cache. Nechte deaktivované, může způsobovat problémy.
  • Udělat ze známých uživatelů uživatele anonymní tak, aby jim mohli být poslání supercachované soubory (Make known users anonymous so they’re served supercached static files.) – když někdo přidá na vašem blogu komentář, stane se známým uživatelem a bude mu zaslány necachované soubory. Pokud je tato možnost aktivní dostane uživatel také supercache soubory. Nevýhoda je v tom, že může dojít k duplicitním komentářům, kdy se autor bude domnívat, že nedošlo k odeslání komentáře.
  • Vloží do patičky zprávu s odkazem na autora (Proudly tell the world your server is Stephen Fry proof! (places a message in your blog’s footer)).

Advanced (pokročilé)

  • Povolit dynamické cachování (Enable dynamic caching.) – umožňuje, že jsou některé části stránky vytvářeny dynamicky.
  • Podpora mobilních zařízení (Mobile device support.) – umožňuje použít cache pro mobilní zařízení. Nicméně potřebujete externí plugin, doporučuji zkusit WP Touch.
  • Odstranit UTF8/blog znakovou sadu z .httaccess (Remove UTF8/blog charset support from .htaccess file.) – v některých případech může dojít k zobrazování nahodilých znaků v cachovaných souborech. Aktivováním této možnost by mělo dojít k odstranění problému.
  • Odstranit všechny cache, když je přidán nebo aktualizován příspěvek nebo stránka (Clear all cache files when a post or page is published or updated.)
  • Extra kontrolovat hlavní stránku (Extra homepage checks.) – nejnavštěvovanější stránka na webu je obvykle hlavní strana. Pokud chcete, aby byl návštěvníkům vždy poskytován nejnovější obsah, aktivujte tuto možnost.
  • Pouze obnovit, když je přidán nový komentář (Only refresh current page when comments made.) – zajišťuje, že není daná stránka neustále cachována (i pokud nebyla aktualizována). K aktualizaci cache dojde pouze pokud je přidán komentář. Zároveň nedojde k promazání cachových souborů pro štítky a rubriky.
  • Zobrazit seznam nejnověji cachovaných stránek (List the newest cached pages on this page.) – na stránce Advanced v nastavení pluginu zobrazí seznam cachovaných stránek.
  • Hrubé uzamčení souboru (Coarse file locking.) – zamezuje duplicitním názvům cache souborů.
  • Pozdní inicializace (Late init.) – při prohlížení stránky běžně dochází k inicializaci WP Super Cache brzy. Dokonce dříve, než je celé WordPress API inicializováno. V některých případech můžete potřebovat, aby k inicializaci došlo až po plném načtení. Tato možnost zpozdí inicializaci WP Super Cache až do doby, kdy je zavolán “init” hook.
  • Tajný klíč pro zobrazení necachovaných stránek (Do not cache page secret key) – zajišťuje, že můžete vidět přímo všechny stránky bez cache. Jedná se o debugovací nástroj.

Expiry Time & Garbage Collection (Expirační čas a koš)

Nastavení expirační doby cache je jednoduché a není zde co vysvětlovat. Obvykle se doporučuje nenechávat cache starší než jeden den. Také zde můžete nastavit údržbu, kdy dojde ke kontrolo všech cache a ty s prošlým expiračním časem jsou smazány. Vhodná doba na mazání cache je při nejmenší návštěvnosti webu, tedy obvykle v noci.

Accepted Filenames & Rejected URIs

Zde můžete určit, které typy stránek nemusí být cachovány. Doporučuje se nic neoznačovat.

Rejected User Agents (Odmítnutí user-agenta)

Prohlížeče a roboti se identifikují jako user-agents. Zde můžete nastavit, kterým agentům budou poskytovány cachovaná data, a kterým ne. Opět bych zde nic nedělal, robotům by měl být poskytován obsah stejný jako běžným uživatelům.

Lock Down (Uzavření)

Používá se při velké zátěži serveru. Lock down se snaží udržet stránky cachované jak dlouho to jen jde a během lockdownu nedochází k expiraci cache nebo obnovení obsahu.

Fix Configuration (Obnovení nastavení)

Vrátí výchozí nastavení pluginu.

Záložka CDN

Využijete pouze, pokud používáte CDN.

  • Povolit podporu CDN (Enable CDN Support).
  • Náhradní URL (Off-site URL).
  • Zahrnuté adresáře (Include directories) – adresáře, jejichž URL bude přesměrována.
  • Vyloučené adresáře (Exclude if substring) – adresáře, jejichž URL nebude přesměrována.
  • Dodatečné CNAMES (Additional CNAMES) – pokud stránky mají velké množství HTTP dotazů. tak zde můžete přidat další CNAMES.
  • Vynechat https URL a předcházet chybě “mixed content” (Skip https URLs to avoid “mixed content” errors) – kontrola, že obsah běžně dostupný na HTTPS není dostupný na HTTP. Doporučuji neaktivovat.

Záložka Contents (Obsah)

Kontrolní záložka s informacemi o cachovaných souborech.

  • Cachované stránky (Cached Pages) – stránky, u kterých nedošlo ještě k expiraci.
  • Expirované stránky (Expired Pages) – stránky, u kterých došlo k expiraci.

Najdete zde dvě tlačítka:

  • Smazat expirované (Delete Expired) – smaže expirované cache.
  • Smazat cache (Delete Cache) – smaže všechny cache.

Záložka Preload (Přednačtení)

Zde můžete vygenerovat cache soubory pro všechny stránky předtím, než je navštíví nějací uživatelé. Můžete tuto funkci využít při první aktivaci pluginu, ale i tak mi přijde zbytečná. Také je zde možnost nastavení časového intervalu pro obnovení přednačtení cache (0 znamená deaktivováno).

Pokud máte slabší hosting pak neprovádějte přednačtení cache pro všechny příspěvky. Kromě příspěvků můžete přenačíst také pouze štítky, rubriky a další taxonomie.

Záložky Plugins a Debug

Jedná se o záložky, které jsou určeny pro pokročilé uživatele.

Plugins

Plugin WP Super Cache má integrované vlastní pluginy a zde je můžete spravovat. Jedná se o propojení s dalšími více či méně známými pluginy a pro aktivaci je musíte mít nainstalované.

Debug

Zde můžete aktivovat debugovací mód. Jedná se o pomůcku při odstraňování chyb nebo vývoji.

Vzorové nastavení WP Super Cache

Vzorové nastavení WP Super Cache

Vzorové nastavení WP Super Cache

Jedná se pouze o ukázku nastavení. Je možné, že se vaše nastavení bude lišit.

Plugin WP Super Cache je jedním, že tří velmi důležitých pluginů pro optimalizaci rychlosti načítání stránky. Zbývající dva jsou Autoptimize a WP Performance Score Booster.

Zdroj: https://www.wplama.cz