的Javascript原型工具方法VS基準性能

我試着FO找到在性能方面最有效的方式來存儲和在JavaScript protoype庫訪問的元素。

可以說，我在測試類

testclass = Class.create({ 

    newParent: null, //I will create a global reference to the parent element 

    method1: function(){ 
     this.newParent = new Element('div',{'id':'newParent'}); 
     var elm = new Element('div', 
     { 
     'id': 'elm1', 
     'identifier': 'elm1identifier' 
     } 
    ); 

     newParent.insert(elm); 
    }, 

    method2: function(){ 
     ?????????? 
    } 

})

在方法2中動態創建與子元素父母，我希望能夠訪問元素elm1。

我一直在想，這裏是我的不同解決方案。

我可以使用（）由原型$提供的實用程序方法
```
method2: function(){ 
    $('elm1'); 
} 
```

我可以使一個全球參考元件訪問的元素。

elm1: null, 
.... 
method2: function(){ 
    this.elm1 
}

3.I可以傳遞元件的方法中作爲一個參數，但此選項將不會總是可用

創建一個唯一的標識符作爲一個屬性，並使用protoype .down功能
```
this.newParent.down('[identifier=elm1identifier]'); 
```

所以ofcou rse我使用這些的組合，但我好奇，在所有的方法，這是最有效的性能方面。

我聽說$（）實用程序方法搜索整個dom嗎？這是一個顯着的差異？如果你有很多元素會怎麼樣。

存儲對元素的引用也可能導致內存問題，特別是如果您在大型網站中有很多javascript。

使用獨特的自定義標識符也很好，但是您還添加了可能對dom本身產生影響的新屬性。但是這個優點是你可以在原型中使用element.down（）方法指定你要搜索的地方。

感謝您的幫助球員。

來源

2011-05-27 theintersect

如果您正在創建一個應該表示DOM元素的對象，那麼給它一個引用該元素的屬性（比如說「element」）似乎是明智的。然後在方法一：

this.element = elm;

我認爲在這個階段，微優化性能是沒有意義的，因爲在性能上最大的提高是不使用的Prototype.js。

的$（）方法是首先對的document.getElementById的別名（這是極快在瀏覽器和一直是），其次添加方便的方法來返回的元素。如果瀏覽器沒有實現基於原型的繼承方案，Prototpye.js會將約50種方法直接添加到元素中作爲屬性，這是相當昂貴的操作。

我懷疑存儲對元素的引用將導致重大的內存問題，除非你存儲了數以萬計而不使用它們（它們只是參考）。

採用了獨特和定製標識符也不錯，但同時也增加了其可能對DOM本身的效果新屬性

不要添加自定義屬性或屬性的DOM元素。 Prototype.js 2.0版本正在遠離這個模型（最後），只是不這樣做。如果您有一個表示元素的對象（或「包裝」），請將該屬性添加到該元素中。

來源

2011-05-27 06:30:01 RobG

所以如果不得不在引用和使用$（）之間進行選擇，哪一個會更高效？你說過性能最大的改進是不使用prototype.js？這是否意味着使用原生JavaScript而不是框架會顯着提高性能？感謝你的回答。 – theintersect 2011-05-27 06:51:27

引用通常會更快，但可能不會太多。 $（）的問題是瀏覽器沒有實現DOM元素的原型繼承。 POJS可以帶來顯着的性能優勢，但是除非您正在進行大量的處理，否則您可能不會注意到它。 – RobG 2011-05-27 14:19:38

的Javascript原型工具方法VS基準性能

回答

相關問題