Socialite.js ile Lazy Load Social Buttons
Bugün Angie's List web ekibiyle harika bir gün geçirdim. Angie's List, sitelerini inanılmaz bir kaynak kitaplığına dönüştürüyor… ve bu süre boyunca sitelerini hızlandırmaya devam ediyor. Sayfaları kör edici bir hızda yükleniyor. Bana inanmıyorsanız, bu sayfayı açın Garaj Kapıları.
Sayfada görüntüler, videolar ve sosyal düğmeler bulunur… ve yine de milisaniyeler içinde yüklenir. Sitelerini benimkiyle karşılaştırmak, bir Prius'u F-16 ile yarışmaya benziyor. Henüz bitmedi, her zaman müşteri deneyimini iyileştirmenin ve içeriğin bulunup paylaşılmasını sağlamanın yollarını arıyorlar.
Tam zamanlı bir geliştirme ekibimiz veya halka açık bir şirketin kaynakları yok, bu nedenle ilerlememiz Angie's List'ten biraz daha yavaş. İnanılmaz bir ev sahibimiz var. volan - gelişmiş önbelleğe alma ve CDN kullanarak, ancak yine de bize zarar veren bazı şeyler olduğunu biliyoruz. Örneğin, görsellerimiz optimize edilmemiştir. Netliklerini korurken resimlerinizi boyutlarının bir kısmına dönüştürebileceğiniz hizmetler var… biz onlara bakıyoruz.
Onlara sitemizi gösterirken, bir sosyal düğme yüklendikten sonra sayfa donarken korktum ve başımı astım. Facebook olduğunu düşünüyorum. Argh… bir veya iki saniye sonra düğme belirdi ve sayfanın geri kalanı yüklendi. Ugh.
Sorunu anlattığımda, mühendislerinin hemen bir çözümü vardı. sosyetik.js. Socialite, dilediğiniz zaman çok sayıda sosyal paylaşım düğmesini uygulamak ve etkinleştirmek için çok kolay bir yol sağlar. Belge yüklemede, makale üzerine gelindiğinde, herhangi bir olayda! Socialite, düğmeleri eşzamansız olarak yüklediğinden, 50 kb sosyal medyayı beklerken belge kilitlenmez.
Neyse ki, Socialite'ı içeren bir WordPress eklentisi zaten var. WPSosyalit. Bu gece düğmeleri yüklemek için tüm özelleştirilmiş kodumu çıkardım ve WPSocialite'ı uyguladım. CSS'yi özelleştirebildim ve istediğim düğmeleri değiştirebildim. Gelecekte buffer veya Reddit gibi bazı ek düğmelerin eklenmesini dört gözle bekliyorum ... ama bu şimdilik mükemmel!