Teknoloji Pazarlama, Bloglarınızdan ve Gadget'larınızdan Para Kazanın

Pingdom Hız Testi Aracı – Nasıl Geliştirilir?

Pingdom Hız Testi Aracı – Nasıl Geliştirilir?

Hızlı yüklenen web siteleri, yavaş olanlara kıyasla her zaman daha fazla trafik kazanır, bu da sıralamayı ve performansı etkiler. Bu yazımda sitenizdeki performans sorunlarını anlamanıza yardımcı olabilecek Pingdom Hız Testi aracından bahsedeceğim. Amaç seni o noktaya getirmek siteniz ne kadar hızlı Ve nasıl daha hızlı hale getirebilirsiniz.

Kullanıcılar sıklıkla Pingdom Hız Testi aracı verilerini web sitelerinin hızlarını kötüleştirecek kadar yanlış yorumluyorlar. Unutmayın, tüm araçları her zaman rehberli kullanım olarak kullanın çünkü bunlar %100 doğru değildir.

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ükleme 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? Muhtemelen web sitesi hızını ve sayfa performansını izlemek için en kolay araçtır. Tüm kullanıcılar performans uzmanı olamaz, bu nedenle ortalama 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 o kadar da önemli değil; sadece Pingdom sitesine gitmeniz, URL'si ve şunu seçin konum ziyaretçilerinizin konumuna göre. Daha sonra üzerine tıklayın 'Testi Başlat' düğme.

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

  • 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 – São Paulo

Peki hangi Pingdom web sitesi hız testi konumu test için en iyi seçimdir? Sitenizin ziyaretçilerine bağlıdır. Ziyaretçilerinize yakın olan konumu seçtiğinizden emin olun. Sitenizin kitlesi şurada bulunuyorsa Avrupao zaman seçim yapabileceğiniz 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ıyla Şelale Analizini Anlamak

Bir web sayfası genellikle aşağıdakilerin birleşiminden oluşur: HTML, CSS, JavaScript, Ve medya dosyalarıve bunların her biri sunucuda oluşturulacak 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 çok sayıda bölüm vardır. Pingdom Hız Testi aracı bölümleri şunlardır:

  • Pingdom Özeti
  • Sayfa Performansını Artırın
  • Yanıt Kodları
  • İçerik boyutu ve içerik türüne göre istekler
  • İçerik boyutu ve alana göre istekler
  • Şelale Haritası

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

Pingdom Özeti

Bir WordPress web sitesini Pingdom aracılığıyla çalıştırdığınızda, aşağıdakilere dayalı bir sonuç üretir: performans notu, sayfa boyutu, yükleme süresiVe istekler.

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

Okumak:  WordPress sitenizi kendi başınıza nasıl taşıyabilirsiniz?

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

Sayfa Performansını Artırın

Sayfa Performansını İyileştir bölümü, sayfa performansınızı iyileştirmeye yönelik önerilerle birlikte toplam 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) İçerik Dağıtım Ağı (CDN) kullanın

WordPress web sitenizde kullanacağınız en önemli şey bir CDN (İçerik Dağıtım Ağı). CDN, İnternet içeriğinin hızlı dağıtımını sağlayan, coğrafi olarak dağıtılmış bir sunucu grubunu ifade eder. Bunlar dünyanın her yerinde bulunan sunuculardan oluşan bir 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.

DreamHost kullanıcısıysanız DreamHostCDN'den yararlanabilirsiniz. Tüm DreamHost barındırma planlarında, birkaç tıklamayla etkinleştirilebilen yerleşik DreamHostCDN bulunur. Daha fazlasını öğrenmek için DreamHost'teki 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. Sayfanın içindeki silinmiş bir görsele manuel olarak bağlantı eklemeniz gibi bozuk bir bağlantı, 404 hatasıyla sonuçlanır.

Artık mevcut olmayan varlıklar için herhangi bir talep oluşturulmayacağından her zaman emin olun.

3) Yönlendirmeleri En Aza İndirin

Pingdom Hız Testi aracının en yaygın önerisi 'yönlendirmeleri en aza indirmektir'. Sitenizdeki bir sayfa başka bir sayfanın yüklenmesine neden olduğunda yönlendirme meydana gelir. Yönlendirdiğinizde bunlar gerçekleşebilir HTTP ile HTTPS, www ile www olmayanve güncellenen yayının URL'si değişti.

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

  1. Birden fazla yönlendirmeye neden olabileceğinden, üzerinde zaten yönlendirme bulunan 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 bunun www olup olmadığını kontrol edin.

