Sejarah dan warisan JQuery

jQuery adalah perpustakaan JavaScript paling populer di dunia. Komunitas pengembangan web menciptakannya di akhir tahun 2000-an, yang menyebabkan munculnya ekosistem yang kaya situs, plugin, dan kerangka kerja yang menggunakan jQuery di bawah tenda.

Namun dalam beberapa tahun terakhir, statusnya sebagai alat utama untuk pengembangan web telah terguncang. Mari kita lihat mengapa jQuery telah menjadi populer dan mengapa ia keluar dari mode, serta dalam hal apa masih disarankan untuk menggunakannya untuk membuat situs modern.

Sejarah singkat jQuery

John Resig menciptakan versi pertama perpustakaan pada 2005, dan menerbitkannya pada 2006 di sebuah acara bernama BarCampNYC. Di situs web jQuery resmi, penulis menulis:

jQuery adalah perpustakaan Javascript berdasarkan moto: Pemrograman dalam Javascript harus bagus. jQuery sering melakukan, tugas berulang, mengekstrak semua markup yang tidak perlu, dan membuatnya pendek, elegan, dan mudah dimengerti.

JQuery memiliki dua keunggulan utama. Yang pertama adalah API yang nyaman untuk memanipulasi halaman web. Secara khusus, ini menyediakan metode yang kuat untuk memilih item. Anda dapat memilih tidak hanya dengan ID atau kelas, jQuery memungkinkan Anda untuk menulis ekspresi kompleks, misalnya, untuk memilih elemen berdasarkan hubungannya dengan elemen lain:

// Select every item within the list of people within the contacts element $('#contacts ul.people li'); 

Seiring waktu, mesin seleksi telah berkembang menjadi perpustakaan Sizzle yang terpisah.

Keuntungan kedua dari perpustakaan adalah ia mengabstraksi perbedaan antara browser. Pada tahun-tahun itu, sulit untuk menulis kode yang dapat bekerja dengan andal di semua browser.

Kurangnya standardisasi berarti bahwa pengembang perlu mempertimbangkan banyak perbedaan antara browser dan kasus batas. Lihatlah kode sumber jQuery awal ini dan cari jQuery.browser. Ini salah satu contohnya:

 // If Mozilla is used if ( jQuery.browser == "mozilla" || jQuery.browser == "opera" ) { // Use the handy event callback jQuery.event.add( document, "DOMContentLoaded", jQuery.ready ); // If IE is used, use the excellent hack by Matthias Miller // http://www.outofhanwell.com/blog/index.php?title=the_window_onload_problem_revisited } else if ( jQuery.browser == "msie" ) { // Only works if you document.write() it document.write("<scr" + "ipt id=__ie_init defer=true " + "src=javascript:void(0)><\/script>"); // Use the defer script hack var script = document.getElementById("__ie_init"); script.onreadystatechange = function() { if ( this.readyState == "complete" ) jQuery.ready(); }; // Clear from memory script = null; // If Safari is used } else if ( jQuery.browser == "safari" ) { // Continually check to see if the document.readyState is valid jQuery.safariTimer = setInterval(function(){ // loaded and complete are both valid states if ( document.readyState == "loaded" || document.readyState == "complete" ) { // If either one are found, remove the timer clearInterval( jQuery.safariTimer ); jQuery.safariTimer = null; // and execute any waiting functions jQuery.ready(); } }, 10); } 

Dan berkat jQuery, pengembang dapat mengalihkan perhatian semua perangkap ini ke pundak tim pengembangan perpustakaan.

JQuery kemudian memfasilitasi penerapan teknologi yang lebih canggih seperti animasi dan Ajax. Perpustakaan sebenarnya telah berubah menjadi ketergantungan situs web standar. Dan hari ini menyediakan karya bagian besar dari Internet. W3Techs memperkirakan bahwa 74% situs saat ini menggunakan jQuery .

Kontrol atas pengembangan jQuery juga menjadi lebih formal. Pada 2011, tim menciptakan Dewan jQuery . Dan pada 2012, Dewan jQuery berubah menjadi Yayasan jQuery .

Pada 2015, jQuery Foundation bergabung dengan Dojo Foundation untuk membuat JS Foundation , yang kemudian bekerja sama dengan Node.js Foundation pada 2019 untuk membuat OpenJS Foundation , di mana jQuery adalah salah satu “ proyek yang menonjol ”.

Mengubah keadaan

Namun, dalam beberapa tahun terakhir jQuery semakin populer . GitHub menghapus perpustakaan dari frontend situsnya . Bootstrap v5 akan menghilangkan jQuery karena ini adalah " ketergantungan klien terbesar untuk JavaScript reguler " (saat ini 30 Kb, diperkecil, dan dikemas). Beberapa tren dalam pengembangan web telah melemahkan posisi jQuery sebagai alat yang diperlukan.

