譯者按: 看來 jQuery 還是有一些用武之地的。
為了保證可讀性,本文采用意譯而非直譯。翻譯僅供學習探討,不代表 Fundebug 觀點。
許多人都在提倡: “直接用原生的 JavaScript 就好了,不需要 jQuery 了”。
You might not need jQuery嘗試告訴我們,擺脫 jQuery 是一件很容易的事情。但是,它的第一個例子恰恰告訴我們用 jQuery 其實也不錯,因為我們寫了 10 行原生的 JavaScript 代碼,其實只需要 1 行 jQuery 代碼就夠了。
很多 JavaScript 的 API,尤其是 DOM 相關的 API,挑戰了我的審美哲學,直白點說,我覺得它們太糟糕了!el.insertAdjacentElement('afterend', other)
當然也可以用,但是$(el).after(other)
更加簡潔。$()
函數也沒那么好看,我沒有特別喜歡,但是它比原生的 API 好太多了。
你們如何獲取某個元素的 sibling 呢?到底用nextSibling
還是用nextElementSibling
?它們有什么不同?各個瀏覽器分別支持哪個方法?當你忙着去 MDN 查文檔的時候,我直接用 jQuery 的next
和prev()
就好了。
許多常用的 JavaScript 的標准 API 都挺奇怪的,這里我就不列出來了,大家去You might not need jQuery看看就知道了。
寫代碼的時候,我們總會需要使用一些常用的幫助函數,You might not need jQuery列舉了很多,使用 jQuery 可以很方便的使用這些幫助函數,這樣我們就不需要每次都去 Stack OverFlow 上去復制代碼了。。。
瀏覽器的兼容問題已經沒有以前那么頭疼了,但是它還是個不小的問題,除非你覺得只要 85%的用戶 OK 就行。關於這個問題,大家可以閱讀我的Why Hello CSS doesn’t use CSS variables。
那么,我們必須使用 jQuery 嗎?當然不是!使用任何第三方庫都是有代價的,增加了復雜度,也增加了文件大小。但是,jQuery 其實沒那么大,壓縮之后的大小只有 30K。如果我們去掉 ajax 以及一些不常用的功能的話,就只有 23K;如果我們使用 querySelector 替代 SizzleJS 來構建的話,則只有 17K 了。無論是 30K 還是 17K,對許多應用來說,這個大小都是完全可以接受的。
大家不妨看看Bootstrap removing jQuery,為了移除 jQuery,他們也是花了不少精力啊:自己擼幫助函數;放棄兼容 IE,因為太難寫了;他們花了 1 年半時間來倒騰這個。最終的結果在我看來,這些努力似乎不值得。
我理解他們為什么這么做,大家希望在 Vue 項目中使用 Bootstrap,但是同時使用 Vue 和 jQuery 的話有點傻。對於減少網頁大小,我非常同意,也很喜歡Web bloat與The Ethics of Web Performance兩篇博客中的觀點。但是,我們需要實際一點,不要過於理想主義。添加 17K 的 jQuery 真的那么糟糕嗎?當我吐槽 Medium 或者 New York Times 這樣的網站需要的 JS 文件超過 1M 的時候,有的人會這樣反駁:”莫非你還在用 56k 的帶寬?“,但是,為什么 17K 的 jQuery 就那么不能接受了呢?
不用 jQuery 而自己寫幫助函數也可以,比如你希望你寫的函數被其他人復用,或者你寫的函數特別小。但是為了不用 jQuery,放棄向后兼容?那我覺得還是用 jQuery 得了。所有事情都用 jQuery 實現當然不好,但是任何時候都不用 jQuery也不是什么明智之舉。
我不是 jQuery 的狂熱粉絲,我也願意使用一些簡化版的 jQuery,只要它們可以讓 JS 的 API 更好用一點。You might not need jQuery推薦了bonzo和$dom,以及其他一些 AJAX 庫,但是大多數看起來沒怎么維護。如果沒有足夠吸引人的理由,最好不要去替代 jQuery,因為 jQuery 本身沒什么大毛病。
有些讀者也許會去比較 Vue, React 以及其他前端框架,但是這篇博客的目的是比較 jQuery 與原生的 JavaScript,沒有打算去論證整個前端到底應該如何開發。
話說回來,我覺得有些場景下只使用簡單的 JavaScript 也挺好的,主要原因是我希望網頁可以足夠快,可以讓盡量多的人正常訪問。以我的經驗,使用服務端渲染,再加上漸進式增強 JavaScript,是最佳的實現方式,開發起來很簡單,訪問速度足夠快,BUG 也很少。
難道前端框架不好嗎?當然不是,沒有什么絕對不好的技術,所有技術都有一定的取舍,當然也包括 jQuery。
參考
關於Fundebug
Fundebug專注於JavaScript、微信小程序、微信小游戲、支付寶小程序、React Native、Node.js和Java線上應用實時BUG監控。 自從2016年雙十一正式上線,Fundebug累計處理了10億+錯誤事件,付費客戶有Google、360、金山軟件、百姓網等眾多品牌企業。歡迎大家免費試用!
版權聲明
轉載時請注明作者Fundebug以及本文地址:
https://blog.fundebug.com/2019/06/04/why-i-am-still-using-jquery-in-2019/