Yönlendirmeler hakkında daha fazla bilgi edinmek istiyorsanız WP 301 Yönlendirmeleri hakkındaki DreamHost makalesine göz atın.

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

Peki tarayıcı hangi dosyayı kaydedeceğini, sunucudan hangi dosyayı yükleyeceğini ve bunları ne kadar süreyle tutacağını nasıl biliyor? Expires Headers'ın devreye girdiği yer burasıdır. Bunlar, web tarayıcılarına web sayfası kaynaklarını bir ziyaretçinin tarayıcı önbelleğinden mi yoksa sunucunuzdan mı yükleyeceğini söyleyen kurallardır.

Şimdi asıl nasıl yapılır kısmına geçelim. Size iki farklı yöntem kullanarak Sona Erme Başlıklarını nasıl ekleyeceğinizi göstereceğim.

Bir Eklenti Kullanarak Süresi Dolan Başlıkları Ekleme

Bir yükleme yapın W3 Toplam Önbellek eklentisi. Kurulduktan ve etkinleştirildikten sonra şu adrese gidin: WordPress Kontrol Paneli > Performans > Tarayıcı Önbelleğiardından etkinleştirin 'Sona erme başlığını ayarla' seçeneğini seçin 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 Eklentisinin Nasıl Kullanılacağı hakkındaki DreamHost makalesine bakın.

Bir Kod Kullanarak Süresi Dolan Başlıkları Ekleme

Kodu kullanarak Sona Erme Başlıklarını da 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, tuşuna basın. Ctrl + Üst Karakter + I e gitmek (belki siteyi bir kez yenilemeniz gerekebilir), üstteki alan adına tıklayın ve başlık bölümüne gidin. Orada sunucu adınızı bulacaksınız.

Okumak:  WordPress Web Sitenizde Ekibinizin Profilini Nasıl Oluşturabilirsiniz?

Bir Apache sunucusuna Sona Erme Başlıkları eklemek için, herhangi bir FTP sunucusunu (Filezilla) ve .htaccess dosyanızın üst kısmında verilen kodu kullanarak .htaccess dosyanıza erişin.

## HEADER CACHING'İN SONA ERMESİ ## ExpiresActive On ExpiresByType image/jpg “erişim 1 yıl” ExpiresByType image/jpeg “erişim 1 yıl” ExpiresByType image/gif “erişim 1 yıl” ExpiresByType image/png “erişim 1 yıl ” ExpiresByType image/svg “erişim 1 yıl” ExpiresByType text/css “erişim 1 ay” ExpiresByType uygulaması/pdf “erişim 1 ay” ExpiresByType uygulaması/javascript “erişim 1 ay” ExpiresByType uygulaması/x-javascript “erişim 1 ay” ExpiresByType uygulaması /x-shockwave-flash “erişim 1 ay” ExpiresByType image/x-icon “erişim 1 yıl” ExpiresDefault “erişim 3 gün” ## HEADER CACHING'İN SÜRESİ ##

DreamHost'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 Header'ları ekleyebilirsiniz. Daha fazla bilgi için, Sayfa Yükleme Süresini Optimize Etmek için WordPress'te Tarayıcı Önbelleğe Almadan Yararlanma adlı DreamHost makalesine göz atın.

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

Web sitesini her yüklediğinizde, içeriği kullanıcının ekranına iletmek için bir HTTP isteği de dahil olmak üzere bir dizi teknik olay gerçekleşir. Peki HTTP isteği nedir? Kullanıcı deneyimini nasıl etkiler? Web sitenizin HTTP isteklerini azaltmak için ne yapabilirsiniz?

Birisi web sitenizdeki bir sayfayı ziyaret ettiğinde, o kişinin internet tarayıcısı size bir istek gönderir Web sunucusu. Sunucunuz, sitenizde görüntülemeye çalıştıkları web sayfasını barındırır. Her bir dosya için bir web tarayıcısının bir ayrı HTTP isteğiyani web sitenizde ne kadar çok dosya varsa, daha fazla HTTP isteği tarayıcınızdan oluşturulacaktır. Daha fazla HTTP isteği web sitenizin kullanıcı deneyimini etkileyebilir.

