Если вам нужно получить время выполнения функции на локальном компьютере разработчика , вы можете использовать инструменты профилирования вашего браузера или консольные команды, такие как console.time()
и console.timeEnd()
.
Все современные браузеры имеют встроенные профилировщики JavaScript. Эти профилировщики должны давать наиболее точные измерения, поскольку вам не нужно изменять существующий код, что может повлиять на время выполнения функции.
Для профилирования вашего JavaScript:
- В Chrome , нажмите F12 и выберите вкладку Профили , затем Соберите профиль ЦП JavaScript .
- В Firefox , установите / откройте Firebug и нажмите кнопку Профиль .
- В IE 9 + , нажмите F12 , нажмите Script или Profiler (в зависимости от вашей версии IE).
Кроме того, на компьютере разработчика вы можете добавить инструментарий к своему коду с помощью console.time()
и console.timeEnd()
. Эти функции, поддерживаемые в Firefox11 +, Chrome2 + и IE11 +, сообщают о таймерах, которые вы запускаете / останавливаете с помощью console.time()
. time()
принимает заданное пользователем имя таймера в качестве аргумента, а timeEnd()
затем сообщает о времени выполнения с момента запуска таймера:
function a() {
console.time("mytimer");
... do stuff ...
var dur = console.timeEnd("myTimer"); // NOTE: dur only works in FF
}
Обратите внимание, что только Firefox возвращает истекшее время в вызове timeEnd()
. Другие браузеры просто сообщают результат на консоль разработчика: возвращаемое значение timeEnd()
не определено.
Если вы хотите получить время выполнения функции в диком виде , вам придется обрабатывать свой код. У вас есть пара вариантов. Вы можете просто сохранить время начала и окончания, запросив new Date().getTime()
:
function a() {
var start = new Date().getTime();
... do stuff ...
var end = new Date().getTime();
var dur = end - start;
}
Однако объект Date
имеет разрешение только в миллисекундах и будет зависеть от изменений системных часов любой ОС. В современных браузерах есть лучший вариант.
Лучшим вариантом является использование High Resolution Time , он же window.performance.now()
. now()
лучше, чем традиционный Date.getTime()
в двух важных аспектах:
now()
- это двойное с субмиллисекундным разрешением, которое представляет количество миллисекунд с начала навигации по странице. Возвращает количество микросекунд в дробной части (например, значение 1000.123 равно 1 секунде и 123 микросекундам).
now()
монотонно увеличивается. Это важно, поскольку Date.getTime()
может возможно переходить вперед или даже назад при последующих вызовах. В частности, если системное время ОС обновляется (например, синхронизация атомных часов), Date.getTime()
также обновляется. now()
гарантированно всегда будет монотонно возрастать, поэтому на него не влияет системное время ОС - оно всегда будет временем настенных часов (при условии, что ваши настенные часы не атомарны ...).
now()
можно использовать практически в любом месте, где new Date().getTime()
, + new Date
и Date.now()
. Исключением является то, что Date
и now()
раз не смешиваются, поскольку Date
основано на unix-epoch (число миллисекунд с 1970 года), тогда как now()
- это число миллисекунды с момента запуска навигации по вашей странице (поэтому она будет намного меньше Date
).
Вот пример использования now()
:
function a() {
var start = window.performance.now();
... do stuff ...
var end = window.performance.now();
var dur = end - start;
}
now()
поддерживается в Chrome stable, Firefox 15+ и IE10. Также доступно несколько полифилл .
Еще одна опция для измерения времени выполнения в дикой природе - UserTiming . UserTiming ведет себя аналогично console.time()
и console.timeEnd()
, но использует ту же метку времени с высоким разрешением, которую использует now()
(так что вы получаете монотонно увеличивающиеся часы на миллисекунды), и сохраняет метки времени и длительности в PerformanceTimeline .
UserTiming имеет понятия метки (метки времени) и меры (длительности). Вы можете определить любое из них, сколько хотите, и они отображаются на PerformanceTimeline .
Чтобы сохранить метку времени, вы звоните mark(startMarkName)
. Чтобы узнать продолжительность с момента первой отметки, просто позвоните measure(measurename, startMarkname)
. Затем продолжительность сохраняется в PerformanceTimeline вместе с вашими отметками.
function a() {
window.performance.mark("start");
... do stuff ...
window.performance.measure("myfunctionduration", "start");
}
// duration is window.performance.getEntriesByName("myfunctionduration", "measure")[0];
UserTiming доступно в IE10 + и Chrome25 +. Также имеется polyfill (который я написал).