作為差點一統全球門戶網站的前端工具，jQuery 曾在 Web 2.0 初興之時風頭無兩，然而隨著前端技術的不斷演進與瀏覽器底層標準的統一，jQuery 卻逐漸成為一些網站眼中的 “技術債”。 

日前，英國政府網站 GOV.UK 刪除其網站上所有前端應用程序依賴項 jQuery。刪除之后，13 個前端應用程序 JavaScript 大小減少了 32 KB（或 31% 到 49%）之間，其他多項性能提升，團隊部分技術債得以清除。

2019 年，Bootstrap 4.3.1 版本發布，開發團隊表示在發布 v4.3 版本后，將會在開發 Bootstrap 5 的過程中實現一些關鍵變化，其中就包括放棄使用 jQuery。

2018 年，GitHub 改版重構頁面時移除了 jQuery ，GitHub 前端團隊并未使用其它框架來代替 jQuery，而是使用原生 JavaScript。

不過另一方面，根據 BuiltWith 的統計，已知正在使用 jQuery 的實時網站數量高達 69,193,395 個，流量排名前百萬的網站中，使用 jQuery 的比例高達 75.6%。從使用數據來看，jQuery 江湖地位仍在，而從呼聲來看，jQuery 已逐漸讓位給后起之秀……

Web 2.0，jQuery 閃亮登場

了解 jQuery 的出場必然繞不開上世紀的瀏覽器大戰以及 JavaScript 的出現。1994 年，Netscape 網景公司成立，開發出瀏覽器 Netscape Navigator，并在四個月內占據了四分之三的瀏覽器市場，成為 1990 年代互聯網的主要瀏覽器。

彼時網景公司的技術能力以及在技術上的戰略都領先于市場。網景預見到，網絡會變得更加動態，其創始人 Marc Lowell Andreessen 則認為 HTML 需要一種膠水語言，也就是腳本語言，可以方便網頁設計師或者是非專業的程序員設計圖片和插件等。

經過一番內部研究，網景決定發明一種與 Java 搭配使用的輔助腳本語言。1995 年 5 月，網景工程師設計出該腳本語言的原型，而網景公司和昇陽電腦公司組成的開發聯盟為了讓這個新語言蹭一波 Java 的熱度，在同年 12 月 Netscape Navigator 2.0 Beta 3 中部署時，將其臨時改名為 JavaScript。

JavaScript 出現之后，逐漸受到開發者追捧。但隨著 Web 2.0 對交互性需求的提高，也對 JavaScript 提出了更高的要求。再加上當時的瀏覽器廠商都還忙著跑馬圈地，搶占市場，許多軟件在不同的瀏覽器上無法通用，增加了軟件作者的開發難度，jQuery 之父 John Resig 便是當時飽受折磨的程序員之一。

John Resig

“做 Web 編程時，我非常討厭瀏覽器的 Bug，不同的瀏覽器有不同的 Bug，而且數量非常多。于是我用 JavaScript 做了 CSS 選擇引擎，之后還做了個動畫引擎，都是自娛自樂。但與此同時我發現自己不能將制作的一些應用放到瀏覽器里。為了將應用放到 Firefox 瀏覽器中，我開始制作相關的 API，以應用該 CSS 選擇引擎和動畫引擎，這些最終成為了 jQuery。幾個月后，我將那些應用做進 Firefox 里，之后在 IE 里也可以運行。”

John Resig 最早在 2005 年向外界展示了 JavaScript 上一個語法更簡潔的 CSS 選擇器，2006 年的 BarCampNYC 活動上，John Resig 發布了第二個新版本：jQuery: New Wave JavaScript，“這段代碼徹底改變了讓 Javascript 與 HTML 交互的方式”。

jQuery 的設計的宗旨是 “write Less，Do More”，許多年后，John 仍將這當作是自己的目標 —— 讓每個人都可以在網頁里寫點什么，并且寫的東西能夠在瀏覽器中順利運行出來。

jQuery 的出現解決當時前端開發人員兩個普遍的煩惱：讓 JavaScript 與 DOM 的交互接口變得簡單，減少開發過程中的跨瀏覽器問題。

首先是簡化 DOM 操作。HTML DOM 定義了用于 HTML 的一系列標準的對象，以及訪問和處理 HTML 文檔的標準方法。通過 DOM，可以訪問所有的 HTML 元素，連同它們所包含的文本和屬性，并對其中的內容進行修改和刪除、創建新的元素等等。在 jQuery 之前，使用 JavaScript 操作 DOM 需要定義一個函數，然后將其綁定到特定 DOM 中的各種 HTML 元素中，這對于日常使用來說非常繁瑣和復雜。

