İdeal Otomatik Optimizasyon Ayarları + Cloudflare / StackPath CDN (2020)

Autoptimize harika bir eklentidir, ancak önbelleğe almak için WP Rocket genellikle Facebook anketlerinde 1 numaradır.


Öyleyse neden kullanıyorsun?

Çünkü bazı ev sahipleri GoDaddy ve WP Motoru çoğu önbellek eklentisini kara listeye alın (kendi yerleşik önbellek sistemine sahip oldukları için) HTML, CSS, JavaScript, Google Yazı Tipleri veya CDN (içerik dağıtım ağı) optimize etme gibi şeyler yapmazlar. Bu nedenle, ana makinenizin önbellekleme sistemi önbellekleme için iyi çalışıyor olsa da, Autoptimize, öğelerin “geri kalanını” yapmanıza yardımcı olur (GTmetrix + Pingdom’daki öğeleri sabitleme). Google PageSpeed ​​Insights’tan olduğu gibi kaçının yükleme sürelerini bile ölçmez.

Autoptimize geliştiricisi bile eklenti sayfasında bir önbellek eklentisiyle birleştirildiğinde en iyi sonucu verdiğini söylüyor. Eğer ücretsiz rotayı tercih ediyorsanız Swift’i öneriyorum ve WP Roketi yapılandırmak daha kolay olduğu için yılda 49 $ yapabilirseniz (aynı zamanda kullandığım ve GTmetrix’te% 100 puanım var), çünkü çoğu önbellek eklentisinin sahip olmadığı birçok özellikle birlikte gelir (veritabanı temizleme, yerel olarak Google Analyitcs kodunu barındırma, kalp atışı kontrol ve her iki Cloudflare + diğer CDN’lerle entegrasyon). WP Rocket için derslerim var, hızlı, WP En Hızlı Önbellek, W3TC ve hatta WP Süper Önbellek.

Şimdi Otomatik Optimize Et ayarlarını yapılandıralım. Nasıl CDN ekleyeceğinizi de göstereceğim (ideal olarak her ikisi de Cloudflare ve StackPath), çünkü her birinin kendi veri merkezleri vardır ve daha fazla veri merkezi = daha hızlı içerik teslimi. CDN’ler WordPress’in optimizasyon kılavuzu.

Eklentiyi otomatik olarak optimize et

1. JS, CSS, & HTML

JavaScript, CSS ve HTML dosyalarını optimize etmek için tüm bunları etkinleştirin, ardından aşağıdaki talimatlara bakın.

JS CSS HTML Ayarlarını otomatik olarak optimize etme

JavaScript Kodunu Optimize Edin

  • Toplu JS dosyaları: enable, bu JavaScript dosyalarını GTmetrix tarafından önerilen şekilde birleştirir. Devre dışı bırakılırsa, tek tek dosyalar yüklenir ve birleştirilmez.
  • Ayrıca satır içi JS toplayın: enable, HTML dosyalarında bulunan JavaScript dosyalarını birleştirir. Autoptimize, sitenizdeki herhangi bir şeyi ihlal etmesi durumunda JavaScript dosyalarını hariç tutmanız veya devre dışı bırakmanız gerektiği anlamına gelen bir uyarı verir.
  • JavaScript’i içeri zorla : JavaScript hatalarınız yoksa devre dışı bırakın. Sorunlu dosyaları bulmaya ve hariç tutmaya çalışmaktansa, bu seçeneği seçmekten daha iyidir, çünkü bu JavaScript render engelleme yapar (hız için en uygun değildir).
  • Komut dosyalarını Autoptimize’den hariç tutma: bazı JavaScript ayarlarını etkinleştirdikten sonra hata görürseniz, sorunlu JavaScript’i bulun ve dosyaları burada hariç tutun.
  • Try-catch sarma ekle: JavaScript hatalarınız yoksa devre dışı bırakın. Bu, kafadaki JavaScript’i etkinleştirmeye gerek kalmadan JS hatalarını düzeltmenin başka bir yoludur.

