最近剛做了一個需要兼容IE8的項目,因爲主流的框架都不兼容,所以就用requireJS+Jquery+grunt來寫
這裏總結了一下requireJS的一些優缺點,以及適用場合。
1.requireJS採用預加載的模式,需要什麼提前按需加載,不加載那些不需要的JS,提高效率。
2.requireJS和其他許多框架一樣,可以避免全局污染。團隊聯合開發的時候,也會減少失誤,git提交也會減少衝突。
這裏引用一段我項目ndex.js中的代碼i,作爲示例。
define(
[
"require",
"jquery",
"config/gobal",
"config/filter",
"config/route",
"handle/handleCtrl"
],
function (require, $) {
"use strict";
var IndexOperation = {
//內容略……
};
return IndexOperation
});
這段代碼是典型的模塊化代碼。而在上方define()函數中的第一個參數數組中,這些就是要預加載的文件。
每個define()都要返回一個 return 的對象 ,這裏就是IndexOperation 這個對象 ,從而使得這個文件的內容也可以被其他文件引用。(這裏就涉及到AMD規範問題)
當然,一個項目可能有好幾十個JS文件,但是在define()第二個參數函數中,所要引用到的就這些文件,因此也就加載這些就足夠了!
這裏需要提到的一點是,seaJS的模塊與requireJS的模塊很像。
直觀看到的優點是:同樣避免了全局污染,代碼可以模塊化,避免多人開發引起衝突。
但是seaJS與requireJS有明顯的一個不通點。
seaJS是lazyload延遲加載模式(CMD),而requireJS是預加載模式(AMD)。
它們之間的不同就是在文件的開頭一下子加載完這個文件所需的模塊,還是邊執行邊加載模塊,等需要用到哪個再加載哪個。
按需加載就是seaJS 、預先加載就是requireJS
關於requireJS的不適用場合
requireJS爲我們提供了很大的便利,但是還是有些問題比較麻煩。
1.當一個項目中需要引用許多插件的時候。
許多插件都是別人寫的,而別人寫的時候並沒有考慮到項目需要配合什麼樣的項目。因此特別是有些面向過程寫法的插件,不符合AMD書寫規範(就像上面模塊需要返回一個對象供其他模塊引用的方式)。
當項目中出現大量的這種插件就不再適合requireJS了。
2.requireJS的綁定事件確實有點坑爹,無法在頁面標籤綁定事件,什麼onclick,onchange 寫到HTML頁面?不存在的~
全都要老老實實根據JS定位,先獲取節點,再在JS中綁定該事件。這在某種程度上影響了網頁的效率,因此也算是一個缺點。