Küçültme ile bir WordPress sitesinin performansı nasıl artırılır

Site hızı, hemen hemen tüm site sahipleri için kalıcı bir endişe olmaya devam ediyor. Sitenizin hızını artırmanın birkaç yolu olsa da, genellikle gözden kaçan (ancak oldukça etkili) bir teknik vardır: küçültme.

Basit bir ifadeyle, küçültme, sitenizin kodunu boyut olarak küçültmek ve daha verimli çalıştırmak için optimize eder. Bu küçük bir endişe gibi görünse de, aslında şaşırtıcı derecede etkilidir.

Bu yazıda, size küçültme kavramını ve nasıl çalıştığını tanıtacağım. Ayrıca, koda dokunmanıza gerek kalmadan bu yöntemi kendi başınıza kullanabileceğiniz birkaç yol göstereceğim. Başlayalım!

'Küçültme'ye giriş (ve size nasıl yardımcı olabileceği)

Bu blog, sitenizi hızlı tutmanın önemini daha önce birkaç kez tartıştı. Bu nedenle, muhtemelen site hızınızı optimize etmenin birkaç yolunun farkındasınızdır. Bugün başka bir yöntemden bahsedeceğim.

Görüyorsunuz, uzun yükleme sürelerinin arkasındaki olası nedenlerden biri verimsiz yazılmış koddur. Çoğu site sahibi günümüzde nadiren (eğer varsa) herhangi bir şeyi kodlamaya ihtiyaç duyar, bu nedenle kodunuzun sitenizin yavaşlamasına neden olup olmadığını bile anlayamayabilirsiniz. Ancak, küçültme olarak bilinen bir işlemi kullanarak bunu göz ardı edebilirsiniz.

Kodlayıcı değilseniz, bu korkutucu derecede karmaşık görünebilir, ancak endişelenmeyin. Küçültme, aslında CSS, HTML ve JavaScript kodunu optimize etmeyi içeren basit bir işlemdir. Bunu herhangi bir kodlama becerisine ihtiyaç duymadan nasıl başarabileceğinizi size daha sonra göstereceğim. Ancak bundan önce, aşağıdaki CSS pasajını kullanarak pratikte nasıl çalıştığını görelim:

h1 {
    background-color: blue;
}

h2 {
    background-color: red;
}

p {
    background-color: black;
}

CSS ile kısa bir aşinalık olsa bile, bunu çözmek oldukça kolaydır. Bir sayfadaki farklı öğelere hangi stilin atanması gerektiğini belirtir. Bunun nedeni, kodun insan gözünün okuyabileceği şekilde yazılmış olmasıdır. Bu amaçla, kodun her bir parçasının net bir şekilde tanımlanmasını ve taranmasını kolaylaştırmak için satır sonları ve fazladan boşluklar kullanılır.

Ancak, bu aslında bir bilgisayarın kodu anlaması ve çalıştırması gereken bir şey değildir. Aslında, ek karakterler kodu 'ağır' hale getirir ve bu nedenle bir bilgisayarın okuması ve yürütmesi daha uzun sürer. Bu nedenle küçültmeyi insan dostu kodu makine dostu koda dönüştüren süreç olarak düşünebilirsiniz.

Bu kodu küçültecek olsaydınız, bunun yerine şöyle görünürdü:

h1{background-color:blue}h2{background-color:red}p{background-color:black}

Bu kod aslında yukarıdakiyle tam olarak aynı işlevselliği içerir, ancak tüm gereksiz parçalar çıkarılmıştır. Büyük bir fark gibi görünmese de, küçültülmüş kod aslında orijinalinden %36 daha hafiftir. Aynı ilkenin sayfanızdaki tüm kodlara uygulandığını hayal ederseniz, bunun uzun vadede ne kadar etkili olabileceğini muhtemelen görebilirsiniz.

Peki, aslında bunu nasıl yapıyorsun? Emrinde birkaç yöntem var ve bu makale boyunca onlara bakacağım. İlk olarak, kodu manuel olarak nasıl küçültebileceğinizi görelim.

Kod manuel olarak nasıl küçültülür

Kodu küçültmenin bir yolu, onu kendiniz yapmaktır. Bu, özellikle bir tema veya eklenti oluştururken olduğu gibi kendi kodunuzu yazıyorsanız kullanışlıdır. Bununla birlikte, kodunuzu ince dişli bir tarakla gözden geçirmek, tutara bağlı olarak imkansız olmasa da zorlayıcı olabilir.

Neyse ki, saniyeler içinde küçültülmüş kod oluşturmanıza yardımcı olacak birçok araç var. Böyle bir örnek, hem CSS hem de JavaScript ile çalışan Minify'dır:

Basitçe sıkıştırmak istediğiniz kodu metin kutusuna yapıştırın, Küçült'e tıklayın ve kod anında yeni biçiminde döndürülecektir. Hatta yeni versiyonun orijinaline kıyasla ne kadar hafif olduğunun bir özetini bile göreceksiniz:

HTML kodunu küçültmeniz gerektiğinde, iş için HTML Minifier'ı öneririm:

Bu aracı özellikle beğendim çünkü kodun nasıl sıkıştırılacağına dair birçok seçenek sunuyor ve ayrıca Google tarafından onaylandı. Son çıktıyı beğeninize göre uyarlamak için sağdaki ayarları kullanabilirsiniz.

Kodu manuel olarak küçültmek kesinlikle yararlı olsa da, çoğu zaman işlemi otomatikleştirmek isteyeceksiniz. Sırada, tam olarak bunu nasıl yapabileceğinize bakacağım.

