Я недавно должен был добавить некоторые данные к динамично созданному LI elements
. В моей первой инстанции я использовал .data()
способом как
var _newli = $('<li>foobar</li>');
_newli.data('base', 'ball');
// append _newli to an `ul`
это.. было ужасно медленным. Эта логика происходит в цикле, который может легко расти к 500 + объекты, она взяла возрасты! Иногда это даже повреждало кадр времени выполнения JavaScript.
Таким образом, я изменился на $.data()
. Так или иначе присоединение данных к объекту с этим похоже 8x быстрее, чем переделывание его .data()
вызов метода. Таким образом, теперь это было похоже
var _newli = $('<li>foobar</li>');
$.data(_newli[0], 'base', 'ball');
// append _newli to an `ul`
Это было действительно быстрее, но тем не менее это взяло как 3-4 секунды (!) для создания, все мои элементы (В моем реальном коде там похожи на 6 вызовов к $ .data на элемент).
Таким образом, я действительно застрял, с которым, я попросил, чтобы я почему heck использовал .data()
или $.data()
так или иначе? Я мог просто присоединить свои данные к DOM object
. Таким образом, я сделал
var _newli = $('<li>foobar</li>');
_newli[0].base = 'ball';
// append _newli to an `ul`
Вуаля, ошеломите к моему шоку, который был невероятно быстр! Я не мог полагать, что это работало настолько хороший без любого недостатка. Таким образом, именно это мой вопрос все о на самом деле. Я не нашел недостатка для этой техники до сих пор в сети. Существуют чтения о циклических ссылках, можно создать использование этого пути, но AFAIK "только" на IE и только если Вы обращаетесь к objects
.
Какие-либо эксперты по мыслям?
обновление
Спасибо за хорошие комментарии и парней регистраций. Короткое обновление @patrick собственный вес:
Вы правы, я передавал базовое DOM element
при использовании $.data()
. Это даже не работает с объектами jQuery, по крайней мере, не как ожидалось. Идея об использовании одного объекта и передачи это через $.date()
Я имел самостоятельно, но с другой стороны я был так потрясен о различии в производительности, которое я решил только проигнорировать .data()
метод как навсегда.
Вы правы насчет круговых ссылок, это не проблема за пределами IE, а в IE это становится проблемой только тогда, когда JavaScript имеет ссылку на объект DOM, а объект JS назначается одному из свойств объекта DOM. Я считаю, что эту проблему можно решить, просто обнулив все ссылки в JS на объект DOM.
Метод $().data()
является слишком сложной оберткой для $.data()
(см. jQuery.fn.data
: http://github.com/jquery/jquery/blob/master/src/data.js#L126, который в свою очередь вызывает jQuery.data
: http://github.com/jquery/jquery/blob/master/src/data.js#L20), поэтому отсечение этого посредника сэкономит нетривиальное количество времени, особенно если это нужно сделать 500 раз.
В этом случае метод $().data('foo', 'bar')
делает не больше, чем el.foo = 'bar'
. Делайте то, что быстрее всего.
Это может помочь:
И прочитайте следующее об использовании пользовательского DTD:
Короче говоря, по большей части я не думаю, что у вас возникнут проблемы с использованием пользовательских атрибутов. Большинство разумных/современных браузеров справятся с этим. Я скажу, что я столкнулся с проблемами в веб-приложении, которое я разрабатывал для MobileSafari, что заставило меня прибегнуть к использованию скрытых элементов. К счастью, у меня было не 500+ элементов, а скорее пять или шесть. $.data