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

Question

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

Answer 1

这要看你来我从想,但是对于存储简单的属性,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,因此直接比较可能不公平.虽然它们在很多情况下都用于相同的事情,但它们也有不同的应用程序,这两种应用程序并不常见......因此在选择使用内容时请记住这一点.这通常适用于任何两种最常见的技术IMO.