2012-02-15 2 views
3

Значительно ли создается и повторно используется эталонное увеличение производительности при селекторе $(this)?

Я создаю ссылки для своих селекторов jQuery, когда я использую один и тот же селектор несколько раз в той же области видимости. Ниже более эффективно

var jSel = $('div.some_class input.some_other_class'); 
    some_function1(jSel); 
    some_function2(jSel); 

чем это

some_function1($('div.some_class input.some_other_class')); 
    some_function2($('div.some_class input.some_other_class')); 

Но что, если селектор просто $(this) где this является Dóm элемент внутри метода JQuery. Должен ли я беспокоиться о создании ссылки на $(this) и повторное использование ссылки или я могу создать несколько селекторов $(this) и ожидать подобную производительность?

ли следующие

var jSel = $(this); 
    some_function1(jSel); 
    some_function2(jSel); 

значительно быстрее, чем следующий?

some_function1($(this)); 
    some_function2($(this)); 
+2

[Кэширование $ (это) в JQuery] (http://jsperf.com/caching-this-in-jquery/4) или [$ (это) vs var xxx = $ (this)] (http://jsperf.com/this-vs-var-xxx-this) ([jsperf.com] (http://www.jsperf.com)) –

ответ

5

Является ли следующее значительно быстрее следующего?

No. Это микроскопически быстрее; в сферах всего за несколько микросекунд.

Остановите ли вы присвоение результата переменной и с помощью этого? No. Использование переменной может дать больше смысла тому, что this есть, и ее легче вводить. Плюс, если вы перестали хотеть работать на $(this), а вместо этого захотелось $(this).next(), вы должны изменить его в одном месте, а не n.

Вы найдете конструктор jQuery: высоко оптимизирован для приема одного элемента DOM в качестве параметра. Ниже приводится the exact code, что запускается на выполнение при вызове $(DOMElement) (after the jQuery object has been created, конечно):

var match, elem, ret, doc; 

// Handle $(""), $(null), or $(undefined) 
if (!selector) { 
    return this; 
} 

// Handle $(DOMElement) 
if (selector.nodeType) { 
    this.context = this[0] = selector; 
    this.length = 1; 
    return this; 
} 

// Handle lots of other param types, but we hit the above one, so we've stopped now... 
1

this является ссылкой на объект. Использование $(this) занимает немного времени (из-за того, что jQuery превращает его в массив), но на этот раз не имеет значения ИМХО. Поэтому первый метод должен быть немного быстрее, но на самом деле вы не заметите разницы.

2

Все зависит от того, сколько звонков вы совершаете. Конечно, быстрее установить переменную, равную чему-то, что работает, чем продолжать делать ту же работу, но разница будет крайне незначительной в вашем примере. Если вы делаете это в цикле в 5 миллионов, разница будет менее незначительной, и установка переменной будет быстрее, поскольку она работает только один раз, а не 5 миллионов раз.

2

В данном конкретном случае, если вы действительно писать функции, которые ожидают объект JQuery в качестве параметра (как в ваших примерах), вы можете просто переписать эти функции как методы jQuery. Тогда вы можете написать:

$(this).some_function1().some_function2(); 

Очень легко написать методы jQuery, по крайней мере, простые.Общее (опять же, простая) форма:

jQuery.fn.some_function = function() { 
    return this.each(function() { 
    // stuff you want to do 
    }); 
}; 
+0

Да, я дать согласие. Но я хотел, чтобы мой пример был прост, поскольку расширение jQuery не было в центре внимания. – steampowered

+0

Хорошо, в общем, для вызова функции требуется больше времени, чем вызов функции. Таким образом, кеширование результата '$ (this)' сэкономит небольшое количество времени. Стоит ли это того, что это зависит от вас. Для меня кеширование '$ (this)' стоит того, чтобы ясность, которую он вводит, особенно если вы придаете ценности доброе имя. – Pointy

+0

Вы всегда кэшируете '$ (this)' или иногда? – steampowered

1

http://jsperf.com/jquery-cache-vs-no-chace

должен дать вам общее представление о разнице скорости. В большинстве простых случаев это, вероятно, не повлияет на скорость выполнения кода заметно, но где JS является узким местом, каждый бит помогает +, это всегда лучший выбор, чтобы сделать хорошие практики рутиной!

Смежные вопросы