Pingdom Hız Testi Aracı – Pingdom Puanları Nasıl İyileştirilir

Hızlı yüklenen web siteleri, yavaş olanlara kıyasla her zaman daha fazla trafik kazanır ve bu da sıralamayı ve performansı etkiler. Bu yazımda sitenizdeki herhangi bir performans sorununu anlamanıza yardımcı olabilecek Pingdom Hız Testi aracından bahsedeceğim. Amaç, sizi sitenizin ne kadar hızlı olduğu ve nasıl daha hızlı hale getirebileceğiniz noktasına getirmektir.

Kullanıcılar sıklıkla Pingdom Hız Testi aracı verilerini web sitesi hızlarını kötüleştirecek şekilde yanlış yorumlarlar. Unutmayın, %100 doğru olmadıkları için tüm araçları her zaman rehberli kullanım olarak kullanın.

Pingdom Hız Testi Aracı Nedir ve Neler Sunar?

Pingdom, web siteleriniz, uygulamalarınız ve sunucularınız için bir izleme çözümü olan popüler bir ücretsiz web hız testi aracıdır. Yalnızca çalışma süresini izlemekle kalmaz, aynı zamanda yük performansını da izler, böylece ziyaretçilerinizin sitenizi nasıl deneyimlediğini görebilirsiniz. Pingdom, çalışma süresi izleme, sayfa hızı izleme, işlem izleme, sunucu izleme ve ziyaretçi bilgileri (RUM) gibi hizmetler sunar.

Neden bu kadar popüler? Web sitesi hızını ve sayfa performansını izlemek için muhtemelen en kolay araçtır. Tüm kullanıcılar performans uzmanı olamaz, bu nedenle ortalama bir WordPress kullanıcısı için iyi bir seçimdir.

Pingdom'da nasıl test yapabileceğinizi görelim. Pingdom Hız Testi aracını kullanmak çok önemli değil - sadece Pingdom sitesine gitmeniz, URL'nizi girmeniz ve ziyaretçilerinizin konumuna göre konumu seçmeniz yeterli. Ardından 'Testi Başlat' düğmesine tıklayın.

Pingdom Hız Testi aracı, web sitenizi dünya çapında 7 farklı test konumunda (5 kıta) test etmenize olanak tanır:

• Asya – Japonya – Tokyo
• Avrupa – Almanya – Frankfurt
• Avrupa – Birleşik Krallık – Londra
• Kuzey Amerika – ABD – Washington DC
• Kuzey Amerika – ABD – San Francisco
• Pasifik – Avustralya – Sidney
• Güney Amerika – Brezilya – Sao Paulo

Peki, hangi Pingdom web sitesi hız testi konumu test için en iyisi olur? Sitenizin ziyaretçilerine bağlıdır. Ziyaretçilerinize yakın olan konumu seçtiğinizden emin olun. Sitenizin hedef kitlesi Avrupa'daysa , 2 seçeneğiniz vardır: (Avrupa – Almanya – Frankfurt) veya (Avrupa – Birleşik Krallık – Londra) . Sitenizin dünya çapında ziyaretçileri varsa, sitenizi farklı konumlarda test edin ve iyileştirme için uygun adımları atın.

Pingdom Hız Testi Aracı ile Şelale Analizini Anlama

Bir web sayfası genellikle HTML, CSS, JavaScript ve medya dosyalarının bir birleşimidir ve bunların her biri sunucuda işlemek için bir istek oluşturur. Sitenin yavaş hızının nedeni daha fazla istek olabilir. Pingdom Hız Testi aracında, puanlamayı ve iyileştirme önerilerini gösteren birden çok bölüm vardır. Pingdom Hız Testi aracı bölümleri şunlardır:

• Pingdom Özeti
• Sayfa Performansını İyileştirin
• Yanıt Kodları
• İçerik türüne göre içerik boyutu ve istekler
• Etki alanına göre içerik boyutu ve istekler
• Şelale Tablosu

Bu bölümde sizlere şelale analizini nasıl yapabileceğinizi anlatacağım ve her Pingdom bölümünü parçalara ayırıp daha detaylı anlatacağım.

Pingdom Özeti

Pingdom üzerinden bir WordPress web sitesi çalıştırdığınızda, performans derecesi, sayfa boyutu, yükleme süresi ve isteklere dayalı bir sonuç üretir .

