Idealna samodejna optimizacija nastavitev + Cloudflare / StackPath CDN (2020)

Samodejno optimizirajte je odličen vtičnik, toda za predpomnjenje je WP Rocket običajno # 1 v Facebook anketah.


Zakaj bi ga torej uporabljali?

Ker imajo nekateri gostitelji radi GoDaddy in WP motor na črnem seznamu večina vtičnikov predpomnilnika (ker imajo vgrajen sistem za predpomnjenje), vendar ne počnejo stvari, kot so optimizacija HTML, CSS, JavaScript, Google Fonts ali CDN (omrežje za pošiljanje vsebine). Čeprav lahko predpomnilniški sistem vašega gostitelja deluje dobro za predpomnjenje, samodejno optimiziranje pomaga pri “počitku” stvari (pritrjevanje elementov v GTmetrix + Pingdom). Izogibajte se vpogledom v Google PageSpeed ​​Speed ne meri niti časa nalaganja.

Tudi razvijalec za samodejno optimizacijo na svoji strani z vtičniki pravi, da najbolje deluje, če ga kombiniramo s predpomnilnikom. Priporočam Swift, če greš po prosti poti, in Raketa WP če lahko naredite 49 USD na leto, saj je lažje konfigurirati (to je tudi tisto, kar uporabljam in imam 100% ocene v GTmetrixu), saj ima številne funkcije, ki jih večina vtičnikov predpomnilnika ne (čiščenje baze podatkov, lokalno gostovanje kode Google Analyitcs lokalno, srčni utrip nadzor in integracija z obema Cloudflare + drugimi CDN-ji). Imam vaje za WP Rocket, Hitro, WP najhitrejši predpomnilnik, W3TC in celo WP Super predpomnilnik.

Zato nastavimo nastavitve samodejnega optimiziranja. Pokazal vam bom tudi, kako dodati CDN (v najboljšem primeru oboje) Cloudflare in StackPath), ker ima vsak svoj nabor podatkovnih centrov in več podatkovnih centrov = hitrejša dobava vsebine. CDN priporočamo v Vodnik za optimizacijo WordPress-a.

Samodejno optimizirajte vtičnik

1. JS, CSS, & HTML

Vse to omogočite za optimizacijo datotek JavaScript, CSS in HTML, nato pa si oglejte spodnja navodila.

Samodejno optimizirajte nastavitve HTML JS CSS

Optimizirajte kodo JavaScript

  • Združite datoteke JS: omogočite, to združuje datoteke JavaScript, kot priporoča GTmetrix. Če je onemogočeno, se naložijo posamezne datoteke in ne bodo združene.
  • Sestavite tudi inline JS: enable, to združuje datoteke JavaScript, ki se nahajajo v datotekah HTML. Samodejno optimizira opozorilo, ki v bistvu pomeni, če na vašem spletnem mestu karkoli pokvari, bodisi izključite datoteke JavaScript ali to onemogočite.
  • Prisilite JavaScript v : onemogoči, razen če imate napake JavaScript. Bolje je, da poiščete problematične datoteke in jih izključite, kot da izberete to možnost, ker to onemogoči JavaScript upodabljanje (ni optimalno za hitrost).
  • Izključi skripte iz samodejnega optimiziranja: če po omogočitvi določenih nastavitev JavaScript vidite napake, poiščite problematični JavaScript in tukaj izključite datoteke.
  • Dodajte poskusno zavijanje: onemogoči, razen če imate napake JavaScript. To je še en način, kako odpraviti napake JS, ne da bi morali v glavi omogočiti prisiljen JavaScript.

Optimizirajte kodo CSS

  • Združite datoteke CSS: omogočite, enako kot združevanje datotek JS samo za CSS.
  • Zbirajte tudi vgrajeni CSS: omogočite, enako kot združevanje vgrajenih datotek JS samo za CSS. Omogočite oboje, da še izboljšate čas nalaganja + ocene GTmetrix.
  • Ustvari podatke: URI za slike: onemogoči, če uporabljaš CDN. MaxCDN (StackPath) vas opozori da bo omogočanje tega prisililo, da se slike pošljejo iz vašega izvora, namesto iz vašega CDN. Če omogočite to, lahko sprva povzroči manj zahtev HTTP, vendar verjetno ne, ko nastavite CDN in preko njega postrežete slike.
  • Vgrajen in odložen CSS: omogočite, lahko omogočite samo to možnost ali “vgradi vse CSS”, kar samodejno optimiziranje ne priporoča v njihovih pogostih vprašanjih. Pravijo, “čeprav bo z vstavitvijo vseh CSS blokada CSS blokirana brez upodabljanja, se bo vaša osnovna HTML-stran znatno povečala, kar bo zahtevalo več” povratnih poti “.
  • Vgrajeni vsi CSS: onemogoči, samodejno optimiziranje ne priporoča, da to omogočite.
  • Izključi CSS iz samodejnega optimiziranja: če po omogočitvi določenih nastavitev CSS opazite napake, poiščite problematične datoteke CSS in jih tukaj izključite. Opomba: možnost »pomanjšaj izključeni CSS in JS« v možnostih Razno je treba onemogočiti.

