Ini Dia Alternatif JQuery Yang Jauh Lebih Ramping dan Ringan Dari ZeptoJS

VanillaJS adalah candaan agar developer tidak lagi menggunakan fasilitas yang memanjakan macam JQuery. Karena memang secara performa (berdasarkan uji coba/survey dari berbagai vendor) JQuery jauh lebih lebih rendah performanya dalam memproses syntax-syntaxnya. Mengapa ini terjadi? Ya karena pada akhirnya syntax-syntax JQuery tersebut dalam proses backgroundnya di konversikan dulu ke dalam kemungkinan-kemungkinan algoritma dalam js yang vanilla, yang pure, yang murni. Hal ini terbukti jika Anda membuka website vanillajs.com, ketika Anda mencoba mendownload librarynya, di dalamnya tidak terdapat apapun. Karena isi librarynya itu Anda yang bikin sendiri nantinya.

JS yang Vanilla atau yang original, atau apapun sebutannya adalah suatu pilihan ketika Anda menginginkan performa website jauh lebih baik, namun library JS semacam JQuery juga pilihan ketika Anda menginginkan proses development menjadi lebih cepat, juga pertimbangan lainnya. Ini berarti ada kondisi dimana Anda bisa memilih menggunakan js vanilla/original, dan ada kalanya menggunakan JQuery. Tentunya Anda yang lebih mengetahui mana yang harus digunakan.

Tapi memang, berdasarkan pengalaman pribadi, koding sendiri menggunakan js vanilla bisa lebih efisien, efisien dari segi performa hingga banyaknya baris koding yang harus dibuat. Jika menggunakan library dengan tugas yang sama, malah tidak efisien. Mengapa? Ibaratnya jika Anda ingin memasak nasi goreng dan hanya membutuhkan minyak goreng, beras, telur dan bumbu-bumbu, Anda beli saja di toko sembako, namun apabila Anda menggunakan library JS yang tersedia semacam JQuery, ini sama saja dengan membeli kebutuhan membuat nasi goreng di supermarket yang serba Ada, yang menjual aneka macam sofa, tempat tidur, pakaian, aksesoris seperti alat pencabut bulu ketiak, alat elektronik dll, yang juga menjual sembako.

Apa yang terjadi jika menggunakan library JS? Performa website jadi lebih rendah ketimbang membuat sendiri dengan js vanilla, karena untuk mengeksekusi sesuatu harus melewati berbagai proses dulu yang pada akhirnya baru mencapai tujuan, istilah keren dari Mas Iskandar Soesman (founder panada framework), tidak straight to the point.

Wah panjang sekali ya intronya. Tapi semoga bermanfaat, barangkali mungkin ada yang belum mengetahui hal ini. Begitulah. Ya, saya cukupkan sekian artikel kali ini. Lah??? Wahahahay...

Bicara mengenai JQuery, karena size yang terlalu besar untuk ukuran JS library, dan banyak fitur yang tidak terlalu diperlukan menjadikan beberapa vendor gatel untuk meminimalisir dan mengefisienkan jeroan dari JQuery, salah satunya adalah ZeptoJS yang berlisensi MIT. Yang mana sudah dikenal di kalangan web developer, ZeptoJS adalah alternatif dari JQuery yang mana ZeptoJS ukurannya jauh lebih kecil dari JQuery. Saat artikel ini ditulis ZeptoJS 1.2.0 memiliki ukuran hampir 4 kali lebih kecil dari jquery slim 3.4.1. Ukuran normal ZeptoJS adalah 58.7kb, dan JQuery Slim 3.4.1 berukuran 227kb, kondisi ketika di minified ZeptoJSb berukuran 26kb, sedangkan jquery yang sudah minified di versi yang sama berukuran 71kb.

Nah menariknya ada alternatif dari ZeptoJS yang ukurannya jauh lebih kecil, lebih ringan, dan memiliki banyak keunggulan dibanding dengan JS library yang telah hadir sebelumnya. Cash JS dan Bliss JS.

Sebelum membahas satu demi satu, perlu diketahui melihat live testing performace di measurethat.net. Yakni antara Vanilla vs Cash vs Umbrella vs Bliss vs Zepto vs jQuery, pemenangnya adalah Vanilla JS, kemudian yang ke dua adalah Bliss dan selanjutnya adalah Cash, kemudian ada Zepto yang disusul JQuery dan terakhir ada Umbrella JS.

Sehingga urutannya :

1. Vanilla
2. Bliss
3. Cash
4. Zepto
5. JQuery
6. Umbrella

Anda pun bisa membuktikannya dengan melakukan live speed test di sini https://www.measurethat.net/Benchmarks/Show/4349/20/vanilla-vs-cash-vs-umbrella-vs-bliss-vs-zepto-vs-jquery

Meskipun dalam artikelnya Foundation Zurb mencopot ZeptoJS dan menggantikannya dengan JQuery 2 karena alasan kecepatan sebagaimana dijelaskan dalam link berikut https://zurb.com/blog/why-we-dropped-zepto, tapi terbukti ZeptoJS lebih cepat daripada JQuery terbaru sekalipun. Tapi yang akan kita bahas bukan Zepto, melainkan dua alternatif JQuery yang lainnya.

CashJS

Saat artikel ini ditulis CashJS hanya berukuran 15kb saja versi minifiednya. Dalam github officialnya di cantumkan:

"Cash is an absurdly small jQuery alternative for modern browsers (IE11+) that provides jQuery-style syntax for manipulating the DOM. Utilizing modern browser features to minimize the codebase, developers can use the familiar chainable methods at a fraction of the file size. 100% feature parity with jQuery isn't a goal, but Cash comes helpfully close, covering most day to day use cases."

Yang intinya Cash itu jauh lebih kecil dari JQuery yang secara syntax mirip dengan JQuery, karena bukan tujuannya membuat Cash sangat persis dengan JQuery, namun yang menjadi goal adalah Cash mampu menangani pekerjaan sehari-hari, dan meminimalisir fitur-fitur yang tidak diperlukan dari JQuery. Untuk lebih detilnya Anda bisa mengecek githubnya di https://github.com/kenwheeler/cash/ Tersedia dokumentasi lengkap cara menggunakan CashJS mulai dari menggunakan CDN nya hingga ke daftar syntax yang bisa digunakan berikut juga cara penggunaannya.

BlissJS

Lebih gila dari Cash, saat artikel ini ditulis Bliss JS berukuran 12kb saja. Tidak seperti Cash yang di develop membuat syntax nya mirip-mirip dengan JQuery, Bliss malah terlihat seperti ingin menyingkat syntax js yang vanilla. Dalam website officialnya tercantum Bliss tidak memiliki niat untuk menggantikan Vanilla JS. Tapi membuat developer menulis syntax javascript jadi lebih mudah, lebih mengirit barisan kodenya. Lebih efisien dari segi penulisan, di yakini secepat js yang vanilla nya.

Untuk mencoba nya Anda bisa langsung menuju ke website officialnya https://blissfuljs.com/

Bliss termasuk javascript library yang apik dalam mendokumentasikan cara penggunaanya. Terbukti ada halaman dokumentasi sendiri yang fokus membahas cara menggunakan syntax-syntax yang disediakan oleh Bliss. Bagi Anda seorang designer atau developer, membuat performa website jadi lebih cepat adalah suatu keharusan, demi visitor / user lebih nyaman. Sehingga menggunakan javascript library yang seiring sejalan dengan visi misi tersebut seharusnya menjadi pilihan utama yang harus di ambil.

Cukup sekian, semoga bermanfaat. Selamat bereksperimen. 

Loka Dwiartara
Ilmuwebsite.com