Sitenizi birden çok kez test ettiğinizde, diğer sonuçların (performans derecesi, sayfa boyutu ve istekler) aynı kaldığını, sitenizin yükleme süresinin her testte değiştiğini fark edeceksiniz. Bu yükleme süresi farkının nedeni DNS önbelleği, CDN önbelleği, WordPress önbelleği ve harici API'lerdir.

İyileştirilmiş bir Pingdom puanı, web uygulamanıza ve sunucu yapılandırmanıza bağlıdır. Özellikle bir e-ticaret sitesi işletiyorsanız, her zaman yüzde 100 puan almak mümkün olmayabilir, ancak her zaman iyileştirme için yer vardır.

Sayfa Performansını İyileştirin

Sayfa Performansını Geliştirme bölümü, sayfa performansınızı iyileştirmeye yönelik önerilerle birlikte toplu performans notlarını içerir. Bu öneriler her web sitesi için geçerli olmasa da, iyileştirme şansını artırır.

Gelin bu önerilere bir göz atalım.

1) Bir İçerik Dağıtım Ağı (CDN) kullanın

WordPress web sitenizde kullanılacak en önemli şey bir CDN'dir (İçerik Dağıtım Ağı). CDN, İnternet içeriğinin hızlı teslimatını sağlayan coğrafi olarak dağıtılmış bir sunucu grubunu ifade eder. Bunlar, dünya çapında bulunan bir sunucu ağıdır. CDN, web içeriğini kullanıcıların bulunduğu yere yaklaştırarak hızlı bir şekilde aktarılmasına olanak tanır.

Cloudways kullanıcısıysanız CloudwaysCDN'den yararlanabilirsiniz. Tüm Cloudways barındırma planlarında, birkaç tıklamayla etkinleştirilebilen yerleşik CloudwaysCDN bulunur. Daha fazla bilgi için Cloudways'deki WordPress CDN bloguna göz atın.

Bazı üçüncü taraf CDN sağlayıcılarına bir göz atalım:

1. AnahtarCDN
2. CloudFlare CDN'si
3. Amazon CloudFront
4. CDN77

Burada, yaygın olarak kullanılan üç popüler CDN sağlayıcısının WordPress CDN karşılaştırmasını görebilirsiniz.

2) HTTP 404 (Bulunamadı) hatasından kaçının

İstek başarıyla tamamlanamadığında, Pingdom Hız Testi aracı önerisinde HTTP'den Kaçının (404) hatası görünüyor. Sayfa içinde silinen bir resme manuel olarak bir bağlantı eklediğinizde olduğu gibi bozuk bir bağlantı, 404 hatasıyla sonuçlanır.

Artık var olmayan varlıklar için hiçbir talebin oluşturulmayacağından daima emin olun.

3) Yönlendirmeleri En Aza İndirin

Pingdom Hız Testi aracının en yaygın önerisi 'yönlendirmeleri en aza indir'dir. Sitenizdeki bir sayfa başka bir sayfanın yüklenmesine neden olduğunda yönlendirme gerçekleşir. Eğer sigara www HTTPS www HTTP yönlendirmesi zaman bu durum oluşabilir ve güncellenmiş yazının URL değişti.

Sitenizi çok fazla yönlendirmeden korumak için yapabileceğiniz birkaç şey:

1. Birden çok yönlendirmeye neden olabileceğinden, üzerinde zaten yönlendirme olan bir sayfaya asla bağlantı vermeyin.
2. Gereksiz yönlendirmelere neden olabilecek devre dışı bırakılmış/kullanılmayan eklentileri sildiğinizden emin olun.
3. Sitenizde bağlantılar oluştururken, uygun HTTP veya HTTPS önekini kullanın ve www olup olmadığını kontrol edin.

Yönlendirmeler hakkında daha fazla bilgi edinmek istiyorsanız, WP 301 Yönlendirmeleri hakkındaki Cloudways makalesine bakın.

4) Sona Eren Başlıkları Ekle

Tüm WordPress web sitesi dosyaları, ilk kez gelen bir ziyaretçi için tek tek yüklenir. Web tarayıcınız ve sunucunuz arasında oluşturulan istekler, web sitesi yükleme süresini artırır. Tarayıcı önbelleği, web sitesi dosyalarını ziyaretçinin bilgisayarına kaydeder, böylece web sitesini tekrar ziyaret ettiklerinde web sitesi sunucu yerine tarayıcı önbelleğinden yüklenir ve bu da web sitesini hızlandırır.