2. Možnosti CDN

Tukaj je vaš CDN URL gre (navodila spodaj). Cloudflare vam ne ponuja CDN URL-ja (namesto tega boste spremenili strežnike imen). Osnovni URL CDN je posebej za StackPath, KeyCDN in druge CDN – ne za Cloudflare. Predlagam, da uporabite obe StackPath + Cloudflare, saj bodo vaši CDN-ji imeli več podatkovnih centrov in več podatkovnih centrov = hitrejše spletno mesto.

Korak 1: Prijavite se za CDN. Uporabljam StackPath, ki ima 34+ podatkovnih centrov, ki se nahajajo v Združenih državah Amerike in je tam največ mojih obiskovalcev. To je 10 USD na mesec z brezplačnim 30-dnevnim preizkusom.

Podatkovni centri StackPath

2. korak: Na nadzorni plošči StackPath kliknite jeziček CDN in ustvarite spletno mesto StackPath CDN.

StackPath-CDN-Tab

StackPath-CDN-domena

StackPath-Server-IP-naslov

* Kopirajte IP naslov strežnika, kot je potrebno v 5. koraku tega razdelka.

StackPath-CDN-URL-Autoptimize

3. korak: Prilepite svoj CDN URL v samodejno optimiziranje s http: // ali https: // (karkoli uporabite).

Samodejno optimizirajte CDN URL

4. korak: V StackPath pojdite na CDN → Nastavitve predpomnilnika in kliknite »Purge Everything«.

StackPath-Purge-Cache

5. korak: Na seznamu strežnika v StackPathu dodajte seznam dovoljenih (WAF → Požarni zid).

StackPath-Whitelist-IP

6. korak: Spletno mesto zaženite v GTmetrix in “omrežje za pošiljanje vsebine” mora biti zeleno v YSlow.

CDN GTmetrix YSlow

3. Razno nastavitve

Tu so nastavitve Razno:

Samodejno prilagodite nastavitve raznega

Shrani združeni skript / css kot statične datoteke – če sta omogočena, to pomeni, da se datoteke CSS in JS shranijo v predpomnilnik in se strežejo prek vašega strežnika, tako da, če vaše gostovanje ne ravna s temi, omogočite.

Zmanjšajte izključene datoteke CSS in JS – če izključujete določene datoteke CSS in JavaScript, je to težava, ker jih poskušate optimizirati in jih ne želite spremeniti.

Optimizirajte tudi za prijavljene urednike / skrbnike – onemogočite, običajno želite onemogočiti funkcije uspešnosti v skrbniku WordPress, vključno z funkcijami uspešnosti Cloudflare.

4. Nastavitve slik

Samodejno optimiziranje lahko pomaga tudi pri hitrejšem nalaganju slik.

Samodejno prilagodite nastavitve slik

Optimizirajte slike – URL-ji na vašem spletnem mestu bodo spremenjeni, da bodo kazali na CDN podjetja ShortPixel. To ne bi smelo vplivati ​​na videz, dokler je stiskanje brez izgub, ampak se bo naložilo hitreje.

Kakovost optimizacije slike – poiščite svoje edinstveno ravnovesje med stiskanjem in kakovostjo (uporabljam Glossy). Tu so razlike v vsaki stopnji stiskanja od ShortPixel:

Ravni stiskanja slike ShortPixel

  • Izgubljeni: največ stiskanja, najbolj izguba kakovosti.
  • Sijajni: srednja kompresija, malo izgube kakovosti.
  • Brez izgube: nizka kompresija, najnižja izguba kakovosti.

Naložite WebP v podprte brskalnike – omogočeno, če uporabljate slike WebP in slike lene nalaganja.

