Какова стоимость производительности для поддержания живого HTMLCollection? - PullRequest
0 голосов
/ 24 декабря 2018

Часть моего внешнего JS-кода зависит от действующей HTMLCollection нескольких тысяч DOM-узлов.Поскольку он активен, он обновляется автоматически при обновлении DOM.

Это то же самое, что повторный запуск вызова document.getElementsByClassName каждый раз, когда я изменяю DOM, или есть внутренняя оптимизация производительности

1 Ответ

0 голосов
/ 24 декабря 2018

В этом блоге объясняется небольшая разница между статическими и живыми NodeLists и упоминается, как реализованы живые коллекции.

Живая коллекция не имеет доступа к DOM, покавы получаете доступ к его элементам.В это время он создает актуальную коллекцию и кэширует ее.Нет никаких накладных расходов на будущие обращения, если DOM не изменится.

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

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

Возможно, что могут быть дополнительные оптимизации, которые могли бы смягчить это.Для некоторых типов живых коллекций механизм JavaScript может определить, может ли конкретная модификация DOM повлиять на него;если нет, это не должно сделать недействительной коллекцию.Например, коллекция, созданная с помощью document.getElementsByClassName(), не будет затронута модификацией, которая нигде не добавляет и не удаляет указанный класс.Однако, если вы сделаете что-то вроде удаления элемента, он должен будет проверить, появился ли класс где-нибудь в поддереве, возглавляемом этим элементом, поэтому не очевидно, что это действительно лучше, чем просто аннулирование кэшей.

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