После прочтения поста Стива Сойдерса о бесплатном инструменте — dynaTrace Ajax, я был дико заинтригован. Он предлагает полную анализ трассировки в IE6-8, включая JavaScript, прорисовку и сетевой трафик. Я протестировал несколько сайтов, но более интересный результат получил с тяжелым JavaScript'ом в Gmail в IE8.
Я обычно не пишу об инструментах анализа производительности, откровенно говоря, большинство из них абсолютно не предоставляют никакой интересной информации. dynaTrace предоставляет некоторую информацию, которую я до сих пор никогда не видел ни в одном инструменте, ни в одном браузере.
dynaTrace Ajax работает приклеиваясь, как низкоуровневый инструмент к Internet Explorer во время запуска, перехватывая любую активность, которую вы только можете представить. Я заметил небольшую медлительность во время работы браузера в режиме трассировки. Тем не менее, вся трассировачная информация записывается и сохраняется для дальнейшего анализа.
Выше в результате записанной сессии, авторизация в Gmail, чтения почты и завершения сеанса. Все аспекты сессии сохранены: сетевые запросы, JavaScript источники, все DOM события, и т.п.
Это полная временная шкала единичной загрузки входящей почты Gmail. Весь сетевой трафик, JavaScript парсинг и выполнение, события браузера, загрузка CPU.
Вы можете выбрать сегмент с временной шкалы и просмотреть детальнее.
Выше, вы видите четкую картину точных взаимодействий, которые произошли. Феноменальное количество выполнений inline JavaScript, завершенного вычислением расположения страницы совпадает с загрузкой данных по сети. Вы можете навести курсор мыши на определенные блоки во временной шкале для получения более детальной информации (например: был ли JavaScript запущен в результате выполнения таймера или какой Ajax запрос был вызван, который повлек за собой сетевой трафик). Вдобавок, вы можете нажать на блок для более глубокого «погружения» в трассировку.
Копая глубже в выполнении XMLHttpRequest на странице, мы увидим полный стек трассировки выполнения, и вот на этом месте, инструмент становится действительно интересным. Данный инструмент способен производить трассировку JavaScript через родной XMLHttpRequest, через сетевые запросы и вернуться обратно к событию, которое выстрелило, после выполнения запроса. Это потрясающе. Это первый инструмент, которые позволяет производить трассировку через родные методы, предоставляю картину, кто вызвал событие, а также полное разветвление всего что происходит, включая загрузку процессора и время выполнения.
Заметьте, что вы можете щелкнуть по любому куску кода в просмотре стека трассировки и увидеть его положение в исходном коде (и это работает даже после закрытия окна, весь код сохраняется для дальнейшего анализа).
Но самым большим вопросом при путешествии по трассировки обычно — где происходит снижение скорости работы? И в этот момент в игру вступает HotPath.
Выглядит все это как обычный счетчик выполнения, который вы видите в инструментах отладки Internet Explorer или Firebug, за исключением одной детали — данная форма, выводит время парсинга JavaScript и время прорисовки. Это круто! Ни один другой инструмент не предоставляет информации о времени, которое нужно для парсинга JavaScript кода вашего сайта или как долго он будет прорисовываться.
Вы можете просматривать не только время выполнения собственных JavaScript методов, но и встроенных DOM методов! На форме HotSpot вы можете отфильтровывать по DOM или JavaScript и увидеть, какие методы медленные.
dynaTrace предоставляет и дополнительный инструмент — PurePath, который пытается узнать проблематичные места в скриптах.
Еще один способ увидеть полную картину проблемных мест в вашем приложении.
Я уже использую данный бесплатный инструмент для тестирования и анализа производительности своего кода. Я думаю, что до этого времени ни один браузер не имел такого инструмента для анализа. Плюс учтите, что IE до сих пор считается доминирующим платформой для разработчиков.
Я списывался с разработчиками dynaTrace и попросил их добавить профайлер памяти и внедрить поддержку большего количества браузеров.
