Производительность селектора jQuery

Question

У меня есть два следующих кодовых блока.

Кодовый блок 1

var checkboxes = $("div.c1 > input:checkbox.c2", "#main");
var totalCheckboxes = checkboxes.length;
var checkedCheckboxes = checkboxes.filter(":checked").length;

Кодовый блок 2

var totalCheckBoxes = $("div.c1 > input:checkbox.c2", "#main").length;
var checkedCheckBoxes = $("div.c1 > input:checkbox.c2:checked", "#main").length;

Что из перечисленного будет быстрее?

Спасибо

Рахул

Answer 1

Номер 1 будет немного быстрее, так как фильтр применяется к объекту, содержащему уже выбранные элементы. Номер 2 в основном выполняет один и тот же запрос селектора дважды, во второй раз, включая :checked выражение селектора.

На самом деле, разница в скорости между ними не будет демонстрацией:)

Я был бы склонен использовать

var checkboxes = $("#main").find("div.c1 > input:checkbox.c2");
var totalCheckboxes = checkboxes.length;
var checkedCheckboxes = checkboxes.filter(":checked").length;

Предоставление контекста, по сути, приведет к решению вышеизложенного, но было показано, что использование .find() оказалось более быстрым ( Я выкопаю ссылку, я думаю, это было в блоге Джона Ресига ).

Answer 2

Может быть, написать небольшой тест и сравнить его с помощью различных браузеров.

Answer 3

Если вам нужна производительность, не говорите так конкретно, если можете ее избежать.

Например, если вы можете позволить себе просто поиск класса 'c2', это должно улучшить скорость селектора.

$("#main").find(".c2")

должно быть самым быстрым решением.