Utility kütüphanelerine son! JavaScript neyinize yetmiyor?
Lodash ve Underscore, JavaScript yazarken utility kütüphaneleri olarak yıllardır bize yardımcı olmaktadır. Uzun bir süredir Frontend geliştiricileri tarafından yaygın olarak kullanılıyor.
Buraya kadar bir sorun yok. İhtiyacımız olan sorunları çok güzel çözüyorlar.
Ancak, günümüz standartlarını düşünerek hareket ettiğimizde, ECMAScript2015 [ES6] sayesinde zaten bu utility kütüphanelerinin sunduğu özellikleri, ek bir kütüphane kullanmadan JavaScript yazarak çözebiliyoruz.
Bir zamanlar benim de yaptığım gibi, yıllardır süregelen alışkanlığınızı bozmak istemeyebilirsiniz. Zira ben de işlerimi hızlı bir şekilde çözebildiğim Lodash’i bazı eski projelerde hala kullanıyorum.
Lodash boyut olarak bakıldığında, aslında büyük bir ağırlık oluşturmuyor.
Ama performans arttırmak ve dependency azaltmak gibi faydalar olduğu düşünüldüğünde, bu kütüphaneleri bırakmanın doğru bir karar olduğunu göreceksiniz. Aşağıda yaptığımız benchmark testleride bunu gösteriyor.
Projemizin daha az dependency barındırmasını istiyorsak ve bu kütüphaneleri kullanarak yaptığınız işlemlerin daha hızlı çalışmasını istiyorsak, Lodash / Underscore’a ihtiyacımız olmayabilir.
Bu yazıda Lodash rakibi Underscore’a göre daha fazla kullanıldığı için Underscore ile herhangi bir karşılaştırma ve örnek olmayacaktır.
Performans
İyi bir kullanıcı deneyimi sağlamak, geliştirdiğimiz her uygulamada büyük bir önem taşıyor.
Bunu sağlamanın bilinen en ucuz yöntemi ise performanslı bir uygulama geliştirmek.
İlk aşamada sıklıkla kullandığımız metodların tam olarak ne işe yaradıklarını hızlıca öğrendikten sonra, native ve lodash performans sonuçlarını göreceğiz. Ardından lodash’de bulunan metodların JavaScript’te ki karşılıklarını anlatacağım.
Yapacağım karşılaştırmalardaki farklar, son kullanıcı üzerinde gözle görülür bir şey ifade etmeyebilir. Ama uygulamalarınız büyümeye başladığı zaman, bu tarz optimizasyonlar yapmaya ihtiyacınız olacak.
Ben yazıda yapacağım karşılaştırmalar için, measurethat kullanmaya karar verdim. İçerisinde yer alan diğer testlere de bakmanızda fayda var.
_.find vs find()
JavaScript’te find metodu callback olarak çalışıp, doğru bir değer döndürene kadar her bir index için callback fonksiyonunu çalıştırıyor. Eğer callback fonksiyonu çalıştığında eleman bulunursa elemanın değeri döndürülüyor. Eğer olumsuz sonuçlanırsa undefined dönüyor. Lodash’de ise karşılık olarak _.find() kullanılıyor
Test Sonucu:
🏆 Native kodumuz oyunu kazanıyor.
İlgili test: https://www.measurethat.net/Benchmarks/Show/3174/0/find-benchmark-test
Döküman:
Array.prototype.find()
_.find()
Bu metod ES2015 spesifikasyonunda standart durumdadır.
_.merge vs Object.assign()
Object.assign(), bir ya da daha fazla kaynaktaki nesneleri kopyalamak için sıklıkla kullandığımız basit bir metod. Lodash tarafında iki nesneyi kopyalayıp bir şeyler oluşturmak için ise, benzer olarak _.merge kullanabiliriz.
Test Sonucu:
🏆 Native kodumuz yine oyunu kazanıyor.
İlgili test: https://www.measurethat.net/Benchmarks/Show/3177/0/merge-vs-objectassign
Döküman:
Object.assign()
_.merge
Bu metod ES2015 spesifikasyonunda standart durumdadır.
_.includes vs includes()
includes() metodu bir dizinin herhangi bir elemanı içerip içermediğini kontrol eden yardımcı bir metoddur. Boolen olarak değer döndürmektedir.
🏆 Native kodumuz yine oyunu kazanıyor.
İlgili test: https://www.measurethat.net/Benchmarks/Show/3182/0/includes-vs-includes
Döküman:
Array.prototype.includes
_.includes
Bu metod ES2015 spesifikasyonunda standart durumdadır.
_.every vs every()
every() metodu bir dizideki elemanların, belirlenen bir koşulu karşılayıp karşılamadığını sorgular.
🏆 Native kodumuz yine oyunu kazanıyor.
İlgili test: https://www.measurethat.net/Benchmarks/Show/3087/0/lodash-every-vs-native-every
Döküman:
Array.prototype.every()
_.every