所以 jQuery 提供了一個選擇器引擎 —— 后來迭代為 Sizzle，它使得開發者可以在 CSS 中，通過名稱（例如 div）、ID（例如 #myId）、類別（例如 .my-class）等來選擇頁面上的元素，用字符串代替函數來查找元素，過濾子元素，相較其他引擎速度更快、文件大小更小、易于擴展并且沒有依賴關系。

另一方面，在純 JavaScript 開發中，開發者需要檢查瀏覽器使用何種方式添加事件，然后再做選擇，但是 jQuery 提供了隱藏了不同瀏覽器的 JavaScript 實現之間的一些不兼容性，可以自行檢查瀏覽器需要什么方式，然后使用適當的方式。

憑借著這兩個優勢，jQuery 迅速獲得了開發者社區和許多大公司的支持。在 2010 年左右，微軟和 Google 都在他們的 CDN 網絡中為 jQuery 庫提供托管；Media Temple 竭盡全力捐助托管 jQuery 網站；微軟也參與到對 jQuery 的測試和開發工作中，Visual Studio 和 ASP.NET MVC 都內置 jQuery；諾基亞參與 jQuery 測試，并雇傭了 jQuery 核心成員 Brandon Aaron；Mozilla 則直接雇傭了 John Resig……

正是這些大公司的支持與使用，使得 jQuery 在最初的幾年間非常成功。根據 John Resig 的介紹，jQuery 的開發資源全部來自于外部的捐贈。2011 年，jQuery 成立 jQuery 基金會，主要為支持 jQuery 核心，用戶界面和移動項目的發展，提供 jQuery 文檔和支持和促進 jQuery 社區發展。

“令我高興的是，世界上顯然仍簡潔 API 設計的一席之地，正如 jQuery 的持續成功所證明的那樣?！?在 jQuery 十周年的時候，John Resig 還對 jQuery 的火爆表達過贊嘆，“令人驚訝！jQuery 比以往任何時候都更受歡迎，全球前 100 萬網站 77.8% 都在使用它?！?/p>

這一比例至今也只是下降了 2.2%，許多公司仍在使用 jQuery。有業內人士分析：“jQuery 在 2016 年之前的普及率非常高，幾乎有 90% 以上的市占率，同時也培養了很多以 jQuery 為技術起點的開發者。2016 年后，雖然 React、Vue 在國內飛速發展，但生態層面依然沒有 jQuery 那么完善，一些開發者在新興的 MVVM 框架上找不到的解決方案時，就只能從 jQuery 生態里面尋找，也就出現了許多網站在混用的情況?！?/p>

那么，在如此高的使用率下，為什么對 jQuery 會成為一些公司眼中想要刪掉的技術債呢？

jQuery 江湖地位不再？

“目前從整個世界范圍講，jQuery 這項技術屬于被邊緣化的存在。” 業內人士指出，從 2006 年第一個版本發布起，jQuery 迎來了 10 年的黃金期，這種底蘊意味著它很難被瞬間淘汰。但隨著 JavaScrpit 本身的成熟和瀏覽器內核的統一，jQuery 的優勢在慢慢淡化…… 

“我們基本不加入新功能，目前大多數工作都是優化，讓 jQuery 變得更快、更強、更容易理解。未來的工作也是優化，使 jQuery 功能更清晰化。”2011 年，jQuery 團隊表達的觀點可以說也為 jQuery 后來的命運埋下了注腳。

當 jQuery 開始走向優化路線時，當 jQuery 最初所解決的問題逐漸不再是普遍問題時，必然面臨優勢不復的情況。回看 jQuery 的兩個主戰場，簡化 DOM 操作和瀏覽器兼容，都在最近幾年有了更優解。

首先，瀏覽器兼容的問題。在 jQuery 雛形初現的前一年 ——2004，一群來自 Opera、Mozilla、Apple 等不同組織但志同道合的人聚集在一起，組成一個名為 WHATWG 的獨立規范組，旨在編寫一個更好的 HTML 標記規范，用來構建新一代 Web 應用程序，這個規范組之后的成果便是 Web 應用程序 1.0 規范。而后，W3C 成員多次討論后，在 2007 年 3 月，重啟 HTML 工作，新的 HTML 工作小組做的第一個決定，便是采用 Web 應用程序 1.0 規范，并將其稱為 HTML5。

相較此前的 HTML 版本，HTML 5 更適合編寫動態的應用程序，并且具有明確定義的解析算法，實現所有 HTML5 的瀏覽器都將從相同的標記創建相同的 DOM。

不過，HTML5 在剛出現時并不十分完善，外部采用率較低，給了 jQuery 前期喘息成長的機會。

