Страницы

Поиск по вопросам

четверг, 11 июля 2019 г.

Как определить на какие селекторы querySelectorAll тратит много времени?

Профайлер показывает, что значительное время тратится на выполнение querySelectorAll. Как определить, на каких именно селекторах наблюдается потяря производительности?


Ответ

Предложу экзотический метод. В JavaScript можно менять объекты "на лету". Причем изменению подвержены не только свойства, но и методы. Можно попытаться реализовать свой маленький профайлер с использованием "monkey-patching" техники:
document.querySelectorAll = (function() { var orig = document.querySelectorAll.bind(document), storage = {};
var query = function(s) { if (!storage[s]) { storage[s] = { totalTime: 0, count: 0 }; }
var start = performance.now(), res = orig(s), deltaT = performance.now() - start;
storage[s].totalTime += deltaT; storage[s].count++;
return res; };
query.getResults = function() { return storage; };
return query; })();
// Кусок, работающий с DOM document.querySelectorAll('.question div div a');
// Получаем информацию о том что и как долго работало console.dir(document.querySelectorAll.getResults());

Комментариев нет:

Отправить комментарий