Ancak tarayıcı hangi dosyayı kaydedeceğini ve sunucudan hangi dosyayı yükleyeceğini ve bunları ne kadar süreyle tutacağını nasıl biliyor? İşte burada Expires Headers devreye girer. Bunlar, web tarayıcılarına web sayfası kaynaklarını bir ziyaretçinin tarayıcı önbelleğinden mi yoksa sunucunuzdan mı yükleyeceklerini söyleyen kurallardır.

Şimdi asıl nasıl yapılır kısmına geçelim. Size Expires Headers'ı iki farklı yöntemle nasıl ekleyeceğinizi göstereceğim.

Bir Eklenti Kullanarak Sona Eren Başlıkları Ekleme

Bir W3 Toplam Önbellek eklentisi yükleyin. Kurulduktan ve etkinleştirildikten sonra, WordPress Kontrol Paneli > Performans > Tarayıcı Önbelleği'ne gidin , ardından 'Süre sonu başlığını ayarla' seçeneğini etkinleştirin ve değişiklikleri kaydedin.

W3 Total Cache eklentisi hakkında daha fazla bilgi edinmek istiyorsanız, Daha Hızlı Web Siteleri için WordPress W3 Total Cache Plugin Nasıl Kullanılır başlıklı Cloudways makalesine bakın.

Bir Kod Kullanarak Sona Eren Başlıkları Ekleme

Ayrıca kodu kullanarak Expires Headers ekleyebilirsiniz. Bunun için web sitenizin Apache mi yoksa Nginx sunucuları mı kullandığını öğrenin. Bunu yapmak için web sitenizi tarayıcıda çalıştırın, sitenin ağına gitmek için Ctrl + Shift + I tuşlarına basın (belki siteyi bir kez yenilemeniz gerekir), en üstteki alan adına tıklayın ve başlığa gidin Bölüm. Orada sunucu adınızı bulacaksınız.

Bir Apache sunucusuna Expires Headers eklemek için, herhangi bir FTP sunucusunu (Filezilla) ve .htaccess dosyanızın en üstünde verilen kodu kullanarak .htaccess dosyanıza erişin.

 ## BAŞLIK ÖN BELLEKLEMESİNİN SÜRESİ ##
<IfModule mod_expires.c>
Sona EriyorAktif Açık
ExpiresByType resim/jpg "1 yıllık erişim"
ExpiresByType resmi/jpeg "1 yıllık erişim"
ExpiresByType resmi/gif "1 yıllık erişim"
ExpiresByType resmi/png "1 yıllık erişim"
ExpiresByType resmi/svg "1 yıllık erişim"
ExpiresByType metin/css "1 aylık erişim"
ExpiresByType uygulaması/pdf "1 aylık erişim"
ExpiresByType uygulaması/javascript "1 aylık erişim"
ExpiresByType application/x-javascript "1 aylık erişim"
ExpiresByType uygulaması/x-shockwave-flash "1 aylık erişim"
ExpiresByType görüntüsü/x-icon "1 yıllık erişim"
ExpiresDefault "3 gün erişim"
</IfModule>
## BAŞLIK ÖN BELLEKLEMESİNİN SÜRESİ ##

Cloudways'de Nginx düzeyinde herhangi bir değişiklik yapamazsınız, ancak Apache kurallarını kullanabilir ve uygulamalarınızın .htaccess dosyasına Expires Headers ekleyebilirsiniz. Daha fazla bilgi için, Sayfa Yükleme Süresini Optimize Etmek için WordPress'te Tarayıcı Önbelleğe Almadan Yararlanma başlıklı Cloudways makalesine bakın.

5) Daha Az HTTP İsteği Yapın

Web sitesini her yüklediğinizde, bir HTTP isteği de dahil olmak üzere içeriği kullanıcının ekranına iletmek için bir sürü teknik şey olur. Peki HTTP isteği nedir? Kullanıcı deneyimini nasıl etkiler? Ve web sitenizin HTTP isteklerini azaltmak için ne yapabilirsiniz?

