We’re finally finished removing jQuery from https://t.co/r2QL2aHBfa frontend. What did we replace it with? No framework whatsoever:
— Mislav Marohnić (@mislav) 2018年7月25日
• querySelectorAll,
• fetch for ajax,
• delegated-events for event handling,
• polyfills for standard DOM stuff,
• CustomElements on the rise.
有返咁上下資歷嘅人都應該會知道jQuery呢套Javascript framework。想當年，JS入門級嘅你掌握咗jQuery就幾乎等於掌握咗front end嘅世界；即使有返一定JS資歷嘅人都因為jQuery帶黎嘅方便而樂於使用佢。而今日，隨住GitHub已經棄用jQuery，雖然未去到話步入歷史，但係影響力應該逐漸衰退。
曾經你要用操控DOM嘅形式去控制你嘅網頁元素。
<div id="app"></div>
<script>
$(document).ready(function() {
$('#app').html('<p>This is an inline text in the #app element.</p>');
});
</script>
<script>
$(document).ready(function() {
$('#app').html('<p>This is an inline text in the #app element.</p>');
});
</script>
以當時瀏覽器對Javascript以至ECMAScript仲未有一個好統一嘅標準黎講，jQuery嘅API能夠做到跨平台支援已經方便咗唔少開發者。另外，好多需要用CSS或者Vanilla Javascript寫一大堆嘢去行嘅動態畫面都可以透過簡單嘅API去達成。jQuery UI就有一個叫animate()嘅API去做到唔錯嘅動畫效果。
不過講咁多，當初最吸引我去用jQuery嘅原因就係佢嗰個簡單嘅Ajax API。我只要諗我要傳啲乜嘢去server side，點樣去處理回傳返黎嘅資料就已經搞掂好多嘢。喺崇尚load less嘅網頁世界黎講，jQuery對於我黎講簡直係上咗神枱。
$(document).ready(function() {
$.ajax({
dataType: 'json',
data: {
userId: 1,
name: 'John Doe'
},
url: 'example.com/user',
method: 'patch',
success: function() {
// Your code...
},
statusCode: {
404: function() {
alert('Endpoint not found!');
}
}
});
});
$.ajax({
dataType: 'json',
data: {
userId: 1,
name: 'John Doe'
},
url: 'example.com/user',
method: 'patch',
success: function() {
// Your code...
},
statusCode: {
404: function() {
alert('Endpoint not found!');
}
}
});
});
但係喺網頁開發嘅世界，程式開發永遠都係一步緊跟住一步咁去。Javascript開始慢慢完善返以前所帶落黎嘅問題：逐步標準化嘅functions或者methods、效能加強、安全問題等。如果你去做下一啲JS嘅benchmark，你會發現Vanilla JS一啲都唔輸蝕。
document.querySelector('.class') vs $('.class')。
另外就係jQuery嘅本質問題。因為佢本身係DOM-driven嘅Javascript framework，如果你嘅DOM結構喺往後嘅更新唔同咗，你就有可能令到成段程式死咗。呢樣嘢發生喺我早幾日幫公司做嘅嘢度：因為見到個class name有typo，我就想幫佢改返個名以方便理解佢係乜黎，結果反而搞到JS嗰邊唔識郁......因為佢哋搵唔到個element。
既然處理DOM咁麻煩，咁不如唔好搞佢？於是data-driven嘅概念就開始出現。
W3CSchool教學例子 - AngularJS。
自己新寫嘅to-do list已經完全唔用jQuery，而係轉用Vue了。
比起操控複雜嘅DOM，你只需要諗資料點樣處理就好，而其他嘢就交返俾JS framework / library本身去搞。咁樣嘅話就唔駛再驚因為改咗HTML上嘅一啲嘢而搞到成段程式碼死咗──尤其JS嘅debug一如既往咁難嘅時候。
至於曾經令jQuery引以為傲嘅Ajax library呢？我哋而家有Axios。甚至Vue本身都有自己嘅Ajax library Vue-resource嘅時候，點解仲要用一個已經逐漸被技術淘汰嘅舊式JS framework？
咁係咪代表jQuery會好快死？咁又未必。雖然GitHub已經放棄jQuery，而GitLab亦都轉咗用Vue，但係仲有唔少出名嘅framework或者網站都係仲用緊佢，而且短期內都唔會改變。好似Bootstrap 4咁，即使有另外開發一套叫Bootstrap-Vue嘅套件，但係佢本身framework個底都仲係靠jQuery運作，例如toggle modal等動作。不過，如果jQuery再無任何令人眼前一亮嘅改變的話，會被歿入歷史洪流之中，大概都只係時間問題吧？