İpucu: Css ile site hızlandırma yöntemi

Kendi sitelerimde kullandığım yöntemi sizlerle de paylaşıyorum. https://purifycss.online/ sitesine önce anasayfa daha sonrada farklı tasarımı olan sayfalarınızın urlsini yapıştırıp tarayın. Bu site otomatik css dosyalarınızı tespit eder ve kullanılmayan tüm satırları temizleyip size sadece kullandığınız kodların çıktısını verir. İsteyenler ayrıca sıkıştırıp öyle çıktısını alabilirler. Örneğin 200kb css dosyanız var bu site hiç sıkıştırmadan bile 30-40kb lara kadar düşürür. Düşük boyutlu css dosyaları çok daha hızlı yüklendiğinden siteniz gözle görülür hızlanacaktır. Denediğim farklı sitelerde hiçbir sorun çıkmadı fakat yinede siz uygulamadan önce orjinal css dosyalarınızı yedekleyin. Herkese iyi çalışmalar.

Uygulama kısaca sizin sitenizin kullandığı kodları bırakıp diğerlerini siliyor. Mesela 1000 satır css kodunuz var bunu alıp size 200 satırlık bir kod veriyor ve bu kod sitenizin sorunsuz çalışması için yeterli oluyor. Hangi kodları sildiğini de ayrıca görebiliyorsunuz.

Chrome da coverage var ama tam bir. İşkenceydi. Deneyeceğim, çalışırsa harika ötesi.

Zaten başarılı bir arayüz geliştiricisi bunları da göz önünde bulundurarak çalışmayı yapar. SASS ve JS dosyalarını genelde GULP kullanarak compress edip birleştiririz. Gereksiz satırlar silinir, uzun değişkenler otomatik olarak kısaltılır. Birden fazla aynı deyimler silinir, birleştirilir gibi gibi. Ama mevcutta bu şekilde olmayan temalarınız için bu geçici bir çözüm olacaktır. Çünkü düzenlemeye kalktığınızda işkenceye dönüşür ne nerde bilemezsiniz...

Unused CSS olarak geçiyor hocam bu. Daha önce bir çok varyasyonunu denedim ama istikrarlı çalışmıyorlar haberiniz olsun dikkatli kontrol edin.

hocam burda verdiği sonuçlara göre değişiklik yapsak scriptte bozulma vs olma ihtimali nedir
teşekkürler bu arada

Ben değişiklik yapmadan önce css dosyalarının orjinallerini kopyaladım. aynı sunucuda sadece ismi değiştirmek yetiyor. sonra burdaki kırpılmış css leri indirip sunucuda aynı konuma yükledim. Sonuç tüm sitelerde başarılı. Bozulma olursa bunları sil eski dosyaları tekrar aktif et sorun olmaz.

birde eklenti yada temaya ekstra özellik ekleyince sorun olabiliyor onuda şöyle çözdüm. değişiklik yapmadan önce orjinal dosyaları aktif ediyorum, değişiklik yapıyorum, ardından tekrar aynı yöntemi uyguluyorum.

Bu işin en güzel yanı eklentisiz css dosyalarını % 90 lara kadar küçültmek

Ya sitem de fazlalık kod yok ya da sistem fazlalık kodu bulamıyor.

iyi birşeye benziyor.
teşekkürler

wp fasted cache eklentisi kullanıyorum, eklenti kendi içinde bir sıkıştırma işi yapıyor ama bu sıkıştırmalı halini taratınca

before: 266.38 KB
after: 51.10 KB
used: 19.18%
unused: 80.82%

bu şekilde değerler çıkıyor. Ama eklenti varken css sıkıştırma sonucunda nasıl aktif edeceğiz bunu ?