建站
咨詢
售后
建站咨詢
新聞中心
作為差點(diǎn)一統(tǒng)全球門戶網(wǎng)站的前端工具，jQuery 曾在 Web 2.0 初興之時(shí)風(fēng)頭無兩，然而隨著前端技術(shù)的不斷演進(jìn)與瀏覽器底層標(biāo)準(zhǔn)的統(tǒng)一，jQuery 卻逐漸成為一些網(wǎng)站眼中的 “技術(shù)債”。
創(chuàng)新互聯(lián)公司專注于全州網(wǎng)站建設(shè)服務(wù)及定制，我們擁有豐富的企業(yè)做網(wǎng)站經(jīng)驗(yàn)。 熱誠為您提供全州營銷型網(wǎng)站建設(shè)，全州網(wǎng)站制作、全州網(wǎng)頁設(shè)計(jì)、全州網(wǎng)站官網(wǎng)定制、微信平臺(tái)小程序開發(fā)服務(wù)，打造全州網(wǎng)絡(luò)公司原創(chuàng)品牌,更為您提供全州網(wǎng)站排名全網(wǎng)營銷落地服務(wù)。
日前，英國政府網(wǎng)站 GOV.UK 刪除其網(wǎng)站上所有前端應(yīng)用程序依賴項(xiàng) jQuery。刪除之后，13 個(gè)前端應(yīng)用程序 JavaScript 大小減少了 32 KB（或 31% 到 49%）之間，其他多項(xiàng)性能提升，團(tuán)隊(duì)部分技術(shù)債得以清除。
2019 年，Bootstrap 4.3.1 版本發(fā)布，開發(fā)團(tuán)隊(duì)表示在發(fā)布 v4.3 版本后，將會(huì)在開發(fā) Bootstrap 5 的過程中實(shí)現(xiàn)一些關(guān)鍵變化，其中就包括放棄使用 jQuery。
2018 年，GitHub 改版重構(gòu)頁面時(shí)移除了 jQuery ，GitHub 前端團(tuán)隊(duì)并未使用其它框架來代替 jQuery，而是使用原生 JavaScript。
不過另一方面，根據(jù) BuiltWith 的統(tǒng)計(jì)，已知正在使用 jQuery 的實(shí)時(shí)網(wǎng)站數(shù)量高達(dá) 69,193,395 個(gè)，流量排名前百萬的網(wǎng)站中，使用 jQuery 的比例高達(dá) 75.6%。從使用數(shù)據(jù)來看，jQuery 江湖地位仍在，而從呼聲來看，jQuery 已逐漸讓位給后起之秀……
Web 2.0，jQuery 閃亮登場
了解 jQuery 的出場必然繞不開上世紀(jì)的瀏覽器大戰(zhàn)以及 JavaScript 的出現(xiàn)。1994 年，Netscape 網(wǎng)景公司成立，開發(fā)出瀏覽器 Netscape Navigator，并在四個(gè)月內(nèi)占據(jù)了四分之三的瀏覽器市場，成為 1990 年代互聯(lián)網(wǎng)的主要瀏覽器。
彼時(shí)網(wǎng)景公司的技術(shù)能力以及在技術(shù)上的戰(zhàn)略都領(lǐng)先于市場。網(wǎng)景預(yù)見到，網(wǎng)絡(luò)會(huì)變得更加動(dòng)態(tài)，其創(chuàng)始人 Marc Lowell Andreessen 則認(rèn)為 HTML 需要一種膠水語言，也就是腳本語言，可以方便網(wǎng)頁設(shè)計(jì)師或者是非專業(yè)的程序員設(shè)計(jì)圖片和插件等。
經(jīng)過一番內(nèi)部研究，網(wǎng)景決定發(fā)明一種與 Java 搭配使用的輔助腳本語言。1995 年 5 月，網(wǎng)景工程師設(shè)計(jì)出該腳本語言的原型，而網(wǎng)景公司和昇陽電腦公司組成的開發(fā)聯(lián)盟為了讓這個(gè)新語言蹭一波 Java 的熱度，在同年 12 月 Netscape Navigator 2.0 Beta 3 中部署時(shí)，將其臨時(shí)改名為 JavaScript。
JavaScript 出現(xiàn)之后，逐漸受到開發(fā)者追捧。但隨著 Web 2.0 對(duì)交互性需求的提高，也對(duì) JavaScript 提出了更高的要求。再加上當(dāng)時(shí)的瀏覽器廠商都還忙著跑馬圈地，搶占市場，許多軟件在不同的瀏覽器上無法通用，增加了軟件作者的開發(fā)難度，jQuery 之父 John Resig 便是當(dāng)時(shí)飽受折磨的程序員之一。
John Resig
“做 Web 編程時(shí)，我非常討厭瀏覽器的 Bug，不同的瀏覽器有不同的 Bug，而且數(shù)量非常多。于是我用 JavaScript 做了 CSS 選擇引擎，之后還做了個(gè)動(dòng)畫引擎，都是自娛自樂。但與此同時(shí)我發(fā)現(xiàn)自己不能將制作的一些應(yīng)用放到瀏覽器里。為了將應(yīng)用放到 Firefox 瀏覽器中，我開始制作相關(guān)的 API，以應(yīng)用該 CSS 選擇引擎和動(dòng)畫引擎，這些最終成為了 jQuery。幾個(gè)月后，我將那些應(yīng)用做進(jìn) Firefox 里，之后在 IE 里也可以運(yùn)行?！?/p>
John Resig 最早在 2005 年向外界展示了 JavaScript 上一個(gè)語法更簡潔的 CSS 選擇器，2006 年的 BarCampNYC 活動(dòng)上，John Resig 發(fā)布了第二個(gè)新版本：jQuery: New Wave JavaScript，“這段代碼徹底改變了讓 Javascript 與 HTML 交互的方式”。
jQuery 的設(shè)計(jì)的宗旨是 “write Less，Do More”，許多年后，John 仍將這當(dāng)作是自己的目標(biāo) —— 讓每個(gè)人都可以在網(wǎng)頁里寫點(diǎn)什么，并且寫的東西能夠在瀏覽器中順利運(yùn)行出來。
jQuery 的出現(xiàn)解決當(dāng)時(shí)前端開發(fā)人員兩個(gè)普遍的煩惱：讓 JavaScript 與 DOM 的交互接口變得簡單，減少開發(fā)過程中的跨瀏覽器問題。
首先是簡化 DOM 操作。HTML DOM 定義了用于 HTML 的一系列標(biāo)準(zhǔn)的對(duì)象，以及訪問和處理 HTML 文檔的標(biāo)準(zhǔn)方法。通過 DOM，可以訪問所有的 HTML 元素，連同它們所包含的文本和屬性，并對(duì)其中的內(nèi)容進(jìn)行修改和刪除、創(chuàng)建新的元素等等。在 jQuery 之前，使用 JavaScript 操作 DOM 需要定義一個(gè)函數(shù)，然后將其綁定到特定 DOM 中的各種 HTML 元素中，這對(duì)于日常使用來說非常繁瑣和復(fù)雜。
所以 jQuery 提供了一個(gè)選擇器引擎 —— 后來迭代為 Sizzle，它使得開發(fā)者可以在 CSS 中，通過名稱（例如 div）、ID（例如 #myId）、類別（例如 .my-class）等來選擇頁面上的元素，用字符串代替函數(shù)來查找元素，過濾子元素，相較其他引擎速度更快、文件大小更小、易于擴(kuò)展并且沒有依賴關(guān)系。
另一方面，在純 JavaScript 開發(fā)中，開發(fā)者需要檢查瀏覽器使用何種方式添加事件，然后再做選擇，但是 jQuery 提供了隱藏了不同瀏覽器的 JavaScript 實(shí)現(xiàn)之間的一些不兼容性，可以自行檢查瀏覽器需要什么方式，然后使用適當(dāng)?shù)姆绞健?/p>
憑借著這兩個(gè)優(yōu)勢(shì)，jQuery 迅速獲得了開發(fā)者社區(qū)和許多大公司的支持。在 2010 年左右，微軟和 Google 都在他們的 CDN 網(wǎng)絡(luò)中為 jQuery 庫提供托管；Media Temple 竭盡全力捐助托管 jQuery 網(wǎng)站；微軟也參與到對(duì) jQuery 的測(cè)試和開發(fā)工作中，Visual Studio 和 ASP.NET MVC 都內(nèi)置 jQuery；諾基亞參與 jQuery 測(cè)試，并雇傭了 jQuery 核心成員 Brandon Aaron；Mozilla 則直接雇傭了 John Resig……
正是這些大公司的支持與使用，使得 jQuery 在最初的幾年間非常成功。根據(jù) John Resig 的介紹，jQuery 的開發(fā)資源全部來自于外部的捐贈(zèng)。2011 年，jQuery 成立 jQuery 基金會(huì)，主要為支持 jQuery 核心，用戶界面和移動(dòng)項(xiàng)目的發(fā)展，提供 jQuery 文檔和支持和促進(jìn) jQuery 社區(qū)發(fā)展。
“令我高興的是，世界上顯然仍簡潔 API 設(shè)計(jì)的一席之地，正如 jQuery 的持續(xù)成功所證明的那樣?！?在 jQuery 十周年的時(shí)候，John Resig 還對(duì) jQuery 的火爆表達(dá)過贊嘆，“令人驚訝！jQuery 比以往任何時(shí)候都更受歡迎，全球前 100 萬網(wǎng)站 77.8% 都在使用它?！?/p>
這一比例至今也只是下降了 2.2%，許多公司仍在使用 jQuery。有業(yè)內(nèi)人士分析：“jQuery 在 2016 年之前的普及率非常高，幾乎有 90% 以上的市占率，同時(shí)也培養(yǎng)了很多以 jQuery 為技術(shù)起點(diǎn)的開發(fā)者。2016 年后，雖然 React、Vue 在國內(nèi)飛速發(fā)展，但生態(tài)層面依然沒有 jQuery 那么完善，一些開發(fā)者在新興的 MVVM 框架上找不到的解決方案時(shí)，就只能從 jQuery 生態(tài)里面尋找，也就出現(xiàn)了許多網(wǎng)站在混用的情況?！?/p>
那么，在如此高的使用率下，為什么對(duì) jQuery 會(huì)成為一些公司眼中想要?jiǎng)h掉的技術(shù)債呢？
jQuery 江湖地位不再？
“目前從整個(gè)世界范圍講，jQuery 這項(xiàng)技術(shù)屬于被邊緣化的存在?！?業(yè)內(nèi)人士指出，從 2006 年第一個(gè)版本發(fā)布起，jQuery 迎來了 10 年的黃金期，這種底蘊(yùn)意味著它很難被瞬間淘汰。但隨著 JavaScrpit 本身的成熟和瀏覽器內(nèi)核的統(tǒng)一，jQuery 的優(yōu)勢(shì)在慢慢淡化……
“我們基本不加入新功能，目前大多數(shù)工作都是優(yōu)化，讓 jQuery 變得更快、更強(qiáng)、更容易理解。未來的工作也是優(yōu)化，使 jQuery 功能更清晰化?！?011 年，jQuery 團(tuán)隊(duì)表達(dá)的觀點(diǎn)可以說也為 jQuery 后來的命運(yùn)埋下了注腳。
當(dāng) jQuery 開始走向優(yōu)化路線時(shí)，當(dāng) jQuery 最初所解決的問題逐漸不再是普遍問題時(shí)，必然面臨優(yōu)勢(shì)不復(fù)的情況。回看 jQuery 的兩個(gè)主戰(zhàn)場，簡化 DOM 操作和瀏覽器兼容，都在最近幾年有了更優(yōu)解。
首先，瀏覽器兼容的問題。在 jQuery 雛形初現(xiàn)的前一年 ——2004，一群來自 Opera、Mozilla、Apple 等不同組織但志同道合的人聚集在一起，組成一個(gè)名為 WHATWG 的獨(dú)立規(guī)范組，旨在編寫一個(gè)更好的 HTML 標(biāo)記規(guī)范，用來構(gòu)建新一代 Web 應(yīng)用程序，這個(gè)規(guī)范組之后的成果便是 Web 應(yīng)用程序 1.0 規(guī)范。而后，W3C 成員多次討論后，在 2007 年 3 月，重啟 HTML 工作，新的 HTML 工作小組做的第一個(gè)決定，便是采用 Web 應(yīng)用程序 1.0 規(guī)范，并將其稱為 HTML5。
相較此前的 HTML 版本，HTML 5 更適合編寫動(dòng)態(tài)的應(yīng)用程序，并且具有明確定義的解析算法，實(shí)現(xiàn)所有 HTML5 的瀏覽器都將從相同的標(biāo)記創(chuàng)建相同的 DOM。
不過，HTML5 在剛出現(xiàn)時(shí)并不十分完善，外部采用率較低，給了 jQuery 前期喘息成長的機(jī)會(huì)。
到了 2008 年，第一個(gè) HTML5 草案誕生，同年，IE、Chrome、FireFox、Safari 幾大瀏覽器巨頭開始相繼支持 HTML5。但這時(shí)的 HTML 5 還尚未定稿，同時(shí)也受到一些質(zhì)疑，比如 2012 年 Facebook 應(yīng)用放棄 HTML5 部分，改為純?cè)绞介_發(fā)。HTML5 的標(biāo)準(zhǔn)制定者 W3C 和 WHATWG 因?yàn)樵跇?biāo)準(zhǔn)制定上的分歧也不再合作，原本一直是 HTML5 堅(jiān)定后盾的蘋果也不再允許純 Web APP 套殼登錄 App Store。
HTML 5 又經(jīng)歷了一段時(shí)間的低迷，在此期間，jQuery 依舊是全球大多數(shù)網(wǎng)站的心頭好。
直到 2014 年 10 月底，歷時(shí) 8 年，W3C 終于宣布 HTML5 定稿。而后兩年，瀏覽器廠商們紛紛宣布支持 HTML5，各類應(yīng)用程序開發(fā)商們們也陸續(xù)采用 HTML5 開發(fā)產(chǎn)品，HTML5 的一些服務(wù)提供商也獲得融資。
伴隨著 HTML5 的大范圍應(yīng)用，另一個(gè)對(duì) jQuery 造成 “威脅” 的技術(shù)框架 ——MVVM 普及，使得 jQuery 在 DOM 操作上的優(yōu)勢(shì)不復(fù)。
由于開發(fā)者們希望 HTML5 開發(fā)的應(yīng)用可以接近原生 App 的效果，便暴露出一些問題，比如大量的 DOM 操作與 DOM API 的頻繁調(diào)用，操作繁瑣，使得代碼變得難以維護(hù)，頁面渲染性能降低、速度變慢等。即便 jQuery 能簡化 DOM 操作，但比不上 MVVM 架構(gòu)直接跳過了 DOM 操作。
MVVM 架構(gòu)由 Model、View、ViewModel 三部分構(gòu)成，Model 層代表數(shù)據(jù)模型，可定義數(shù)據(jù)修改和操作的業(yè)務(wù)邏輯；View 代表 UI 組件，負(fù)責(zé)將數(shù)據(jù)模型轉(zhuǎn)化成 UI 展現(xiàn)，ViewModel 則是一個(gè)同步 View 和 Model 的對(duì)象。View 和 Model 之間通過 ViewModel 進(jìn)行交互，并且二者的同步工作完全自動(dòng)，不需要開發(fā)者手動(dòng)操作 DOM。
由于 MVVM 結(jié)構(gòu)實(shí)現(xiàn)了數(shù)據(jù)與視圖的分離，并通過數(shù)據(jù)來驅(qū)動(dòng)視圖，封裝 DOM 操作，將數(shù)據(jù)和視圖的綁定變成了自動(dòng)化的操作，進(jìn)而把 DOM 操作從業(yè)務(wù)代碼中移除，這就導(dǎo)致 jQuery 在很多場景中失去了用武之地。
MVVM 架構(gòu)圖
符合 MVVM 思維的新一代的前端開發(fā)框架逐漸嶄露頭角，組成現(xiàn)在的前端三大框架：
- 2009 年，AngularJS 框架出現(xiàn)，后被 Google 收購，最為核心的特性包括 MVVM、模塊化、自動(dòng)化雙向數(shù)據(jù)綁定、語義化標(biāo)簽、依賴注入等等；
- 2013 年 5 月，起源于 Facebook、用于構(gòu)建用戶界面的 JavaScript 庫 React 開源；
- 2013 年，在 Google 工作的尤雨溪受到 Angular 的啟發(fā)，發(fā)出了一款輕量框架 Seed，同年 12 月更名為 Vue，2014 年 01 月 24，Vue 正式對(duì)外發(fā)布，版本號(hào)是 0.8.0。
有人形容 jQuery 和新框架的對(duì)比：
我讓 jQuery 去買瓶醬油，給了他 100 塊錢，這時(shí)我們需要告訴他去小賣鋪的路怎么走、怎么跟老板說買啥醬油，買多少錢的醬油，找多少零錢，還得告訴他怎么回來（命令式）。
這時(shí)我讓 Vue 去買醬油去了，這時(shí)我只需要給他錢，并且告訴他目的地在哪兒，買什么醬油即可，不需要手把手教他（函數(shù)式）。
這就是傳統(tǒng)開發(fā)和現(xiàn)代框架開發(fā)的不同。
整體而言，隨著 UI 交互標(biāo)準(zhǔn)的提升，瀏覽器解析標(biāo)準(zhǔn)的統(tǒng)一，jQuery 在新功能上很難超過一眾 MVVM 框架。
但 jQuery 目前最大的優(yōu)勢(shì)，是相對(duì)輕量，只需要面向?yàn)g覽器，而新框架則需要很多工程化的手段，技術(shù)門檻比 jQuery 高。而且 jQuery 組件有一定的歷史底蘊(yùn)，涵蓋面廣，功能相對(duì)全面，在生態(tài)上也比 MVVM 框架更為成熟。
此外，由于 jQuery 目前仍有著較高的市占率，簡單易上手，掌握 jQuery 依舊是許多開發(fā)者的 “基操”。在對(duì) jQuery 的評(píng)價(jià)中，有這么一句流傳甚廣的話：“任何一個(gè)程序員，都可以用三天的時(shí)間學(xué)會(huì) jQuery 的基本用法并投入使用”。再加上開發(fā)者的技術(shù)棧更新也存在著一些主觀因素，完全推倒已經(jīng)掌握的技術(shù)，對(duì)大部分、尤其是本來就不擅長前端領(lǐng)域的開發(fā)者而言很困難。業(yè)內(nèi)人士預(yù)測(cè)，jQuery 在未來若干年的主要受眾群體，依舊會(huì)是后端開發(fā)者，當(dāng)然這個(gè)群體比例會(huì)隨著新人的不斷加入而被慢慢沖淡。
“總體而言，我們今天討論的并非是 jQuery 的地位，而更多應(yīng)該是它存在的意義，對(duì)實(shí)用者而言，人們更關(guān)心 jQuery 能幫他們解決多少問題，地位已經(jīng)不再是屬于 jQuery 的標(biāo)簽了?！?/p>
網(wǎng)頁題目：JQuery已經(jīng)是時(shí)代的眼淚了嗎
文章鏈接：http://www.dlmjj.cn/article/djsdggo.html
