在做了一些關於這個主題的研究之後,我一直在嘗試很多模式來組織我的jQuery代碼(例如Rebecca Murphy在jQuery Conference上做了一個presentation的例子)。jQuery的代碼組織和性能
昨天我檢查了(揭示)模塊模式。結果看起來有點讓人想起YUI語法我想:
//global namespace MyNameSpace
if(typeof MNS=="undefined"||!MNS){var MNS={};}
//obfuscate module, just serving as a very simple example
MNS.obfuscate = function(){
//function to create an email address from obfuscated '@'
var email = function(){
$('span.email').each(function(){
var emailAddress = $(this).html().replace(' [ @ ] ','@');
$(this).html('<a href="mailto:' + emailAddress + '">' + emailAddress + '</a>');
});
};
return {
email: email
};
}();
//using the module when the dom's ready
jQuery(document).ready(function($){
MNS.obfuscate.email();
});
我到底有幾個模塊。一些自然包含的「私人成員」,在這種情況下意味着變量和/或函數,這些變量和/或函數對於本模塊中的其他函數僅僅是重要的,因此並沒有在返回語句中結束。
我認爲我的代碼連接的部分(與搜索示例有關的所有內容)組合在一個模塊中是有意義的,給出了整個事物結構。
但是寫這之後,我由約翰(Resig的),在那裏他還寫了關於模塊模式的性能讀取article:
「實例化功能與一羣原型的屬性是非常,非常,如果你有一個你想讓人們進行交互的經常訪問的函數(返回一個對象),那麼有利於你擁有對象的屬性在原型鏈中並將其實例化,其代碼如下:
// Very fast
function User(){}
User.prototype = { /* Lots of properties ... */ };
// Very slow
function User(){
return { /* Lots of properties */ };
}
(約翰提到他並不反對模塊模式「本身」 - 只是爲了讓你知道:)
然後我不知道如果我正在用我的代碼進入正確的方向。事情是:我真的不需要任何私人成員,我也不認爲我暫時需要繼承。 我現在想要的只是一種可讀/可維護的模式。我想這可以歸結爲個人喜好,但我不想結束那些具有(相當嚴重的)性能問題的可讀代碼。
我不是JavaScript專家,因此就性能測試而言,更不是專家。首先,我不知道John提到的東西(「經常訪問的函數(返回對象),你希望人們與之交互的東西」,很多屬性等等)適用於我的代碼。我的代碼交互的文檔不是很大,有100或1000個元素。所以也許這根本不是問題。
但它來到我的腦海裏的一件事是,而不是僅僅有
$('span.email').each(function(){
var emailAddress = $(this).html().replace(' [ @ ] ','@');
$(this).html('<a href="mailto:' + emailAddress + '">' + emailAddress + '</a>');
});
(在domready中函數內部),我創建兩個「額外」的功能,模糊和電子郵件,由於使用的模塊模式。創建附加功能需要一段時間。問題是:在我的情況下它會是可衡量的嗎?
我不確定是否在上面的示例中創建了閉包(在jQuery論壇上的一篇有趣的文章中,我閱讀了以下內容:「有一個關於內部函數是否創建閉包的哲學爭論, t在外部函數的變量對象上引用任何東西......「),但是我確實在我的真實代碼中有閉包。儘管我不認爲我在那裏有任何循環引用,但我不知道這會導致內存消耗高/垃圾收集問題的程度如何。
我真的很想聽聽你的意見,也許看到你的代碼的一些例子。另外,您更喜歡哪些工具來獲取有關執行時間,內存和CPU使用率的信息?
謝謝你的回答!我將不得不考慮一下它的主要部分,我想:) 至於電子郵件功能:你當然是對的。我只是想要一個簡單的例子,並將其複製到其中。我現在改變了,所以它會更有意義。 – north 2010-03-04 09:19:09