Birisi web sitenizdeki bir sayfayı ziyaret ettiğinde, o kişinin web tarayıcısı web sunucunuza bir istek gönderir . Sunucunuz, görüntülemeye çalıştığı web sayfasını sitenizde barındırır. Her bir dosya için, bir web tarayıcısının ayrı bir HTTP isteği yapması gerekir, bu nedenle web sitenizde ne kadar çok dosya varsa, tarayıcınızdan o kadar fazla HTTP isteği oluşturulur. Daha fazla HTTP isteği, web sitenizin kullanıcı deneyimini etkileyebilir.

Daha Az HTTP İsteği Yapmak için bazı geniş stratejiler şunlardır:

• Eklentiler genellikle kendi CSS ve JavaScript'lerini yüklediğinden, sitenize değer katmayan gereksiz eklentileri kaldırarak HTTP isteklerini kaldırın.
• Birden çok CSS dosyasını tek bir CSS dosyasında birleştirerek HTTP isteklerini birleştirin. Tarayıcının daha az istek yapması gerektiğinden web sitesi daha hızlı yüklenir.
• Daha iyi stratejilerden biri, ağır eklentiyi daha hafif olanlarla değiştirmektir.
• Görseller sitenizi daha çekici hale getirip sitenize değer katsa da gereksiz görselleri kaldırın ve her zaman optimize edilmiş görselleri kullanın (resimlerinizi optimize etmek için ShortPixel ve WP Compress kullanabilirsiniz).
• Görüntüler ve videolar için tembel yükleme kullanın.

Daha iyi performans için WordPress sitenizi hızlandırmak için bu noktaları kullanın.

6) Bileşenleri GZIP ile Sıkıştırın

GZIP sıkıştırması, veri dosyalarını sıkıştırarak dosya indirme süresini azaltan bir teknolojidir. Tüm modern tarayıcılar, sıkıştırılmış veriler tarayıcı tarafından alındığında sıkıştırılmış dosyaları otomatik olarak açar. Tüm modern tarayıcılar, sunucu yazılımları ve en iyi WordPress sunucularının tümü GZIP sıkıştırmasını destekler. GZIP sıkıştırması, dosya boyutlarını %70'e kadar azaltabilir.

Cloudways, yüklü bir Breeze Eklentisi ile birlikte gelir, böylece yalnızca Breeze WordPress önbellek eklentisini yükleyip etkinleştirerek GZIP sıkıştırması elde edebilirsiniz.

GZIP Sıkıştırması için önerilen eklentiler şunlardır:

• WP Roketli GZIP
• WP Süper Önbellekli GZIP
• W3 Toplam Önbellekli GZIP

W3 Total Cache, ücretsiz sürümü olan bir önbelleğe alma eklentisidir. Eklentiyi kurmanız ve etkinleştirmeniz yeterlidir; GZIP sıkıştırması web sitenizde otomatik olarak etkinleştirilecektir. Performans > Genel Ayarlar'a gidin ve 'Tarayıcı Önbelleği'ni etkinleştirin. Değişiklikleri yaptıktan sonra 'Tüm değişiklikleri kaydet' düğmesini tıklayın.

7) Boş Kaynak veya Href'ten Kaçının

Değer kümesi olmayan (tırnak işaretleri arasında bilgi olmayan) HTML niteliklerine 'boş' nitelikler denir. Kaynak (src) ve bağlantının (href) boş özniteliği, Tekdüzen Kaynak Tanımlayıcı (URI) değeri olmasa bile tarayıcının bağlanmasını vurgular.

HTML ve JavaScript'te Source (src) ve Link (href) boş etiketlerinden bazı örnekler:

HTML:

 <img kaynağı=””>
<a href=””>

JavaScript:

 var img = new Image();
img.src = "";

Web sitenizde boş HTML ve JavaScript etiketleri olmadığından emin olun. Varsa, bunları silin ve tüm bağlantılarınızı uygun şekilde koruyun. İkinci olarak, boş etiket sorunu resimlerle ilgilidir, bu nedenle yüklerken ve kullanırken her zaman resim bağlantılarını kontrol edin.

8) JavaScript'i En Altına Yerleştirin

Bu, JavaScript'ten önce diğer sayfa içeriğini yüklediğiniz anlamına gelir, böylece internet bağlantısı yavaş olan bir kullanıcının JavaScript'in yüklenmesini beklemesi gerekmez. JavaScript en üste yerleştirildiğinde, önce yüklenmeye başlar ve sayfa içeriğinin geri kalanını yavaşlatarak kullanıcı deneyimini etkiler.

