拋棄jQuery，擁抱原生JavaScript

前端發展很快，現代瀏覽器原生 API 已經足夠好用。我們并不需要為了操作 DOM、Event 等再學習一下 jQuery 的 API。同時由于 React、Angular、Vue 等框架的流行，直接操作 DOM 不再是好的模式，jQuery 使用場景大大減少。因此我們項目組在雙十一后抽了一周時間，把所有代碼中的 jQuery 移除。下面總結一下：

Why not jQuery

• jQuery 代表著傳統的以 DOM 為中心的開發模式，但現在復雜頁面開發流行的是以 React 為代表的以數據/狀態為中心的開發模式

應用復雜后，直接操作 DOM 意味著手動維護狀態，當狀態復雜后，變得不可控。React 以狀態為中心，自動幫我們渲染出 DOM，同時通過高效的 DOM Diff 算法，也能保證性能。我們在 React 應用實踐中也發現，大部分當你想直接操作 DOM 的時候，就意味著你可能做錯了。

• jQuery 不支持同構渲染

重構就是前后端運行同一份代碼，后端也可以渲染出頁面。由于 React 原生支持，變得非常熱門。當我們在嘗試做同構應用時，因為代碼要運行在服務器端，但服務器端沒有 DOM，所以引用 jQuery 就會報錯。這也是必須要去除 jQuery 的原因。同時不但要去除 jQuery，也不能直接操作 DOM。

• 原生 API 足夠好用

首先我們必須承認 jQuery 設計的很優秀，非常易用。因些對于很多前端來說，寫頁面就是拿 jQuery 和一些插件拼一下。這也導致他們不懂原生 API。其實這幾年瀏覽器更新很快，也借鑒了很多 jQuery 的 API，我們做替換時并沒有遇到大問題。標準 API 因為設計時考慮因素更多

• 差的瀏覽器已經淘汰的差不多了

If We Didn't Spend So Much on IE Support, We Could Be Taking Vacations on Mars
Christian Alfoni

我們的主打產品現在有千萬用戶，因為我們一直引導用戶升級瀏覽器，上個月統計 IE 9 以下用戶只占不到 3%。但為了這 3% 的用戶我們前端開發卻增加了很多工作量，也限制了我們升級我們的架構，因此放棄支持他們利大于弊。當然這要根據產品來定，比如這是百度統計的國內瀏覽器占 有率，IE8 竟然還有 22%。有些產品可以為了保證用戶體驗，在舊的瀏覽器上投入很大成本，甚至做到了極致。其實我覺得產品更應該做的是引導用戶升級瀏覽器。微軟也宣布 2016年1月12號停止支持 IE 11 以下瀏覽器，繼續使用舊瀏覽器就會有安全風險，我們更應該主動引導，只要產品有足夠吸引力，大部分用戶升級并不困難。

數據來源 百度統計

下面是國際上 IE 占有率，IE8 已經跌出前 10，IE 11 比較多，還好支持他們并不難。

數據來源 W3 Counter

如何移除 jQuery

1. 替換代碼

移除 jQuery 可以很順利，我們把整個過程詳細整理了下并開源。

打開 https://github.com/oneuijs/You-Dont-Need-jQuery 查找替換即可。

同時我們簡單封裝了一些方法：

• oui-dom-utils 來做選擇器和樣式相關
• oui-dom-events 來做 Event，支持命名空間和事件代理

剛去了 jQuery 又引了新的庫，這不是玩我嗎？？其實以上兩個庫很簡單，只是常用方法的簡單封裝，建議你看一下代碼。你當然可以不用。

以上的庫都用于我們的生產環境，我們會長期維護，保證更新。

2. 舊瀏覽器自動跳轉

代碼替換后，當用戶用舊瀏覽器打開時，你還要做一個跳轉，把用戶定位到提示頁面，提示用戶下載升級瀏覽器。IE9 以下瀏覽器都支持條件判斷語句，可以在 </head> 標簽結束前添加如下代碼做自動跳轉

<!--[if lte IE 9]>
  <script>if (!/update\.htm/.test(location.href)) window.location = '//abc.com/update.htm'; </script>
<![endif]-->

本文并不是強迫你一定要移除 jQuery，jQuery 為支持舊瀏覽器節省了很多成本。但條件成熟的情況下，使用原生 JavaScript 能同樣保證開發效率，也可以給產品帶來更好的性能，同時也能提高開發者水平。

來自：https://github.com/camsong/blog/issues/4