Ideální nastavení automatického optimalizace + Cloudflare / StackPath CDN (2020)

Automatická aktualizace je skvělý plugin, ale pro ukládání do mezipaměti je WP Rocket obvykle v anketách Facebooku číslo 1.


Tak proč bys to použil??

Protože někteří hostitelé mají rádi Pojď tati a WP Engine zakázat většinu pluginů pro mezipaměť (protože mají svůj vlastní vestavěný systém ukládání do mezipaměti), ale nedělají věci, jako je optimalizace HTML, CSS, JavaScript, Google Fonts nebo CDN (síť pro doručování obsahu). Takže zatímco systém pro ukládání do mezipaměti vašeho hostitele může pro ukládání do mezipaměti dobře fungovat, Autoptimize pomáhá provádět „zbytek“ věcí (opravování položek v GTmetrix + Pingdom). Vyhněte se tak Google PageSpeed ​​Insights neměří ani dobu načítání.

Dokonce i Autoptimize vývojář na své stránce pluginů říká, že to funguje nejlépe, když je kombinován s pluginem pro mezipaměť. Doporučuji Swift, pokud jedete po bezplatné trase, a WP Rocket pokud můžete udělat 49 $ / rok, protože je to jednodušší konfigurace (je to také to, co používám a mám 100% skóre v GTmetrix), protože přichází s mnoha funkcemi, které většina pluginů cache nemá (čištění databáze, hostování kódu Google Analyitcs místně, prezenční signál) ovládání a integrace s oběma Cloudflare + dalšími CDN). Mám návody pro WP Rocket, Rychlý, Nejrychlejší mezipaměť WP, W3TC a dokonce i super mezipaměť WP.

Nakonec nakonfigurujeme nastavení automatického optimalizace. Ukážu vám také, jak přidat CDN (ideálně obě Zataženo a StackPath), protože každé z nich má svůj vlastní soubor datových center a více datových center = rychlejší doručování obsahu. CDN jsou doporučeny v Průvodce optimalizací WordPress.

Automatické doplnění pluginu

1. JS, CSS, & HTML

Povolte všechny tyto možnosti, abyste optimalizovali soubory JavaScriptu, CSS a HTML, a poté postupujte podle pokynů níže.

Automatické nastavení JS CSS HTML

Optimalizujte kód JavaScript

  • Agregovat soubory JS: enable, zkombinují se soubory JavaScriptu podle doporučení GTmetrix. Pokud je zakázáno, budou jednotlivé soubory načteny a nebudou kombinovány.
  • Také agregujte inline JS: enable, kombinuje soubory JavaScript, které jsou umístěny v souborech HTML. Autoptimize dává varování, které v podstatě znamená, že pokud na vašem webu něco poruší, buď vyloučte soubory JavaScriptu, nebo to deaktivujte.
  • Vynutit JavaScript v : deaktivujte, pokud nemáte chyby JavaScriptu. Je lepší se pokusit najít problematické soubory a vyloučit je, než vybrat tuto možnost, protože to blokuje vykreslení JavaScriptu (není optimální pro rychlost).
  • Vyloučit skripty z automatické aktualizace: Pokud po aktivaci určitých nastavení JavaScriptu uvidíte chyby, najděte problematický JavaScript a vyloučte soubory zde.
  • Přidejte obtékání try-catch: deaktivujte, pokud nemáte chyby JavaScriptu. To je další způsob, jak opravit chyby JS, aniž byste museli povolit vynucení JavaScriptu v hlavě.

