Tag Archives: performance
Как Github логирует клиентские ошибки (Haystack)
http://githubengineering.com/browser-monitoring-for-github-com/ Ничего сверхнового в идеях нет, есть наглядная картинка:
Логирование времени загрузки страниц в piwik
В продолжение темы логирования ошибок в пивик. Неплохо было бы логировать в ту же систему и время загрузки страницы у реальных пользователей. Для этого в упомянутый в предыдущей статье логгер нужно добавить следующее:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 |
function logTimings() { setTimeout(function () { if (! window.performance || ! window.performance.timing) { return; } var timing = window.performance.timing; var perf = { dns_lookup: getTime(timing, 'domainLookupStart', 'domainLookupEnd'), ttfb: getTime(timing, 'requestStart', 'responseStart'), response: getTime(timing, 'responseStart', 'responseEnd'), dom_parse_and_js: getTime(timing, 'domLoading', 'domInteractive'), dom_ready_cbs: getTime(timing, 'domContentLoadedEventStart', 'domContentLoadedEventEnd'), to_dom_ready: getTime(timing, 'responseStart', 'domContentLoadedEventEnd'), to_load: getTime(timing, 'responseStart', 'domComplete') }; perf.type = 'timings'; perf.msg = perf.to_dom_ready; perf.ua = navigator && navigator.userAgent; perf.href = window.location.href; logToPiwik(perf); }, 5000); } function getTime(timing, from, to) { if (timing[from] && timing[to]) { return (timing[to] - timing[from]) / 1000; } return null; } |
И поправить window.onload на:
|
1 2 3 4 5 6 7 8 |
window.onload = function() { if (! window.__angularLoaded) { window.logError({type: 'app-not-started'}); } logTimings(); }; |
Подробнее об объекте window.performance.timing можно почитать тут — https://blog.bullgare.com/2014/12/%D0%BC%D0%BE%D0%BD%D0%B8%D1%82%D0%BE%D1%80%D0%B8%D0%BD%D0%B3-%D0%B7%D0%B0%D0%B3%D1%80%D1%83%D0%B7%D0%BA%D0%B8-%D1%81%D1%82%D1%80%D0%B0%D0%BD%D0%B8%D1%86%D1%8B-%D1%81-navigation-timing-api/ или сразу на mdn https://developer.mozilla.org/en-US/docs/Web/API/PerformanceTiming.
Мониторинг загрузки страницы с Navigation Timing API
Содержит следующие события: navigationStart unloadEventStart unloadEventEnd redirectStart redirectEnd fetchStart domainLookupStart domainLookupEnd connectStart connectEnd secureConnectionStart requestStart responseStart responseEnd domLoading domInteractive domContentLoadedEventStart domContentLoadedEventEnd domComplete loadEventStart loadEventEnd Поддерживается ie9+ и нормальными браузерами. Подробнее — https://developer.mozilla.org/en-US/docs/Web/API/PerformanceTiming и https://developer.mozilla.org/en-US/docs/Navigation_timing. Пример использования от Яндекса — Как мы измеряем скорость загрузки Яндекс.Почты