CSS Kodunu Optimize Edin

  • Toplu CSS dosyaları: etkin, JS dosyalarını yalnızca CSS için toplamakla aynı şey.
  • Ayrıca toplu satır içi CSS: enable, satır içi JS dosyalarını yalnızca CSS için toplamakla aynı şey. Yükleme sürelerini + GTmetrix puanlarını daha da artırmak için her ikisini de etkinleştirin.
  • Veri oluşturma: Resimler için URI’ler: CDN kullanıyorsanız devre dışı bırak. MaxCDN (StackPath) seni uyarır bunun etkinleştirilmesi, görüntülerin CDN yerine menşe sunumunuzdan sunulmasını sağlar. Bunu etkinleştirmek başlangıçta daha az HTTP isteğiyle sonuçlanabilir, ancak bir CDN kurduktan ve bundan sonra görüntüler sunduktan sonra değil.
  • Satır İçi ve Erteleme CSS: etkinleştirin, yalnızca bu seçeneği veya Autoptimize’ın SSS’lerinde önermediği “tüm CSS’yi satır içi” özelliğini etkinleştirebilirsiniz. “Tüm CSS’leri satır içine almak, CSS’nin render oluşturma engellemesini yapmasına rağmen, temel HTML sayfanızın önemli ölçüde büyüyerek daha fazla” gidiş dönüş “gerektirmesine neden olur..
  • Tüm CSS’leri satır içinde: devre dışı, Autoptimize bunu etkinleştirmenizi önermez.
  • CSS’yi Otomatik Optimize Etme’den hariç tutma: belirli CSS ayarlarını etkinleştirdikten sonra hata görürseniz, sorunlu CSS dosyalarını bulun ve burada hariç tutun. Not: Çeşitli Seçenekler’deki “hariç tutulan CSS ve JS’yi küçült” seçeneğinin devre dışı bırakılması gerekir.

2. CDN Seçenekleri

Burası sizin CDN URL’si gider (aşağıdaki talimatlar). Cloudflare size bir CDN URL’si sağlamaz (bunun yerine ad sunucularını değiştirirsiniz). CDN Temel URL’si özellikle StackPath, KeyCDN ve diğer CDN’ler içindir – Cloudflare için değil. CDN’lerinizin daha fazla veri merkezi ve daha fazla veri merkezi olacağı için StackPath + Cloudflare kullanmanızı öneririz.

Aşama 1: Bir CDN’ye kaydolun. Amerika Birleşik Devletleri’nde yoğun olarak bulunan ve ziyaretçilerimin çoğunun bulunduğu 34+ veri merkezine sahip StackPath kullanıyorum. 30 günlük ücretsiz deneme sürümü ile ayda 10 ABD doları.

StackPath-Data-Merkezleri

Adım 2: StackPath kontrol panelinde CDN sekmesini tıklatın ve StackPath CDN Sitesi oluşturma.

StackPath-CDN-Tab

StackPath-CDN-Domain

StackPath-Sunucu-IP Adresi

* Bu bölümün 5. adımında sunucu IP adresinizi gerektiği gibi kopyalayın.

StackPath-CDN-URL-Autoptimize

Aşama 3: Http: // veya https: // (hangisini kullanırsanız kullanın) ile CDN URL’nizi Autoptimize’a yapıştırın.

CDN URL'sini otomatik olarak optimize et

4. Adım: StackPath’te CDN → Önbellek Ayarları’na gidin, ardından “Her Şeyi Temizle” yi tıklayın.

StackPath-Temizle-Cache

Adım 5: StackPath’te sunucu IP adresinizi beyaz listeye ekleyin (WAF → Güvenlik Duvarı).

StackPath-Beyaz liste-IP

6. Adım: Sitenizi GTmetrix’te çalıştırın ve YSlow’da “içerik dağıtım ağı” yeşil olmalıdır.

CDN GTmetrix YSlow

3. Çeşitli Ayarlar

Çeşitli ayarlar şunlardır:

Çeşitli Ayarları Otomatik Olarak En İyileştir