JavaScript dosyanızı .js uzantısıyla (my-amazing-script.js) kaydedin ve bu JS dosyasını tema dizininize yerleştirin (JavaScripts için bir dizin oluşturabilirsiniz, yani public_html/wp-content/themes/your-theme/assets /js). JavaScript dosyanızı yerleştirdikten sonra, temanızın functions.php dosyasını düzenleyin ve şu kodu ekleyin:

 function wpb_adding_scripts() {
wp_register_script('my-harika-script', get_template_directory_uri() .'/js/my-amazing-script.js','','1.1', true);
wp_enqueue_script('şaşırtıcı senaryom');
}
add_action('wp_enqueue_scripts', 'wpb_adding_scripts');

Kullanılan wp_register_script() işlevi ve şunları içerir:

 <?php
wp_register_script( $handle, $src, $deps, $ver, $in_footer);
?>

Komut dosyasını bir WordPress sayfasının altbilgisine veya altına eklemek için $in_footer parametresini true olarak ayarlayın.

Yanıt Kodları

Pingdom hız testi aracındaki bir sonraki bölüm, HTTP durum kodları olarak da adlandırılan Yanıt Kodlarıdır. Bu bölüm, sayfaya yüklediğiniz tüm kaynaklarda neler olduğunu anlatır. Bazı yaygın olanlar şunlardır:

• 200 – Her şey yolunda
  301 – İstenen kaynak kalıcı olarak taşındı
  404 – İstenen kaynak bulunamadı

200s ile 300s aralığındaki Yanıtlar Kodu genellikle iyidir, ancak 400 ile 500 arasında olanlar genellikle düzeltmeniz gereken hatalar olarak adlandırılır.

İçerik Türüne Göre İçerik Boyutu ve İstekler

Bu, web sayfanızın kaynaklarını görmenize yardımcı olur. Tablolar, içeriğinizin dağılımı ve isteklerinize ilişkin bilgilerdir.

İçerik türüne göre içerik boyutu, içerik türüne göre gruplandırılmış tüm web sitesi varlıklarınızın bir listesini sağlar. Bu bilgi, hataları ayıklamanıza yardımcı olabilir. İçerik türüne göre içerik boyutunun beklenenden fazla olduğunu fark ettiğiniz her yerde, performansı daha iyi hale getirmek için içeriğin o kısmı üzerinde çalışabilirsiniz.

Alan Adına Göre İçerik Boyutu ve İstekler

İçerik boyutu ve etki alanına göre istekler bölümü, iç ve dış hizmetleri medyan boyutlarıyla görmenizi sağlar. Bu bölüm, etki alanı tarafından oluşturulan istekleri görüntüler. Her bir harici hizmet kendi gecikme süresini sunduğundan, daha az harici istek yapılması önerilir.

Genel olarak, isteklerin sayısını en aza indirmek ve varlıkları web sunucunuza veya CDN'ye taşımak gibi tek bir yerde barındırmak en iyisidir. FontAwesome veya BootStrap örnek olarak kabul edilebilir. FontAwesome veya BootStrap komut dosyasını harici olarak bağlıyorsanız, indirin ve doğrudan sunun.

Şelale Tablosu

Son olarak, şelale grafiği oluşturan Pingdom hız testi aracı istekleri bölümümüz var. Performans sorunlarını görmek için her isteği analiz edebilirsiniz. Bu bölüm, ayrıntılı bir renk kodlu şelale grafiğine sahiptir.

Pingdom'un şelale analizi, sitenizdeki her bir HTTP isteğini gösterir ve geliştiriciler tarafından site yüklemesini görsel olarak anlamak ve darboğazları belirlemek için kullanılır. Bağlantı boyutlarına odaklanın – uzun bağlantı ve uzun çubuklar sitenin hızlı yüklenmesini engeller.

Özet

Web sitesi hız testi araçları söz konusu olduğunda, piyasada birçok araç bulunmaktadır. Gördüğünüz gibi, Pingdom Hız Testi aracı, web sitesi performansını derinlemesine açıklamalar ve önerilerle keşfetmek için daha iyi çalışıyor.

Ürün hakkında detaylı bilgi verdim. Şimdi web sitenizin performansını artırmak için bu aracı kullanma sırası sizde.