Optimalizace kódu CSS

  • Agregovat soubory CSS: enable, to samé jako agregace souborů JS pouze pro CSS.
  • Také agregujte vložené CSS: enable, to samé jako agregace vložených souborů JS pouze pro CSS. Umožněte oběma dalším vylepšením doby načítání + skóre GTmetrix.
  • Generovat data: URI pro obrázky: deaktivujte, pokud používáte CDN. MaxCDN (StackPath) varuje vás že povolení tohoto vynutí donutí obrázky sloužit z vašeho původu sloužit místo vašeho CDN. Pokud to povolíte, může to zpočátku vést k menšímu počtu požadavků HTTP, ale pravděpodobně ne po nastavení CDN a zobrazování obrázků.
  • Inline a Defer CSS: enable, můžete povolit pouze tuto možnost nebo „vložit všechny CSS“, které Autoptimize nedoporučuje ve svých častých dotazech. Říká se, že „i když vložením všech CSS dojde k zablokování CSS bez vykreslení, bude to mít za následek to, že se vaše základní stránka HTML podstatně zvětší, a bude tedy vyžadovat více„ zpáteční “.
  • Vložit všechny CSS: disable, Autoptimize nedoporučuje povolit toto.
  • Vyloučit CSS z automatické aktualizace: Pokud po aktivaci určitých nastavení CSS uvidíte chyby, najděte problematické soubory CSS a vyloučte je zde. Poznámka: Možnost „minifikovat vyloučené CSS a JS“ v nabídce Různé možnosti musí být deaktivována.

2. Možnosti CDN

Tady je tvůj URL CDN jde (pokyny níže). Cloudflare vám neposkytuje URL CDN (místo toho změníte nameservery). Základní URL CDN je specificky pro StackPath, KeyCDN a další CDN – nikoli Cloudflare. Navrhuji použít StackPath + Cloudflare, protože vaše CDN budou mít více datových center a více datových center = rychlejší web.

Krok 1: Přihlaste se k odběru CDN. Používám StackPath, který má 34+ datová centra, která jsou silně umístěna ve Spojených státech a kde je většina mých návštěvníků. S bezplatnou 30denní zkušební verzí je to 10 $ / měsíc.

StackPath-Data-Centers

Krok 2: Na ovládacím panelu StackPath klepněte na kartu CDN a vytvořte web StackPath CDN.

StackPath-CDN-Tab

StackPath-CDN-Domain

StackPath-Server-IP-Address

* Zkopírujte adresu IP serveru podle potřeby v kroku 5 této části.

StackPath-CDN-URL-Autoptimize

Krok 3: Vložte adresu URL CDN do automatického obnovení pomocí http: // nebo https: // (podle toho, co používáte).

Autoptimize CDN URL

Krok 4: V StackPath přejděte na CDN → Nastavení mezipaměti a poté klikněte na „Vymazat vše“.

StackPath-Purge-Cache

Krok 5: Seznam whitelistů serveru IP v StackPath (WAF → Firewall).

StackPath-Whitelist-IP

Krok 6: Spusťte svůj web v GTmetrix a „síť pro doručování obsahu“ by měla být v YSlow zelená.

CDN GTmetrix YSlow

3. Různé nastavení

Zde jsou různá nastavení:

Automatické nastavení různých nastavení

Uložte agregovaný skript / css jako statické soubory – pokud je povoleno, znamená to, že soubory CSS a JS jsou ukládány do mezipaměti a zobrazovány prostřednictvím vašeho serveru, takže pokud je váš hosting nezpracovává, povolte jej.

Minifikujte vyloučené soubory CSS a JS – pokud vylučujete určité soubory CSS a JavaScript, je to proto, že při pokusech o jejich optimalizaci je problém a nechcete, aby byly minimalizovány..

Také optimalizujte pro přihlášené editory / administrátory – zakázat, obvykle chcete zakázat funkce výkonu v aplikaci WordPress admin, včetně funkcí výkonu Cloudflare.

4. Nastavení obrázků

Automatické optimalizování může také pomoci zrychlit načítání obrázků.

Automatické nastavení obrázků

Optimalizace obrázků – URL na vašem webu se změní tak, aby odkazovaly na ShortPixel’s CDN. Nemělo by to mít vliv na to, jak vypadají, pokud jde o bezeztrátovou kompresi, ale načtou se rychleji.

Kvalita optimalizace obrazu – najděte svou vlastní jedinečnou rovnováhu mezi kompresí a kvalitou (používám lesklý). Zde jsou rozdíly v každé úrovni komprese od ShortPixel:

Úrovně komprese obrázků ShortPixel

  • Lossy: nejvíce komprese, nejvíce ztráty kvality.
  • Lesklý: střední komprese, malá ztráta kvality.
  • Bezeztrátová: nízká komprese, nejnižší ztráta kvality.

Načíst WebP v podporovaných prohlížečích – povoleno, pokud používáte obrázky WebP a líné načítání obrázků.