Slike leno obremenjene – Osebno ne lenim, da naložim svoje slike, ker lahko nenehno nalaganje slik med pomikanjem po strani moti za uporabnike. Da, rezultat je manj zahtev in je priporoča Google za hitrejše nalaganje, vendar se mi zdi moteče. To je odvisno samo od vas.

5. Kritični CSS

To se nanaša na Samodejno optimizirajte vtičnik za vklop.

Zahteva premijo plačani načrt s kritičnega spletnega mesta.com (7 USD / mesec).

Vtičnik ustvari kritična pravila CSS, da se prepriča, da so strani naložene pred nalaganjem celotnega CSS-ja, s čimer se izboljša čas »začetek upodabljanja«. Vse, kar morate storiti, je, da namestite vtičnik, se prijavite za načrt, vnesete ključ API-ja za kritični CSS v razdelek »Kritični CSS« samodejno prilagodite, vtičnik pa bo naredil ostalo. Preverite vtičnike Stran s pogostimi vprašanji za podrobnosti o konfiguracijah po meri.

Jaz osebno je ne uporabljam in bi raje porabil dodatnih 7 USD / mesec na zmogljivejšem strežniku.

Samodejno optimizirajte CC-Power vklop

Samodejno optimizirajte kritične nastavitve CSS

6. Dodatne nastavitve

Samodejno optimizirajte dodatne nastavitve

