Неэффективные предупреждения об использовании jQuery в среде PHPStorm

Недавно я обновил мою версию PHPStorm IDE, и теперь она предупреждает меня о неэффективном использовании jQuery.

Например:

var property_single_location = $("#property [data-role='content'] .container");

Подсказывает это предупреждение:

Проверяет, что селектора jQuery используются эффективным образом. Это предполагает для разделения селекторов-потомков, которые предваряются с помощью селектора идентификаторов и предупреждает о дублированных селекторах, которые могут быть кэшированы.

Итак, мой вопрос:

Почему это неэффективно и каков эффективный способ сделать этот селектор выше?

Я бы предположил:

var property_single_location = $("#property").find("[data-role='content']").find(".container");

Правильно ли это?

Ответ 1

У меня был такой же вопрос сегодня, и я смог найти решение благодаря Скотт Косман здесь.

В основном ответ заключается в том, чтобы выбирать идентификаторы отдельно, а затем использовать .find(...) для чего-либо ниже. Итак, возьмем ваш пример:

$("#property [data-role='content'] .container");

Изменение этого параметра делает PhpStorm счастливым и может быть более чем в два раза быстрее:

$("#property").find("[data-role='content'] .container");

Ответ 2

Я считаю, что разница между двумя методами при использовании последних версий jQuery и браузеров незначительна. Я построил тест, который показывает, что теперь на самом деле на 10% быстрее выполнять комбинированный селектор, а не выбор на id, а затем найти для очень простого случая:

http://jsperf.com/jquery-find-vs-insel

Для выбора нескольких дочерних элементов по классам на любой глубине "поиск" выглядит быстрее:

http://jsperf.com/jquery-find-vs-insel/7

Об этом было обсуждено на форумах jQuery, но его 3 года: https://forum.jquery.com/topic/which-jquery-selection-is-efficient Как они отмечают здесь, если вы выполняете много операций с одним и тем же селектором id, наибольшее улучшение производительности достигается путем кэширования элемента верхнего уровня. С другой стороны, если вы выполняете только несколько вариантов, практически не будет разницы в производительности.

Поэтому я считаю, что IntelliJ преувеличивает важность этого стиля кода.

Ответ 3

Первый вопрос - нажать Alt + Enter и выбрать первый совет в списке, а затем нажать Enter, вы увидите, что он считает самым эффективным способом.