Browser

Karena sejumlah alasan, perbedaan dan batasan browser menjadi kurang penting. Pertama, standardisasi telah meningkat. Pengembang browser utama (Apple, Google, Microsoft, dan Mozilla) bersama-sama mengembangkan standar web sebagai bagian dari Kelompok Kerja Teknologi Aplikasi Web Hypertext .
Meskipun browser masih berbeda satu sama lain dalam sejumlah aspek penting, vendor setidaknya memiliki sarana untuk mencari dan membuat pangkalan bersama daripada perang permanen satu sama lain. Dengan demikian, API peramban telah memperoleh fitur baru. Misalnya, Fetch API dapat menggantikan fungsi Ajax dari jQuery:

 // jQuery $.getJSON('https://api.com/songs.json') .done(function (songs) { console.log(songs); }) // native fetch('https://api.com/songs.json') .then(function (response) { return response.json(); }) .then(function (songs) { console.log(songs); }); 

QuerySelector dan querySelectorAll methods menggandakan pemilih dari jQuery:

 // jQuery const fooDivs = $('.foo div'); // native const fooDivs = document.querySelectorAll('.foo div'); 

Anda sekarang dapat memanipulasi kelas elemen dengan classList :

 // jQuery $('#warning').toggleClass('visible'); // native document.querySelector('#warning').classList.toggle('visible'); 

Situs web You Might Not Need jQuery mencantumkan beberapa situasi di mana Anda dapat mengganti kode jQuery dengan kode asli. Beberapa pengembang selalu mematuhi jQuery, karena mereka tidak tahu tentang API baru, tetapi ketika mereka mengetahuinya, mereka mulai jarang menggunakan perpustakaan ini.

Menggunakan fitur asli dapat meningkatkan kinerja halaman. Banyak efek animasi jQuery sekarang dapat diimplementasikan jauh lebih efisien dengan CSS.

Alasan kedua adalah karena pembaruan browser jauh lebih cepat daripada sebelumnya. Sebagian besar dari mereka memiliki strategi pembaruan "hijau" , dengan pengecualian Apple Safari. Mereka dapat diperbarui di latar belakang tanpa keterlibatan pengguna dan tidak terikat dengan pembaruan OS.

Ini berarti bahwa fitur browser baru dan perbaikan bug menyebar lebih cepat, dan pengembang tidak perlu menunggu sampai bagian Can I Use mencapai tingkat yang dapat diterima. Mereka dengan percaya diri dapat menggunakan fitur dan API baru tanpa memuat jQuery atau polyfile.

Alasan ketiga adalah bahwa Internet Explorer mendekati keadaan yang sama sekali tidak relevan. IE telah lama menjadi momok pengembangan web di seluruh dunia. Bugnya yang umum tersebar luas, dan karena IE mendominasi pada tahun 2000-an dan tidak menggunakan strategi pembaruan "hijau", versi lamanya masih umum.

Pada tahun 2016, Microsoft mempercepat dekomisioning IE dengan menghentikan dukungan untuk versi kesepuluh dan sebelumnya, membatasi diri untuk mendukung IE 11. Dan semakin banyak, pengembang web dapat membayar kemewahan mengabaikan kompatibilitas IE.

Bahkan jQuery telah berhenti mendukung IE 8 dan lebih rendah sejak versi 2.0 , dirilis pada 2013. Dan meskipun dalam beberapa kasus dukungan untuk IE masih diperlukan, misalnya, di situs yang lebih tua, bagaimanapun, situasi ini semakin sedikit.

Kerangka kerja baru

Sejak munculnya jQuery, banyak kerangka kerja telah dibuat, termasuk para pemimpin React , Angular, dan Vue modern . Mereka memiliki dua keunggulan penting dibandingkan jQuery.

Pertama, mereka memudahkan untuk membagi antarmuka pengguna menjadi komponen. Kerangka kerja ini dirancang untuk menangani rendering dan penyegaran halaman. Dan jQuery biasanya hanya digunakan untuk memperbarui, mempercayakan server dengan tugas menyediakan halaman awal.

Di sisi lain, komponen Bereaksi, Bersudut, dan Vue memungkinkan Anda menautkan erat HTML, kode, dan bahkan CSS. Saat kami membagi basis kode menjadi banyak fungsi dan kelas mandiri, kemampuan untuk membagi antarmuka menjadi komponen yang dapat digunakan kembali menyederhanakan perakitan dan pemeliharaan situs yang kompleks.

