Подтвердить что ты не робот

Вызов метода быстрее, чем получение чего-то из памяти

Итак, это мой вопрос: Почему вызов метода быстрее, чем извлечение из памяти?

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

Так как пользовательские агенты уже ссылаются на все элементы, которые имеют свой атрибут id, зачем мне нужно использовать document.getElementById("")?

В приложении я бы:

//Retrieving the value, I could possibly write this two way.
<script>
var fromGlobalScope = myElement.value;
var documentGetById = document.getElementById("myElement").value;
</script>


<input id="myElement" value="someValue" />

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

Однако я мог просто написать:

<script>

//See if the element is on the global scope.
var fromGlobalScope = myElement ||document.getElementById("myElement");

</script>

Я считаю, что шаблон правильно, я могу автоматически ссылаться на все элементы, имеющие атрибут id. Мне не нужно вызывать document.getElementById();

Используя свойство-резидент, и мне не пришлось бы ходить по DOM, подумал бы, что будет хорошая производительность.

Я создал jsPerf, чтобы увидеть преимущество: введите ссылку здесь

Мое удивление заключалось в использовании document.getElementById() было намного быстрее?

Итак, это мой вопрос: Почему вызов метода быстрее, чем извлечение из памяти?

Используя document.getElementById, я бы назвал метод, который может или не может проходить DOM. По крайней мере, я буду вызывать адрес для значения.

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

У меня есть результаты jsPerf ниже: enter image description here

Я создал еще один jsPerf с другой мыслью: явно задает свойство объекта окна

Тем не менее, я все еще верю, что научился тому, почему может помочь с механиками, которые играют, что может привести к чему-то полезному.

4b9b3361

Ответ 1

От спецификация HTML5

5.2.4 Именованный доступ к объекту Window

Интерфейс Window поддерживает именованные свойства. Поддерживаемое свойство имена в любой момент состоят из следующего, в порядке дерева, игнорируя более поздние дубликаты:

  • имя контекста просмотра любого дочернего контекста просмотра активного документа, имя которого не является пустой строкой,
  • значение атрибута содержимого имени для всех элементов a, applet, area, embed, form, frameset, img и object в активном документе, которые имеют непустой атрибут содержимого имени, и
  • значение атрибута содержимого id любого элемента HTML в активном документе с непустым атрибутом содержимого id.

Таким образом, браузер, вероятно, будет ходить по дереву DOM для разрешения именованного свойства. В отличие от getElementById() просто нужно посмотреть id в (например) хэш-карте.

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