Ön uçtaki küçük ayrıntılar işleri gerçekten yavaşlatabilir… ve birlikte çalışan çok sayıda eklenti, tema ve teknoloji ile nereden başlayacağınızı bilmek zor olabilir. Performance Insights Eklentimiz, sitenizin yüksek ve düşük performans yönlerine derinlemesine bir bakış sağlar. Oradan, bir adım daha ileri götürüyoruz ve doğrudan uzman ekibimizden size önerilen eylemleri sunuyoruz, böylece sitenizin hızını tam olarak nerede ve nasıl artıracağınızı bilirsiniz! Daha fazlasını buradan öğrenin.

Kodu otomatik olarak küçültmenize yardımcı olacak 3 WordPress eklentisi

Küçültmeyi uygulamanın en kolay yolu, işi sizin yerinize yapacak bir WordPress eklentisi kullanmaktır. Böyle bir eklenti, çağrıldığı anda kodunuzu otomatik olarak küçültür.

Bu, kodunuzu kendiniz bakmak zorunda kalmadan küçültebileceğiniz anlamına gelir. Bunu akılda tutarak, en iyi küçültme eklentilerinden bazılarına göz atalım!

1. Otomatik Optimize Et

Küçültmenin karmaşık bir süreç olacağından endişeleniyorsanız, Autoptimize mükemmel bir karşı noktadır. Bu, sitenizin tüm komut dosyalarını sizin herhangi bir giriş yapmanıza gerek kalmadan otomatik olarak küçültecek bir 'kur ve unut' çözümüdür. Siz sadece eklentiyi kurun ve etkinleştirin, gerisini o halleder. Ancak, işin teknik yönüne girmek isterseniz, eklenti ayrıca birkaç gelişmiş yapılandırma seçeneği sunar.

Ana Özellikler

• Yapılandırma gerektirmeden kullanımı basit.
• Sitenizdeki tüm komut dosyalarını otomatik olarak küçültür ve sıkıştırır.
• Optimum performans için tüm stilleri site başlığına taşır.

Fiyatlandırma: Eklenti ücretsizdir ve Autoptimize ayrıca 119 € veya yaklaşık 138 $ 'dan başlayan premium bir katman sunar.

2. Hızlı Hız Küçült

Tüm bu eklentiler için çalışan bir tema basitliktir. Önceki teklifte olduğu gibi, Fast Velocity Minify kutudan çıktığı anda çalışır. Eklenti, kodlarınızı ve komut dosyalarınızı minimum sayıda dosyaya sıkıştırarak, CSS ve JavaScript'inizin mümkün olduğunca verimli bir şekilde teslim edilmesini sağlar. Ayrıca isteğe bağlı HTML küçültme de dahil olmak üzere bir dizi yapılandırma ayarı içerir.

Ana Özellikler

• HTTP isteklerinin sayısını azaltmak için komut dosyalarını küçültür.
• Varsayılan ayarlarla tak ve çalıştır işlevi sunar.
• Google Yazı Tiplerini birleştirir ve optimize eder.

Fiyatlandırma: Eklenti, premium plan gerektirmeden tamamen ücretsizdir.

3. Birleştir + Küçült + Yenile

Birleştir + Küçült + Yenile, kutunun dışında çalışmaya başlayan başka bir küçültme eklentisidir. Özellikleri büyük ölçüde Autoptimize'a benzese de, özellikle hafif bir alternatiftir. Küçültme işleminin çalışma şekli nedeniyle, eklenti minimum yavaşlama sağlar ve önbelleğinizi manuel olarak temizlemenizi gerektirmez (diğer çözümlerin aksine).

Ana Özellikler

• Komut dosyalarınızı otomatik olarak küçültür ve birleştirir.
• Küçültme sırasında yavaşlamayı en aza indirmek için wp-cron kullanır.
• WordPress Multisite kurulumlarıyla uyumludur.

Fiyatlandırma: Birleştirme + Küçült + Yenile, premium plan olmadan indirmek ve kullanmak ücretsizdir.

Çözüm

Sitenizi optimize etmeye gelince, emrinizde olan tüm yöntemleri kullanmak önemlidir. Bunlardan biri, işlevselliğini etkilemeden daha verimli hale getirmek için kodunuzu sıkıştırmanıza olanak tanıyan küçültmedir.

Bu makalede, önerdiğim eklentilerden biriyle kendi sitenizde küçültmeyi nasıl kullanabileceğinizi tartıştım:

1. Otomatik optimize et. Deneyimli kullanıcılar için ek ayarlarla güçlü ancak basit.
2. Hızlı Hız Küçült. Hem yeni başlayanlar hem de geliştiriciler için harika olan sağlam bir seçenek.
3. Birleştir + Küçült + Yenile. Her zaman iyi performans sağlamaya yardımcı olan hızlı ve güvenilir.

Sitenizi hızlandırmak için küçültmeyi kullanma hakkında sorularınız mı var? Aşağıdaki yorumlar bölümünde bana bildirin!

Ücretsiz kılavuzumuzla site performansınızı bir üst seviyeye taşıyın!

Bu ücretsiz kılavuz, WordPress sitenizin performansını ve hızını bugün artırmak için kullanabileceğiniz sekiz basit adıma sahiptir. Görüntüler, JavaScript ve CSS gibi web varlıklarını optimize etmekten kapsamlı bir eklenti denetimi gerçekleştirmeye kadar her en iyi WordPress performans uygulamasını kapsar.

Şimdi indir!