Если вам нужно получить время выполнения функции на вашем локальном компьютере разработки , вы можете использовать инструменты профилирования вашего браузера или консольные команды, такие как 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
ANDT Date.now()
есть. Исключением является то , что Date
и now()
времена не смешиваются, так как Date
основан на Unix-эпохи (количество миллисекунд с 1970 года), в то время как now()
это число миллисекунд , прошедших с вашей страницы навигации началась (так он будет гораздо меньше , чемDate
).
Вот пример того, как использовать now()
:
function a() {
var start = window.performance.now();
... do stuff ...
var end = window.performance.now();
var dur = end - start;
}
now()
поддерживается в стабильных Chrome, 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 (который я написал).