Birleştirilmiş komut dosyasını / css’yi statik dosyalar olarak kaydetme – etkinleştirilirse, bu CSS ve JS dosyalarının önbelleğe kaydedildiği ve sunucunuz üzerinden sunulduğu anlamına gelir, bu nedenle barındırma hizmetiniz bunlarla başa çıkmıyorsa, etkinleştirin.

Hariç tutulan CSS ve JS dosyalarını küçültün – belirli CSS ve JavaScript dosyalarını hariç tutuyorsanız, bunun nedeni onları optimize etmeye çalışırken bir sorun olması ve bunların küçültülmesini istememenizdir..

Ayrıca, giriş yapmış editörler / yöneticiler için optimize edin – devre dışı bırak, genellikle WordPress yöneticisinde Cloudflare performans özellikleri de dahil olmak üzere performans özelliklerini devre dışı bırakmak istiyorsunuz.

4. Görüntü Ayarları

Otomatik iyileştirme ayrıca görüntülerin daha hızlı yüklenmesine yardımcı olabilir.

Görüntü Ayarlarını Otomatik Olarak Optimize Edin

Görüntüleri Optimize Edin – Web sitenizdeki URL’ler, ShortPixel’in CDN’si. Bu, kayıpsız sıkıştırma olduğu sürece nasıl göründüklerini etkilememelidir, ancak daha hızlı yüklenir.

Görüntü Optimizasyonu Kalitesi – sıkıştırma ve kalite arasında kendi benzersiz dengenizi bulun (Parlak kullanıyorum). ShortPixel’den her sıkıştırma seviyesindeki farklılıklar şunlardır:

ShortPixel Görüntü Sıkıştırma Seviyeleri

  • kayıplı: en çok sıkıştırma, en çok kalite kaybı.
  • Parlak: orta sıkıştırma, az kalite kaybı.
  • kayıpsız: düşük sıkıştırma, en düşük kalite kaybı.

WebP’yi desteklenen tarayıcılara yükleyin – WebP resimleri ve tembel yük resimleri kullanıyorsanız etkin.

Tembel yüklenen görüntüler – Kişisel olarak görüntülerimi tembelleştirmiyorum çünkü sayfayı aşağı kaydırırken görüntüleri sürekli yüklemek kullanıcılar için can sıkıcı olabilir. Evet, daha az istekle sonuçlanıyor ve Google tarafından önerilen Daha hızlı yükleme süreleri için, ama can sıkıcı buluyorum. Bu tamamen size bağlı.

5. Kritik CSS

Bu, Critcss.com açılış eklentisini otomatik olarak optimize et.

Bir prim gerektirir criticalcss.com’dan ücretli plan (7 $ / ay).

Eklenti, sayfaların tam CSS yüklenmeden önce oluşturulduğundan emin olmak için kritik CSS kuralları oluşturur ve böylece “oluşturma zamanı” artar. Tek yapmanız gereken eklentiyi yüklemek, bir plana kaydolmak, Kritik CSS API Anahtarınızı Autoptimize’ın “Kritik CSS” bölümüne girmeniz ve eklentinin geri kalanını yapmasıdır. Eklentinin SSS sayfası özel yapılandırmalarla ilgili ayrıntılar için.

Ben şahsen kullanmıyorum ve ayda 7 dolarlık ekstra gücü daha güçlü bir sunucuda kullanmayı tercih ediyorum.

Kritik CD'leri otomatik olarak optimize edin

Kritik CSS Ayarlarını Otomatik Olarak Optimize Edin

6. Ekstra Ayarlar

Autoptimize-Ekstra Ayarlar