İşte bazı geniş stratejiler: Daha Az HTTP İsteği Yapın:

  • Sitenize değer katmayan gereksiz eklentileri kaldırarak HTTP isteklerini ortadan kaldırın, çünkü eklentiler genellikle kendi CSS ve JavaScript'lerini yüklerler.
  • Birden fazla CSS dosyasını tek bir CSS dosyasında birleştirerek HTTP isteklerini birleştirin. Tarayıcının daha az istekte bulunması 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 (görsellerinizi optimize etmek için ShortPixel ve WP Compress kullanabilirsiniz).
  • Resimler ve videolar için yavaş yüklemeyi kullanın.

Daha iyi performans için WordPress sitenizi hızlandırmak amacıyla 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 barındırma hizmetleri GZIP sıkıştırmasını destekler. GZIP sıkıştırması dosya boyutlarını %70'e kadar azaltabilir.

DreamHost yüklü olarak gelir Breeze EklentisiBöylece Breeze WordPress önbellek eklentisini yükleyip etkinleştirerek GZIP sıkıştırmasını kolayca elde edebilirsiniz.

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

W3 Total Cache, ücretsiz sürümü olan bir önbellek eklentisidir. Eklentiyi kurup etkinleştirmeniz yeterlidir; GZIP sıkıştırması web sitenizde otomatik olarak etkinleştirilecektir. Git Performans > Genel Ayarlarve etkinleştirin 'Tarayıcı ön belleği'. Tıkla 'Tüm değişiklikleri kaydet' Değişiklikleri yaptıktan sonra düğmesine basın.

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

Değer kümesi olmayan (tırnak işaretleri arasında bilgi bulunmayan) HTML niteliklerine, 'boş' Öznitellikler. Boş öznitelik kaynak (src) Ve bağlantı (href) Tekdüzen Kaynak Tanımlayıcısı (URI) değeri olmasa bile bağlanacak tarayıcıyı vurgulayın.

İşte bazı örnekler Kaynak (kaynak) Ve Bağlantı (href) boş etiketler HTML' Ve JavaScript:

HTML:

JavaScript:

var img = yeni Resim(); img.src = “”;

Web sitenizde boş HTML ve JavaScript etiketi olmadığından emin olun. Varsa bunları silin ve tüm bağlantılarınızın bakımını uygun şekilde yapın. İkincisi, boş etiket sorunu resimlerle ilgilidir, bu nedenle yüklerken ve kullanırken daima resim bağlantılarını kontrol edin.

Okumak:  Kaba Kuvvet Saldırıları Nedir ve Bunları Nasıl Önleyebilirsiniz?

8) JavaScript’i En Altta Yerleştirin

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

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

function wpb_adding_scripts() wp_register_script('şaşırtıcı-script'im', get_template_directory_uri() . '/js/amazing-script'im.js','','1.1', true); wp_enqueue_script('harika-komut dosyam'); add_action('wp_enqueue_scripts', 'wpb_adding_scripts');

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

Yı kur $in_footer Komut dosyasını bir WordPress sayfasının alt bilgisine veya altına eklemek için parametreyi 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 size anlatır. Yaygın olanlardan bazıları şunlardır:

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

200 ila 300 saniye aralığındaki Yanıt Kodu genellikle iyidir, ancak 400 ila 500 arasındaki yanıt kodları genellikle düzeltmeniz gereken hatalar olarak adlandırılır.

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

Bu, web sayfanızın kaynaklarını görmenize yardımcı olur. Tablolar içeriklerinizin dağılımına 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ğinizde, performansı daha iyi hale getirmek için içeriğin o kısmı üzerinde çalışabilirsiniz.

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

İçerik boyutu ve etki alanına göre istekler bölümü, dahili Ve harici medyan boyutlarıyla hizmetler. Bu bölümde alan adı tarafından oluşturulan istekler görüntülenir. Her harici hizmetin kendi gecikme süresi olması nedeniyle daha az harici istekte bulunulması önerilir.

Genel olarak, istek sayısını en aza indirmek ve varlıkları web sunucunuza veya CDN'nize taşımak gibi tek bir yerde barındırmak en iyisidir. Örnek olarak FontAwesome veya BootStrap düşünülebilir. FontAwesome veya BootStrap betiğini harici olarak bağlıyorsanız onu indirin ve doğrudan sunun.

Şelale Haritası

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ümde ayrıntılı bir renk kodlu şelale grafiği bulunmaktadır.

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ı, derinlemesine açıklamalar ve önerilerle web sitesi performansını keşfetmek için daha iyi çalışıyor. Ayrıca Google sayfa deneyimi güncellemesindeki DreamHost web seminerine göz atın.

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