Svg icon boyutlandırma hatası
Merhaba arkadaşlar
Sitem açılırken sağ üstte bulunan svg ikon yüzünden CLS kayması oluyor. Icon önce büyük olarak yükleniyor sonra küçülüyor. Bunun önüne geçmek için ne yapabilirim?
Site: https://www.celebimutfak.com
https://i.ibb.co/7gqT14D/2022-05-18-1.png
Soru hatalı mı? 👎
Eğer sorunun kurallara aykırı olduğunu düşünüyorsanız lütfen bize bildirin!
Cevaplar (4)
sorun ana dökümanın geç yüklenmesi. yani sayfanın kendisinin, dahil edilenler değil. menüye uygulanan javascript komutları mevcut olabilir ve bu komutlar sayfanın yüklenmesinin tamamlanmasını beklemekte olabilir. ayrıca herhangi bir css dosyasından gelmiyor menünün stil kodları, litespeed-ccss id'sine sahip bir style tagı içerisinde ana dökümanda oluşturulmuş. senin uygulayabileceğin en iyi yöntem şuan için, sayfaya yüklenene kadar siteyi göstermemek.
@munzevi hocam öncelikle dediğinizi yapacağım. Ayrıca css dosyalarını eklenti ile birleştirme(combine) yaptığım için öyle gözüküyor. Eklenti özelliklerinde istenilen css dosyalarını birleştirmeden hariç tutabiliyorum.
@munzevi öncelikle cevap için teşekkürler. Css ve Javascript dosyalarını sırayla yüklemek için bir yöntem var mıdır? Anasayfa öğelerinin bulunduğu css dosyalarını önce yüklersem belki bu durumun önüne geçebilirim.
herhangi bir sorun yok, döküman ilk kez yüklendiğinde ve süre uzadığında gelen svg path'den sonra gecikmeli olarak css'in gelmesi bu durumu yaşatıyor. daha performanslı bir sunucuya geçebilirsin veya performansı etkileyen unsurları tespit edip iyileştirmeler yapabilirsin. gördüğüm kadarıyla sorunun sebebi ne ise, sunucu ile alakalı. tüm dosyalar 1-5 ms aralığında yükleniyor, ancak ana döküman 900ms içerisinde sonuçlanıyor.
edit: body öğesini display olarak ayarlayıp javascript ile döküman tamamen yüklendiğinde body öğesini görünür yapabilirsin. bu durumda hiçbir şey sayfa yüklenene kadar gözükmez.