Google Yazı Tipleri – kullanıyorsanız etkinleştir Google Yazı Tipleri harici kaynaklardan (Google Yazı Tipi kitaplığı) alındıklarında yükleme sürelerini yavaşlatır. Yazı tiplerinin yüklenmesini görmeden görünme olmadan yükleme sürelerini iyileştirdiğinden (bu zaman uyumsuz olarak yüklenirken genellikle olan şeydir. Ayrıca son Google Yazı Tipi seçeneğini “test edin ve yazı tiplerini eşzamansız olarak webfont.js”Ve hangisinin GTmetrix’te daha iyi sonuçlar verdiğini görün.

Emojileri Kaldır – etkinleştir (emojiler yükleme süreleri için kötü).

Statik Kaynaklardan Sorgu Dizelerini Kaldır – sorgu dizeleri genellikle eklentiler tarafından oluşturulur ve düzeltilemez (GTmetrix / Pingdom’da) bunu etkinleştirmek yeterlidir, ancak deneyebilirsiniz. Daha iyi bir çözüm, sitenizi yüksek CPU eklentileri açısından kontrol etmek ve hafif eklentilerle değiştirmek. Çoğu yüksek CPU eklentisi sosyal paylaşım, galeri, sayfa oluşturucuları, ilgili yayın, istatistik ve canlı sohbet eklentilerini içerir. Ayrıca tüm gereksiz eklentileri silmeli ve veritabanını temizlemelisiniz ( WP-Optimize) kaldırılan eklentiler tarafından bırakılan tabloları temizlemek için.

3. Taraf Etki Alanlarına Önceden Bağlanma – tarayıcıların harici kaynaklardan (Google Yazı Tipleri, Analytics, Haritalar, Etiket Yöneticisi, Amazon mağazası vb.) Gelen istekleri tahmin etmesine yardımcı olur. Bunlar genellikle GTmetrix raporunuzda “DNS aramalarını azalt” olarak görünür, ancak aşağıda yaygın örnekler verilmiştir.

  • 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

Önceden Yüklenen Belirli İstekler – önyükleme ve tarayıcı kaynak ipuçları ancak bu belirli dosyaları yüksek öncelikli olarak indirmenizi sağlar..

Async Javascript-Dosyaları – bu, ekranın üst kısmındaki içeriğin hızlı bir şekilde yüklenmesini engellediği anlamına gelir. Bu eğitici oluşturma engelleme JavaScripts iyi açıklıyor, ancak GTmetrix ve Pingdom’da JavaScript hataları görüyorsanız, Async JavaScipt eklentisi hile yapabilir.

YouTube Videolarını Optimize Edin – sitenizde video varsa, WP YouTube Lyte tembel bunları yükler, böylece kullanıcılar aşağı kaydırıp oynat düğmesini tıkladığında yüklenir, böylece YouTube’un sunucularına yapılan ilk istekler ortadan kaldırılır. Bu, bir sayfadaki en ağır öğelerden biri olduğu için videolarla içerikteki yükleme sürelerinden birkaç saniye uzakta kalabilir. WP Rocket ve Swift Performance, ayarlarında yerleşik olarak bulunur, bu nedenle bunlardan birini önbellek eklentiniz olarak kullanırsanız buna ihtiyacınız yoktur..

7. Daha İyileştir

Sitenizi daha da optimize etmek istiyorsanız, önerilen araçlar şunlardır:

WP Roketi – Birden çok Facebook anketinde 1 numaralı önbellek eklentisine oy verdi ve Autoptimize (veritabanı temizleme, kalp atışı kontrolü, Google Analytics’i yerel olarak barındırma, YouTube iframe’i bir önizleme görüntüsü ile değiştirme, Facebook Pikseline Tarayıcı Önbelleği ekleme, vb.) Dahil olmayan birçok seçeneğe sahip. WP Rocket ayrıca Autoptimize’in yaptığı hemen hemen her şeyi işler, böylece tüm bu hız optimizasyonları için sadece 1 eklentiye ihtiyacınız vardır. Bu yüzden harika. Burada% 10 indirim de alabilirsiniz.

ShortPixel – popüler görüntü optimizasyonu eklentisi ve kullandığım eklenti.

StackPath – 30’dan fazla veri merkezine sahip CDN. Kurulması çok kolay; sadece bir plana kaydolun (10 $ / ay) sonra CDN URL’nizi kopyalayın / CDN URL’sini Otomatik Olarak Optimize Et seçeneğine yapıştırın.

SiteGround – genellikle Facebook anketlerinde 1 numaraya ev sahipliği yaptı ve ayrıca Yoast tarafından kullanılan.

Yoast-on-Heyecan-Biz-just-anahtarlamalı-to-SiteGround

2019 Hosting Anketi

2017-WordPress-Hosting-FB-Anket

Elementor Hosting Önerileri

Temmuz 2019 Hosting Önerisi

WordPress-Host-Anket-Ağustos-2018

Paylaşılan-Hosting-Anket-2017

2019-Barındırma-Anket

Go-To-Barındırma-Şirket

WordPress-Hosting-Anket-2017

Yönetilen-Barındırma-Anket

WooCommerce-Hosting-FB-Anket

2016-Web Hosting-Anket

Best-WordPress-Hosting-Sağlayıcı-Anket

Best-Web Hosting-2019-Anket

WP Dostu Hosting Anketi

2016-WordPress-Hosting-FB-Anket

Elementor İçin Favori Hosting

2018 Hosting Önerileri

Yönetilen-WordPress-Hosting-Anket-2017

2019-Sunucular-Anket-1

Barındırma-Anket-For-Hız

WordPress-Hosting-Anket-Haziran-1

SiteGround-Öneri

2014-Yönetilen-WordPress-Hosting-FB-Anket

Best-Web Hosting-Sağlayıcı-Anket

Barındırma-Anket-Şubat-2019

Barındırma-Öneriler-Anket

Bluehost vs SiteGround

WordPress Web Ana Bilgisayar Anketi

İnsanlar genellikle göç ederler çünkü hız teknolojisi daha hızlı EIG veya GoDaddy:

SiteGround'a Geçme

SiteGround Yükleme Süresi Geçişi

Bluehost to SiteGround GTmetrix

HostGator'dan SiteGround'a

SiteGround Google PageSpeed ​​Insights

SiteGround'da 100 Mükemmel Puan

SiteGround Genesis

SiteGround Tarafından Sağlanan Hız

SiteGround ile Azaltılmış Yükleme Süreleri

Yeni SiteGround Yanıt Süreleri

HostGator'dan SiteGround'a Geçiş

Joomla'da SiteGround Yanıt Süreleri

SiteGround Barındırma'ya Geçildi

SiteGround Rocket Imagify Combo

SiteGround PageSpeed ​​Insights

Joomla'da SiteGround

SiteGround Azaltılmış Yükleme Süreleri

SiteGround Hızlı Hosting

Yeni SiteGround Yanıt Süresi

SiteGround Yanıt Süresi İyileştirmesi

SiteGround ayrıca ücretsiz göçler GrowBig ile+.

Cloudways – SiteGround’dan daha hızlı (bulut barındırma, paylaşılmayan) ve Facebook anketlerinde de yüksek puan aldı. Aylık $ 10 / ay’dan başlayarak DigitalOcean planı. 1 adet ücretsiz geçiş sunuyorlar (bunları aldım) ve sunucu yanıt süreme ne oldu:

SiteGround-vs-Cloudways-Bulut-Barındırma

Hosting Önerileri Facebook

VPS Bulut Hosting WooCommerce Anket

VPS Bulut Hosting Anketi

WordPress Hosting Önerileri

Cloudways Yanıt Süreleri

WP Motoru - Cloudways

Başlıksız

Cloudways Pingdom Yükleme Zamanları

Cloudways-Facebook-İnceleme

Promosyon koduyla ilk 2 aylık Cloudways hesabınızdan% 25 indirim alabilirsiniz OMM25.

Kinsta – 30 $ / ay premium barındırma ve bunları denememiş olsam da, Kinsta’nın hızı, desteği, çalışma süreleri ve barındırma hizmetleri hakkında neredeyse her şey.

Perfmatters – Eklentileri seçici olarak devre dışı bırakmak, yayın düzeltmelerini sınırlamak, otomatik kaydetmeyi devre dışı bırakmak, Google Analytics’i yerel olarak barındırmak ve çok daha fazlası gibi “çeşitli optimizasyonlar” olarak adlandırdığım şeylerle ilgilenen Kinsta eklentisi. Hızın son% 10’unu halleder.

Bunlardan bazıları Autoptimize tarafından önerilir, diğerleri önerilmez:

Eklentileri Otomatik Olarak Optimize Et

8. Bulut Parlaması

Autoptimize’ın ekleyecek ayarları yok Cloudflare ’CDN’si, ancak bu kurulumu kolaydır. Ve kesinlikle yapmalısınız çünkü bu 200 daha fazla merkez içerik dağıtım ağınıza (CDN) ekleyin.

Cloudflare Veri Merkezleri

Aşama 1. Cloudflare’a kaydolun, sitenizi eklemeniz ve taramaya başlamanız istenir..

cloudflare başlayacak tarama

Adım 2. Tarama tamamlandığında, ücretsiz planı seçin, ardından Cloudflare sizi bir dizi sayfaya götürecektir. Sonunda Cloudflare’nin size atadığı bir sayfaya yönlendirileceksiniz 2 ad sunucularının.

Cloudflare-Ad-Sunucular-Pano

Aşama 3. Alan adı kayıt sitenize (ör. Namecheap) giriş yapın ve “Namecheap üzerindeki ad sunucularını nasıl değiştireceğinizi” (yalnızca alan adı kayıt cihazınızı arayın) için Google’da arama yapın, ardından talimatlarını uygulayın. Cloudflare tarafından sağlanan 2 ad sunucusunu kopyalayacak ve alan adı kayıt sitenizdeki özel ad sunucuları seçeneğine yapıştıracaksınız. Yayılma için 72 saat bekleyin.

Godaddy Cloudflare isim sunucuları

Bu kadar!

Sıradaki ne?

Videomu İzle – 42 dakikalık bir video, ancak hemen hemen her şeyi (video açıklamasındaki zaman damgaları) ele alıyorum ve WordPress site hızı hakkında bir sürü harika bilgi öğrenmelisiniz:

GTmetrix’te Nasıl% 100 Puan Aldığımı Öğrenmek İstiyorum?
PHP 7’ye yükseltme, ölçekli görüntüler sunma, görüntü boyutlarını belirleme, veritabanı temizleme, Google Analytics’i yerel olarak barındırma, WP Devre Dışı Bırakma ve diğerleri dahil olmak üzere GTmetrix / Pingdom öğelerini düzeltmek için 38’den fazla ipucu içeren tam WordPress hız optimizasyon kılavuzuma bakın.

Sıkça Sorulan Sorular

&# X1f680; Autoptimize dışında başka hız eklentilerine ihtiyacım var mı?

Evet, genellikle önbellekleme, görüntü optimizasyonu, veritabanı temizleme, kalp atışı kontrolü ve eklentileri seçici olarak devre dışı bırakmak için bir eklenti kullanmak istersiniz. WP Rocket, ShortPixel ve Perfmatters’ı tavsiye ederim..

&# X1f680; Autoptimize ile bir CDN nasıl kurulur?

CDN’nizi seçin (StackPath kullanıyorum), CDN URL’nizi kopyalayın ve Autoptimize’in CDN UR alanına yapıştırın.

&# X1f680; Autoptimize ile Google Yazı Tiplerini nasıl optimize edersiniz??

Kafanda Birleştir ve Bağla seçeneğini kullanmanızı ve Yazı Tiplerinizi Autoptimize kullanarak önceden bağlamanızı öneririm.

&# X1f680; Autoptimize önbellekle ilgileniyor mu??

Hayır, önbellekleme için ayrı bir eklenti kullanmanız gerekecek. SiteGround kullanıyorsanız WP Rocket veya SG Optimizer’ı öneririm.

&# X1f680; Otomatik Optimizasyon ayarlarını nasıl yapılandırırsınız?

Her şey bu eğiticide listelenmiştir – GTmetrix raporunuza ve hangi öğelerin düzeltilmesi gerektiğine dikkat edin. Autoptimize içindeki ayarları yapılandırmak sorunu çözmezse, öğeleri düzeltmek için başka bir eklenti kullanmayı düşünün.

Sorular? Bana yaz!
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