jQuery 版本小筆記

好一段時間沒接觸 jQuery,不知不覺 jQuery 也更新到了 v3 版本。

前些日子,因為要使用 Firefox 一個知名的擴充套件:Greasemonkey,需要額外載入 jQuery 套件,回到 jQuery 官網檢查了一下最新的版本狀態。

根據以往使用習慣,通常都是使用 jquery-xxx.min.js(xxx 表示 jQuery 的版本號),但在 v3 卻多了一個 jquery-xxx.slim.min.js 的版本,以字義來看,就是精簡或是瘦身版本,可是這個版本到底是怎麼一回事?

先從頭說起,以往 jQuery 在 v1 及 v2 只有一個版本:我稱之為「標準版」,以及兩個分支版本,分別是壓縮版(Production, Compressed)與未壓縮版(Development, Uncompressed),它們所對應的檔案名稱及概況是:

  • 壓縮版:
    • 檔案名稱:jquery-xxx.min.js
    • 檔案小,適合網站正式上線時使用,可以減少流量
  • 未壓縮版:
    • 檔案名稱:jquery-xxx.js
    • 也有人稱之為開發版,檔案較大,適合開發過程偵錯及除錯使用

xxx 圴指 jQuery 的版本號。

這次 v3 除了標準版之外,還多出了 slim 版本,我稱之為「精簡版」,同樣有兩個分支版本。只是不太能理解的是標準版本和精簡版本到底有什麼區別。

jQuery 下載頁面中,並沒有特別提到它們的差別,不過在 release notes 中,倒是有特別提到:

Sometimes you don’t need ajax, or you prefer to use one of the many standalone libraries that focus on ajax requests. And often it is simpler to use a combination of CSS and class manipulation for all your web animations. Along with the regular version of jQuery that includes the ajax and effects modules, we’ve released a “slim” version that excludes these modules. The size of jQuery is very rarely a load performance concern these days, but the slim build is about 6k gzipped bytes smaller than the regular version – 23.6k vs 30k.

簡單來說,一句話:

slim 版本(精簡版),不包含「ajax」以及「effects」,這兩個模組。

做個圖表,大概就清楚了

標準版精簡版
分支版本
  • 未壓縮
    (Development, Uncompressed)
  • 壓縮
    (Production, Compressed)
  • 未壓縮
    (Development, Uncompressed)
  • 壓縮
    (Production, Compressed)
檔案名稱
  • jquery-xxx.js
  • jquery-xxx.min.js
  • jquery-xxx.slim.js
  • jquery-xxx.slim.min.js
功能模組全部包含不包含:

  • ajax
  • effects

因為不包含「ajax」以及「effects」,所以它的檔案又會更加地小,也會讓流量變得更小。但是不是一定要將現有的 jQuery 換成 slim 版本,就沒有一定的答案。

如果,網站或是網站其他 jQuery 套件會使用到 ajax 或是 effects 這兩個模組裡的功能,那麼還是請乖乖地使用壓縮版本。

反之,如果確定不會使用到那兩個模組,請安心地換成 slim 版本。

雖然 jQuery 官網所提供的 slim 版本,不包含 ajax 及 effects 這兩個模組,不過事實上我們是可以自行決定我們的 jQuery 需要/不需要哪些模組,當然要自訂模組就會比較麻煩一點了,有興趣的人,也可以在 jQuery 的 GitHub 找到相關方法。

【其他相關訊息】

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

這個網站採用 Google reCAPTCHA 保護機制,這項服務遵循 Google 隱私權政策服務條款