jQuery .data()vs HTML5 data-XXX性能

时间:2010-08-13 11:50:01

标签: jquery performance

我发现此测试http://jsbin.com/ekofa/2表明HTML5 data-XXX比jQuery .data()快。我正在开始一个项目,需要在HTML元素上放置大量小数据,其中性能至关重要。我应该使用.data()还是HTML5数据-XXX?该测试是否相关且准确?

1 个答案:

答案 0 :(得分:7)

这取决于你想要来自哪里,但是为了存储简单的属性,data-XXX会更快,因为$.data().data()工作

例如,当您执行此操作以获取数据时:

var thing = $('#myelement').data('thing')

你实际在做的是:

var thing = $.cache[$('#myelement')[0][$.expando]]['thing'];

这比直接获取属性要长,如下所示:

$('#myelement').attr('thing')

因此,对于数据,您实际上只需要$.expando属性 来获取ID 然后转到$.cache来获取对象,这个额外的步骤意味着它会一直变慢。

然后,data-xxx属性并不意味着存储事件处理程序或您正在积极操作的其他非常复杂的对象......因此它们在应用程序中不是1:1,因此可以直接比较可能不公平。虽然它们在很多情况下都用于相同的事情,但它们也有不同的应用程序,这些应用程序并不常见......所以在选择使用的内容时请记住这一点。这通常适用于任何2 常见技术IMO。