Lazy-načíst obrázky – Osobně obrázky nezavádím jen líně, protože neustálé načítání obrázků při procházení stránky může být pro uživatele nepříjemné. Ano, výsledkem je méně žádostí a je doporučeno společností Google pro rychlejší doby načítání, ale je mi nepříjemné. To je zcela na vás.

5. Kritické CSS

Týká se to Automatický doplněk power-up plugin.

Vyžaduje prémii placený plán z criticalcss.com (7 $ / měsíc).

Doplněk vytváří kritická pravidla CSS, aby zajistil, že stránky budou vykresleny před načtením úplného CSS, čímž se zlepší „čas zahájení vykreslování“. Vše, co musíte udělat, je nainstalovat plugin, zaregistrovat se do plánu, zadat svůj klíčový klíč API CSS do části „Kritická CSS“ v automatické optimalizaci a plugin provede zbytek. Zkontrolujte plugin Nejčastější dotazy podrobnosti o vlastních konfiguracích.

Osobně ji nepoužívám a raději bych použil dalších 7 $ měsíčně na výkonnějším serveru.

Automatické zapnutí kritickéhossupu

Automatické nastavení kritických nastavení CSS

6. Extra nastavení

Autoptimize-Extra-Settings

Písma Google – povolit, pokud používáte Písma Google které zpomalují dobu načítání při stahování z externích zdrojů (knihovna písem Google). Upřednostňuji možnost „kombinovat a propojovat v hlavě“, protože to zlepšuje časy načítání bez viditelnosti vidění načtení písem (což je to, co se obvykle stane při načítání asynchronně. Také otestujte poslední možnost písma Google „zkombinujte a načtěte písma asynchronně s webfont.js“A zjistěte, které výnosy přináší lepší výsledky v GTmetrix.

Odebrat Emojis – enable (emodži jsou špatné pro dobu načítání).

Odebrat řetězce dotazů ze statických zdrojů – Řetězce dotazů jsou obvykle generovány zásuvnými moduly a nelze je opravit (v GTmetrix / Pingdom) jednoduše povolit, ale můžete to zkusit. Lepším řešením je zkontrolovat na vašem webu, zda neobsahuje vysoké CPU a nahradit je lehkými pluginy. Většina vysokých pluginů pro procesory zahrnuje sociální sdílení, galerii, tvůrce stránek, související příspěvky, statistiku a živé chatové pluginy. Měli byste také odstranit všechny nepotřebné doplňky a vyčistit databázi (pomocí pluginu jako WP-Optimize), chcete-li vymazat tabulky, které zůstaly po odinstalacích pluginů.

Předběžné připojení k doménám třetích stran – pomáhá prohlížečům předvídat požadavky z externích zdrojů (Fonty Google, Analytics, Mapy, Správce značek, Amazon store atd.). Obvykle se v sestavě GTmetrix objeví jako „omezit vyhledávání DNS“, ale níže jsou běžné příklady.

  • https://fonts.googleapis.com
  • https://fonts.gstatic.com
  • https://www.google-analytics.com
  • https://ajax.googleapis.com
  • https://connect.facebook.net
  • https://www.googletagmanager.com
  • https://maps.google.com

Předpožadujte specifické požadavky – najdete další informace o předběžném načtení a rady k prostředkům prohlížeče z WP Rocket, ale v podstatě je to tak, že určité soubory jsou stahovány jako vysoká priorita.

Async Javascript-Files – to znamená, že něco brání rychlému načtení obsahu nad záhybem. Tento tutoriál o vykreslení blokování JavaScriptů to vysvětluje dobře, ale pokud vidíte chyby JavaScriptu v GTmetrix a Pingdom, the Async plugin JavaScipt mohl udělat trik.

Optimalizujte videa YouTube – pokud vaše stránky obsahují videa, WP YouTube Lyte líný načte je, takže se načtou pouze tehdy, když uživatelé přejdou dolů a kliknou na tlačítko Přehrát, čímž se eliminují počáteční požadavky na servery YouTube. Tímto způsobem můžete oholit několik sekund časy načítání obsahu videa, protože jsou jedním z nejtěžších prvků na stránce. WP Rocket a Swift Performance mají toto nastavení vestavěné do svých nastavení, takže je nepotřebujete, pokud používáte některý z nich jako svůj plugin pro mezipaměť.

7. Optimalizujte více

Chcete-li svůj web dále optimalizovat, doporučujeme vám následující nástroje:

WP Rocket – ohodnotilo plugin mezipaměti č. 1 ve více anketách na Facebooku a má mnoho možností, které nejsou součástí aplikace Autoptimize (vyčištění databáze, ovládání prezenčního signálu, hostování Google Analytics místně, nahrazení prvku iframe YouTube obrázkem náhledu, přidání mezipaměti prohlížeče k Facebook Pixel atd.). WP Rocket také zpracovává téměř vše, co Autoptimize dělá, takže pro všechny ty optimalizace rychlosti potřebujete pouze 1 plugin. Proto je to skvělé. Můžete také získat 10% slevu zde.

ShortPixel – populární plugin pro optimalizaci obrázků a ten, který používám.

StackPath – CDN s více než 30 datovými středisky. Velmi snadné nastavení; stačí se zaregistrovat do plánu (10 $ / měsíc) a poté zkopírovat / vložit adresu CDN do možnosti Automaticky aktualizovat adresu URL CDN.

SiteGround – obvykle hodnotili hostitele č. 1 v anketách na Facebooku a také používá Yoast.

Yoast-on-Twitter-We-just-Switched-to-Siteground

2019 Anketa o hostování

2017-WordPress-Hosting-FB-Anketa

Doporučení hostitele Elementor

Doporučení pro červenec 2019

Anketa WordPress-Host-Anketa-Aug-2018

Sdílený hosting-anketa-2017

2019-Hosting-Anketa

Společnost Go-To-Hosting-Company

WordPress-Hosting-Anketa-2017

Managed-Hosting-Anketa

WooCommerce-Hosting-FB-Anketa

2016-Web-Hosting-Anketa

Best-WordPress-Hosting-Provider-Anketa

Best-Web-Hosting-2019-Anketa

Anketa WP Friendly Hosting Anketa

2016-WordPress-Hosting-FB-Anketa

Oblíbený hosting pro Elementora

2018 Doporučení pro hostování

Spravovaný-WordPress-Hosting-Anketa-2017

2019-Hosts-Anketa-1

Hosting-Anketa-Pro-Speed

WordPress-Hosting-Anketa-červen-1

SiteGround-Doporučení

2014-Managed-WordPress-Hosting-FB-Anketa

Anketa Best-Web-Hosting-Provider-Anketa

Hosting-Anketa-Únor-2019

Hosting-Doporučení-Anketa

Bluehost vs SiteGround

Anketa webového hostitele WordPress

Lidé obvykle migrují, protože jejich rychlostní technologie je mnohem rychlejší než EIG nebo GoDaddy:

Přepínání na SiteGround

Migrace doby načítání na webu

Bluehost na SiteGround GTmetrix

HostGator na SiteGround

SiteGround Statistiky Google PageSpeed

100 Perfektní skóre na webuGround

SiteGround Genesis

Rychlost dodaná serverem SiteGround

Snížení doby načítání pomocí funkce SiteGround

Nové časy odezvy SiteGround

HostGator na přenesení SiteGround

SiteGround Response Times On Joomla

Přepnuto na SiteGround Hosting

SiteGround Rocket Imagify Combo

Statistiky SiteGround PageSpeed

SiteGround On Joomla

SiteGround zkrácené doby načítání

SiteGround Speedy Hosting

Nová doba odezvy SiteGround

Vylepšení doby odezvy SiteGround

SiteGround také ano migrace zdarma s GrowBig+.

Cloudways – rychlejší než SiteGround (jedná se o cloudový hosting, nesdílí se) a byl také vysoce hodnocen v anketách na Facebooku. Začíná na jejich $ 10 / month Plán DigitalOcean. Nabízejí 1 bezplatnou migraci (kterou jsem využil) a tady je to, co se stalo s mým časem odezvy serveru:

SiteGround-vs-Cloudways-Cloud-Hosting

Doporučení pro hostování Facebook

Anketa VPS Cloud Hosting WooCommerce

VPS Cloud Hosting Anketa

Návrhy na hostování WordPress

Časy odezvy v cloudu

WP Engine do cloudway

Nepojmenovaná

Časy načítání Pingdomů v cloudu

Cloudways-Facebook-Review

S promo kódem můžete získat za první 2 měsíce Cloudways 25% slevu OMM25.

Kinsta – Prémiový hosting ve výši 30 $ / měsíc a přestože jsem je nezkoušel, neslyšel jsem nic jiného než skvělé věci o rychlosti, podpoře, dostupnosti a téměř všem o jejich hostování.

Perfmatters – zásuvný modul od Kinsta, který se stará o to, čemu říkám „různé optimalizace“, jako je selektivní deaktivace pluginů, omezení následných revizí, deaktivace autosavů, lokální hostování Google Analytics a mnoho dalšího. Postará se o konečných 10% rychlosti.

Některé z nich jsou doporučovány Autoptimize, jiné nejsou:

Automatická aktualizace přidávání

8. Cloudflare

Automatická aktualizace nemá nastavení pro přidání Cloudflare ‘CDN, ale to je snadné nastavení. A určitě byste měli, protože to dodává 200 dalších center do vaší sítě pro doručování obsahu (CDN).

Cloudflare Data Centers

Krok 1. Zaregistrujte se do služby Cloudflare a budete vyzváni k přidání webu a zahájení skenování.

cloudflare-start-scan

Krok 2. Po dokončení skenování vyberte bezplatný plán a poté vás Cloudflare provede sadou stránek. Nakonec se dostanete na stránku, kde vás Cloudflare přiřadí 2 jmenné servery.

Cloudflare-Name-Servers-Dashboard

Krok 3. Přihlaste se ke svému registrátorovi domény (např. Namecheap) a proveďte vyhledávání Google „jak změnit jmenné servery v Namecheap“ (hledejte pouze registr své domény) a postupujte podle jejich pokynů. Zkopírujete 2 jmenné servery poskytované službou Cloudflare a vložíte je do vlastní možnosti jmenných serverů ve vašem registrátorovi domény. Počkejte 72 hodin na propagaci.

Nameservery Godaddy Cloudflare

A je to!

Co bude dál?

Podívejte se na moje video – jedná se o 42minutové video, ale pokryju skoro všechno (časová razítka v popisu videa) a měli byste se naučit spoustu skvělých informací o rychlosti webu WordPress:

Chcete vědět, jak jsem získal 100% skóre v GTmetrix?
Podívejte se na můj úplný průvodce optimalizací rychlosti WordPress, který obsahuje více než 38 tipů, jak opravit položky GTmetrix / Pingdom, včetně upgradu na PHP 7, zobrazování zmenšených obrázků, určení rozměrů obrázků, vyčištění databáze, lokální hostování Google Analytics, zakázání WP a další.

Často kladené otázky

&# x1f680; Potřebuji kromě automatické aktualizace i další pluginy pro rychlost?

Ano, obvykle chcete také použít plugin pro ukládání do mezipaměti, optimalizaci obrazu, vyčištění databáze, kontrolu srdečního rytmu a selektivní deaktivaci pluginů. Doporučuji WP Rocket, ShortPixel a Perfmatters.

&# x1f680; Jak nastavíte CDN pomocí automatické optimalizace?

Vyberte své CDN (používám StackPath), zkopírujte URL CDN a vložte jej do pole CDN UR autoptimize.

&# x1f680; Jak optimalizujete písma Google pomocí automatické optimalizace?

Doporučuji použít možnost Kombinovat a propojit v hlavě a předběžně připojit vaše písma pomocí automatického optimalizace.

&# x1f680; Postará se Autoptimize o ukládání do mezipaměti?

Ne, pro ukládání do mezipaměti budete muset použít samostatný plugin. Pokud používáte SiteGround, doporučuji WP Rocket nebo SG Optimizer.

&# x1f680; Jak nakonfigurujete nastavení automatického optimalizace?

Vše je uvedeno v tomto výukovém programu – sledujte přehled GTmetrix a konkrétní položky, které je třeba opravit. Pokud konfigurace v Autoptimize neopraví, zvažte opravu pomocí jiného pluginu.

Otázky? Pusť mi linku!
Tom

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map