Keuntungan kedua adalah bahwa kerangka kerja yang lebih baru mematuhi paradigma deklaratif, di mana pengembang menggambarkan seperti apa antarmuka itu, dan mempercayakan kerangka kerja dengan penerapan semua perubahan yang diperlukan untuk mencapai yang diinginkan. Pendekatan ini bertentangan dengan karakteristik pendekatan imperatif dari kode jQuery.

Di jQuery, Anda secara eksplisit meresepkan langkah-langkah untuk melakukan perubahan apa pun. Dan dalam kerangka deklaratif Anda mengatakan: "Menurut data ini, antarmuka akan terlihat seperti ini." Ini dapat sangat memudahkan penulisan kode tanpa bug.

Para pengembang telah mengadopsi pendekatan baru untuk pengembangan situs web, itulah sebabnya popularitas jQuery telah menurun.

Kapan menggunakan jQuery?

Jadi kapan jQuery harus digunakan?

Jika kompleksitas proyek akan tumbuh, lebih baik mulai dengan pustaka atau kerangka kerja lain yang memungkinkan Anda mengelola kompleksitas dengan bermakna. Misalnya, untuk membagi antarmuka menjadi beberapa komponen. Menggunakan jQuery di situs-situs tersebut pada awalnya mungkin terlihat dapat diterima, tetapi itu akan dengan cepat mengarah ke kode spaghetti ketika Anda tidak yakin fragmen mana yang mempengaruhi bagian halaman mana.

Saya telah berada dalam situasi seperti itu, ketika saya mencoba melakukan perubahan, saya mendapatkan perasaan sebagai tugas yang sulit. Anda tidak dapat memastikan bahwa Anda tidak akan memecahkan apa pun, karena pemilih jQuery bergantung pada struktur HTML yang dibuat oleh server.

Di ujung lain skala adalah situs sederhana yang hanya memerlukan sentuhan interaktivitas atau konten dinamis. Dalam kasus seperti itu, saya tidak akan menggunakan jQuery secara default, karena lebih banyak yang dapat dilakukan dengan API asli.

Bahkan jika saya membutuhkan sesuatu yang lebih kuat, saya akan mencari perpustakaan khusus, misalnya, aksioma untuk Ajax atau Animate.css untuk animasi. Ini akan lebih mudah daripada memuat semua jQuery untuk sedikit fungsionalitas.

Saya pikir alasan terbaik untuk menggunakan jQuery adalah menyediakan fungsionalitas komprehensif untuk situs front-end. Alih-alih mempelajari berbagai API asli atau perpustakaan khusus, Anda hanya dapat membaca dokumentasi jQuery dan Anda akan segera menjadi produktif.

Pendekatan imperatif tidak memiliki skala yang baik, tetapi lebih mudah dipelajari daripada pendekatan deklaratif perpustakaan lain. Untuk situs dengan kemampuan terbatas, lebih baik menggunakan jQuery dan bekerja dengan tenang: perpustakaan tidak memerlukan perakitan atau kompilasi yang kompleks.

Selain itu, jQuery bagus dalam kasus-kasus di mana Anda yakin bahwa situs tersebut tidak akan menjadi rumit seiring waktu, dan jika Anda tidak peduli dengan fungsionalitas asli, yang tentunya akan memerlukan penulisan lebih banyak kode daripada jQuery.

Anda juga dapat menggunakan pustaka ini jika Anda perlu mendukung versi IE yang lebih lama. Kemudian jQuery akan melayani Anda seperti di hari-hari ketika IE adalah browser paling populer.

Lihatlah ke masa depan

jQuery tidak akan segera hilang. Ini secara aktif berkembang , dan banyak pengembang lebih suka menggunakan API-nya, bahkan dengan ketersediaan metode asli. Perpustakaan membantu seluruh generasi pengembang membuat situs web yang berfungsi pada browser apa pun. Dan meskipun dalam banyak aspek telah digantikan oleh perpustakaan baru, kerangka kerja dan paradigma, jQuery telah memainkan peran positif yang sangat besar dalam menciptakan web modern.

Jika fungsionalitas jQuery tidak berubah secara signifikan, kemungkinan dalam beberapa tahun ke depan penggunaan perpustakaan akan terus menurun secara perlahan tapi pasti. Situs web baru biasanya dibuat sejak awal menggunakan kerangka kerja yang lebih modern, dan skenario penggunaan jQuery yang sesuai menjadi kurang umum.

Seseorang tidak menyukai intensitas keusangan untuk alat pengembangan web, tetapi bagi saya ini adalah bukti dari kemajuan yang cepat. jQuery telah memungkinkan kami melakukan jauh lebih baik. Hal yang sama berlaku untuk penggantinya.