到了 2008 年，第一個 HTML5 草案誕生，同年，IE、Chrome、FireFox、Safari 幾大瀏覽器巨頭開始相繼支持 HTML5。但這時的 HTML 5 還尚未定稿，同時也受到一些質疑，比如 2012 年 Facebook 應用放棄 HTML5 部分，改為純原生方式開發。HTML5 的標準制定者 W3C 和 WHATWG 因為在標準制定上的分歧也不再合作，原本一直是 HTML5 堅定后盾的蘋果也不再允許純 Web APP 套殼登錄 App Store。

HTML 5 又經歷了一段時間的低迷，在此期間，jQuery 依舊是全球大多數網站的心頭好。

直到 2014 年 10 月底，歷時 8 年，W3C 終于宣布 HTML5 定稿。而后兩年，瀏覽器廠商們紛紛宣布支持 HTML5，各類應用程序開發商們們也陸續采用 HTML5 開發產品，HTML5 的一些服務提供商也獲得融資。

伴隨著 HTML5 的大范圍應用，另一個對 jQuery 造成 “威脅” 的技術框架 ——MVVM 普及，使得 jQuery 在 DOM 操作上的優勢不復。

由于開發者們希望 HTML5 開發的應用可以接近原生 App 的效果，便暴露出一些問題，比如大量的 DOM 操作與 DOM API 的頻繁調用，操作繁瑣，使得代碼變得難以維護，頁面渲染性能降低、速度變慢等。即便 jQuery 能簡化 DOM 操作，但比不上 MVVM 架構直接跳過了 DOM 操作。 

MVVM 架構由 Model、View、ViewModel 三部分構成，Model 層代表數據模型，可定義數據修改和操作的業務邏輯；View 代表 UI 組件，負責將數據模型轉化成 UI 展現，ViewModel 則是一個同步 View 和 Model 的對象。View 和 Model 之間通過 ViewModel 進行交互，并且二者的同步工作完全自動，不需要開發者手動操作 DOM。

由于 MVVM 結構實現了數據與視圖的分離，并通過數據來驅動視圖，封裝 DOM 操作，將數據和視圖的綁定變成了自動化的操作，進而把 DOM 操作從業務代碼中移除，這就導致 jQuery 在很多場景中失去了用武之地。

MVVM 架構圖 

符合 MVVM 思維的新一代的前端開發框架逐漸嶄露頭角，組成現在的前端三大框架： 

• 2009 年，AngularJS 框架出現，后被 Google 收購，最為核心的特性包括 MVVM、模塊化、自動化雙向數據綁定、語義化標簽、依賴注入等等；
• 2013 年 5 月，起源于 Facebook、用于構建用戶界面的 JavaScript 庫 React 開源；
• 2013 年，在 Google 工作的尤雨溪受到 Angular 的啟發，發出了一款輕量框架 Seed，同年 12 月更名為 Vue，2014 年 01 月 24，Vue 正式對外發布，版本號是 0.8.0。 

有人形容 jQuery 和新框架的對比：

我讓 jQuery 去買瓶醬油，給了他 100 塊錢，這時我們需要告訴他去小賣鋪的路怎么走、怎么跟老板說買啥醬油，買多少錢的醬油，找多少零錢，還得告訴他怎么回來（命令式）。

這時我讓 Vue 去買醬油去了，這時我只需要給他錢，并且告訴他目的地在哪兒，買什么醬油即可，不需要手把手教他（函數式）。

這就是傳統開發和現代框架開發的不同。

整體而言，隨著 UI 交互標準的提升，瀏覽器解析標準的統一，jQuery 在新功能上很難超過一眾 MVVM 框架。

但 jQuery 目前最大的優勢，是相對輕量，只需要面向瀏覽器，而新框架則需要很多工程化的手段，技術門檻比 jQuery 高。而且 jQuery 組件有一定的歷史底蘊，涵蓋面廣，功能相對全面，在生態上也比 MVVM 框架更為成熟。

此外，由于 jQuery 目前仍有著較高的市占率，簡單易上手，掌握 jQuery 依舊是許多開發者的 “基操”。在對 jQuery 的評價中，有這么一句流傳甚廣的話：“任何一個程序員，都可以用三天的時間學會 jQuery 的基本用法并投入使用”。再加上開發者的技術棧更新也存在著一些主觀因素，完全推倒已經掌握的技術，對大部分、尤其是本來就不擅長前端領域的開發者而言很困難。業內人士預測，jQuery 在未來若干年的主要受眾群體，依舊會是后端開發者，當然這個群體比例會隨著新人的不斷加入而被慢慢沖淡。 

“總體而言，我們今天討論的并非是  jQuery 的地位，而更多應該是它存在的意義，對實用者而言，人們更關心 jQuery 能幫他們解決多少問題，地位已經不再是屬于 jQuery 的標簽了?！?/p>