Почему querySelector ('# id') не отображается на document.getElementById ('id')?

Question

В последнее время у меня повышается производительность селекторов, и меня беспокоит, что браузеры, в которых в настоящее время реализован API селекторов, не используют document.getElementById при передаче простого #id.

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

Есть идеи?

Answer 1

Сделав мой комментарий выше, я решил выполнить:

Из Node.cpp в источнике Chromium

if (strictParsing && inDocument() && querySelectorList.hasOneSelector() && querySelectorList.first()->m_match == CSSSelector::Id) {
    Element* element = document()->getElementById(querySelectorList.first()->m_value);
    if (element && (isDocumentNode() || element->isDescendantOf(this)) && selectorChecker.checkSelector(querySelectorList.first(), element))
        return element;
    return 0;
}

Так что отображает карту на getElementByIdПросто анализ строки в поиске селекторов - дорогостоящая операция.

Answer 2

ТВН.потеря производительности незначительна ... Я действительно сомневаюсь, что вы будете делать 100 000 просмотров в секунду, если вы это сделаете, то производительность QSA на самом деле является последней вещью, на которую вы должны смотреть.

Что касается того, почему,добавление дополнительного if / else может сделать поиск идентификаторов более производительным, но тогда другие селекторы css будут немного (все еще незначительными) медленнее.Зачем оптимизировать QSA, чтобы справиться с поиском идентификаторов, когда есть специальный метод, который в любом случае делает это намного быстрее.

В любом случае, браузеры стремятся к скорости и пропускают такие вещи, что делает графики общей производительностинамного лучшеВ этой гонке тестов ДЕЙСТВИТЕЛЬНО это примерно каждую миллисекунду, но для разработчиков ... будьте реалистичны, другие тесты важнее, производительность QSA больше не должна быть фактором.

Что касается удобства разработчика,это работает, это все еще так быстро, что вы не заметите этого в реальных приложениях (я призываю вас показать мне, где он ВИЗУАЛЬНО заметен, хотя по-прежнему является вменяемой программой; o).

Answer 3

Я сравнивал getElementById() и querySelector() и обнаружил, что кто-то уже сделал сравнение производительности и расчеты .

Это выглядит так, как будто querySelector() выигрывает каждыйвремя ... и на значительную сумму .

Answer 4

Может быть потому, что если бы они это сделали, им пришлось бы добавить проверку, чтобы увидеть, будет ли это простой запрос идентификатора (без модификаторов), который замедлит каждый другой запрос? Это может быть не огромный удар по производительности, но сложно говорить другим разработчикам.

Я думаю, что если вы беспокоитесь об этом, вы можете добавить функцию, подобную getObByID, которая проверяет документ, getElementById, использует его, если он существует, иначе использует селектор. Возможно, разработчики не чувствуют необходимости добавлять этот тип абстракции, когда вы можете легко сделать это самостоятельно, и разработчики должны были бы не забыть использовать его и увеличить кривую обучения.