Google Pisave – omogočite, če uporabljate Google Pisave ki upočasnijo čas nalaganja, ko jih povlečemo iz zunanjih virov (knjižnica Google Font). Najraje imam možnost »združi in poveži v glavi«, saj to izboljša čas nalaganja, ne da bi vidnost naložila pisave (kar se običajno zgodi pri nalaganju asinhrono. Preizkusite tudi zadnjo možnost Google Font »združite in nalagajte pisave asinhrono z webfont.js“In si oglejte, kaj prinaša boljše rezultate v GTmetrix.

Odstranite Emojis – omogoči (emojiji so slabi za čas nalaganja).

Odstranite poizvedbene nize iz statičnih virov – poizvedbene nize običajno generirajo vtičniki in jih ni mogoče popraviti (v GTmetrix / Pingdom), če to preprosto omogočite, vendar lahko poskusite. Boljša rešitev je, da na svojem spletnem mestu preverite, ali so vtičniki z visokim procesorjem, in jih zamenjate z lahkimi vtičniki. Večina visokih vtičnikov za CPU vključuje deljenje družabnih omrežij, galerijo, ustvarjalce strani, povezane objave, statistike in vtičnike za klepet v živo. Prav tako morate izbrisati vse nepotrebne vtičnike in očistiti bazo podatkov (z uporabo vtičnika, kot je WP-Optimizirajte) počistite tabele, ki jih puščajo neinštalirani vtičniki.

Prednamestite na domene tretjih oseb – pomaga brskalnikom, da predvidijo zahteve iz zunanjih virov (Google Fonts, Analytics, Maps, Upravitelj oznak, Amazon trgovina itd.) V poročilu GTmetrix bodo te ponavadi prikazane kot “zmanjšanje pregledov DNS”, vendar so spodaj pogosti primeri.

  • 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

Prednastavite posebne zahteve – lahko najdete več o prednastavitvi in namigi za vire brskalnika iz WP Rocket, vendar to v bistvu omogoča, da se nekatere datoteke prenesejo kot velika prednostna naloga.

Async datoteke Javascript – to pomeni, da nekaj preprečuje hitro nalaganje vsebine zgoraj. Ta vadnica o render blokira JavaScripts to dobro razloži, če pa v GTmetrixu in Pingdomu vidite napake JavaScript, Async vtičnika JavaScipt bi lahko naredil trik.

Optimizirajte YouTube video posnetke – če ima vaše spletno mesto videoposnetke, WP YouTube Lyte leni jih naloži, da se naložijo le, ko se uporabniki pomaknejo navzdol in kliknejo gumb za predvajanje, s čimer odpravijo začetne zahteve do YouTubovih strežnikov. To lahko obrije več sekund izklopa nalaganja vsebin z videoposnetki, saj so eden najtežjih elementov na strani. WP Rocket in Swift Performance imajo to vgrajeno v svoje nastavitve, zato tega ne potrebujete, če enega od njih uporabljate kot vtičnik za predpomnilnik.

7. Optimizirajte več

Če želite še bolj optimizirati spletno mesto, je tu priporočeno orodje:

Raketa WP – je ocenil 1. vtičnik predpomnilnika na več Facebook anketah in ima veliko možnosti, ki niso vključene v samodejno optimizacijo (čiščenje baze podatkov, nadzor srčnega utripa, lokalno gostovanje Google Analytics, zamenjava YouTube iframea s predogledno sliko, dodajanje predpomnilnika Browser v Facebook Pixel itd.) WP Rocket tudi upravlja skoraj vse, kar Autoptimize počne, zato za vse te hitrosti potrebujete samo 1 vtičnik. Zato je tako zelo Tu lahko dobite tudi 10% popusta.

ShortPixel – priljubljen vtičnik za optimizacijo slik in tisti, ki ga uporabljam.

StackPath – CDN s 30+ podatkovnimi centri. Zelo enostavno za namestitev; samo prijavite se za načrt (10 USD / mesec) in nato kopirajte / prilepite svoj CDN URL v možnost Samodejno optimiziraj CDN URL.

SiteGround – običajno je na anketah na Facebooku ocenil prvo mesto gostitelja in tudi uporablja Yoast.

Yoast-on-Twitter-Mi smo ravno prešli na spletno mesto

2019 Hosting anketa

2017-WordPress-gostovanje-FB-anketa

Priporočila Elementor Gostovanje

Julij 2019 Priporočilo za gostovanje

WordPress-gostitelj-anketa-avgust 2018

Skupno gostovanje-anketa-2017

2019-gostovanje-anketa

Go-to-gostovanje-podjetje

WordPress-gostovanje-anketa-2017

Anketa z upravljanjem gostovanja

WooCommerce-gostovanje-FB-anketa

2016-Spletno gostovanje-anketa

Anketa, ki je najboljša za WordPress-gostovanje-ponudnik

Najboljše spletno gostovanje-2019-anketa

WP prijazno gostovanje

2016-WordPress-gostovanje-FB-anketa

Najljubše gostovanje za Elementor

2018 Priporočila za gostovanje

Upravljavec-WordPress-gostovanje-anketa-2017

2019-gostitelji-anketa-1

Gostovanje-anketa-za-hitrost

WordPress-gostovanje-anketa-junij-1

Priporočilo SiteGround

Anketa 2014-Managed-WordPress-hosting-FB-anketa

Najboljše spletno gostovanje-ponudnik anketa

Gostovanje-anketa-februar 2019

Gostovanje-priporočila-anketa

Bluehost proti SiteGround

Anketa spletnega gostitelja WordPress

Ljudje se običajno selijo, ker je njihovo hitrostna tehnologija je veliko hitrejša kot EIG ali GoDaddy:

Preklop na SiteGround

Migracije časa nalaganja SiteGround

Bluehost do SiteGround GTmetrix

HostGator na spletno mesto

Vpogled v Googlove spletne strani SiteGround

100 popoln rezultat na spletnem mestu

SiteGround Genesis

Hitrost, ki jo zagotavlja SiteGround

Skrajšani časi obremenitve s SiteGround

Novi časi odzivanja na spletnem mestu

HostGator na spletno selitev v zemljo

Časi odziva SiteGround na Joomli

Preklopi na gostovanje spletnega mesta

SiteGround Rocket Zamislite Combo

SiteGround PageSpeed ​​vpogled v stran

SiteGround On Joomla

Skrajšani časi obremenitve SiteGround

SiteGround Hitro gostovanje

Nov čas odziva na spletnem mestu

Izboljšanje časa odzivnosti SiteGround

SiteGround tudi počne brezplačne migracije z GrowBig+.

Cloudways – hitreje kot SiteGround (gostovanje v oblaku, ni v skupni rabi) in je bilo tudi na Facebook anketah visoko ocenjeno. Začne pri 10 USD / mesec s svojimi Načrt DigitalOcean. Ponujajo 1 brezplačno selitev (za katero sem jih prevzel) in tukaj se je zgodilo, kar se je zgodilo z odzivom mojega strežnika:

SiteGround-vs-Cloudways-Cloud-gostovanje

Priporočila gostovanja Facebook

VPS gostovanje v oblaku WooCommerce

Anketa v VPS gostovanju v oblaku

Predlogi za gostovanje v WordPressu

Cloudways Response Times

WP motor v oblake

Brez naslova

Cloudways Pingdom Load Times

Cloudways-Facebook-Pregled

S promocijsko kodo lahko v prvih dveh mesecih Cloudways pridobite 25% popusta OMM25.

Kinsta – gostovanje s premijami v višini 30 USD na mesec in čeprav jih še nisem preizkusil, nisem slišal nič drugega kot o super hitrosti, podpori, časih delovanja Kinsta in skoraj vsem o njihovem gostovanju.

Perfmatri – vtičnik Kinsta, ki skrbi za tako imenovane “raznorazne optimizacije”, kot so selektivno onemogočanje vtičnikov, omejevanje popravkov objav, onemogočanje samodejnega shranjevanja, lokalno gostovanje Google Analytics in še veliko več. Skrbi za končnih 10% hitrosti.

Nekatere od teh priporoča funkcija Autoptimize, druge pa ne:

Samodejno optimizirajte Add Ons

8. Oblak oblaka

Samodejno optimiziranje nima nastavitev za dodajanje CDN v oblaku, vendar je to enostavno nastaviti. In zagotovo bi morali, ker to dodaja 200 dodatnih centrov v vaše omrežje za pošiljanje vsebin (CDN).

Cloudflare podatkovni centri

Korak 1. Prijavite se za Cloudflare in pozvani boste, da dodate svoje spletno mesto in začnete skenirati.

cloudflare-start-scan

2. korak. Ko je skeniranje opravljeno, izberite brezplačni načrt in Cloudflare vas bo popeljal skozi niz strani. Na koncu boste preusmerjeni na stran, kjer vam Cloudflare dodeli 2 strežniki imen.

Nadzorna plošča Cloudflare-Name-strežniki-nadzorna plošča

3. korak. Prijavite se v registrator domene (npr. Namecheap) in v Googlu poiščite “kako spremeniti imenske strežnike v Namecheap” (samo poiščite registrator domene) in sledite njihovim navodilom. Kopirali boste dva strežnika imen, ki jih ponuja Cloudflare, in jih prilepili v opcijo strežnikov imen po meri v registratorju domene. Za razmnoževanje pustite 72 ur.

Godaddy Cloudflare imena

To je to!

Kaj je naslednje?

Oglejte si moj video – gre za 42-minutni video, vendar pokrivam skoraj vse (časovne žige v opisu videoposnetka) in naučili bi se veliko informacij o hitrosti spletnega mesta WordPress:

Želite vedeti, kako sem dosegel 100% rezultate v GTmetrix?
Oglejte si moj celotni vodnik za optimizacijo hitrosti WordPress, ki vsebuje več kot 38 nasvetov za določanje elementov GTmetrix / Pingdom, vključno z nadgradnjo na PHP 7, serviranje pomanjšanih slik, določitev dimenzij slike, čiščenje baze podatkov, lokalno gostovanje Google Analytics, WP Disable in drugi.

Pogosto zastavljena vprašanja

&# x1f680; Ali poleg samodejnega prilagajanja potrebujem še druge vtičnike za hitrost?

Da, ponavadi želite uporabiti tudi vtičnik za predpomnjenje, optimizacijo slike, čiščenje baze podatkov, nadzor srčnega utripa in selektivno onemogočanje vtičnikov. Za te priporočam WP Rocket, ShortPixel in Perfmatters.

&# x1f680; Kako nastavite CDN s samodejno optimizacijo?

Izberite svoj CDN (uporabljam StackPath), kopirajte svoj CDN URL in ga prilepite v polje Autoptimize v CDN UR polju.

&# x1f680; Kako optimizirate Google Pisave s samodejno optimizacijo?

Priporočam uporabo možnosti Combine and Link In Head in predhodno povezovanje pisav s funkcijo Autoptimize.

&# x1f680; Ali Autoptimize skrbi za predpomnjenje?

Ne, za predpomnjenje boste morali uporabiti ločen vtičnik. Priporočam WP Rocket ali SG Optimizer, če uporabljate SiteGround.

&# x1f680; Kako konfigurirate nastavitve samodejnega optimiziranja?

Vse je navedeno v tej vadnici – le pozorno spremljajte svoje poročilo o GTmetrixu in katere posebne elemente je treba popraviti. Če konfiguracije nastavitev v samodejnem optimiziranju ne odpravi, uporabite drugi vtičnik za popravljanje elementov.

Vprašanja? Spusti mi vrvico!
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