2010-4-19 作者:大灰狼堡森 《dynaTrace Ajax 教程 – 进阶篇》 大灰狼系列分享 1 《dynaTrace Ajax教程 – 进阶篇》 | 2010/4/19 《dynaTrace Ajax 教 程 – 进 阶 篇 》 大 灰 狼 系 列 分 享 PRE 在dynaTrace Ajax 使用指南-基础篇中，我们对dynaTrace 主要的功能进了一番介绍，在进阶篇中，我们将更深层的去了解如何使用dynaTrace 来分析更底层的问题，这将会对JavaScript 开发、调试和性能测试大有帮助。 说明 因环境差异每次追踪文件都会不同，为了保证本教程内所有内容一致行，请将本教程附带的step_by_step_google.dtas 文件通过 Import Session 导入，如下图： TimeLine 视图 – 进一步查看页面生命周期事件 打开TimeLine视图的方式很简单，我们可以通过双击左边树形菜单的TimeLine 节点来打开包含整个 session 所有信息的TimeLine 视图，如下图。 如果你只想查看某个 URL 的TimeLine，右键点击该 URL 后选择 Drill-Down TimeLine，如下图。 2 《dynaTrace Ajax教程 – 进阶篇》 | 2010/4/19 这将会打开针对于某个URL 请求的TimeLine 视图，并且会自动分开显示不同域（domain）的网络请求。在工具栏和上下文菜单中，你可以开启一些可选选项，比如内容类型着色、JavaScript 触发器或显示附加的事件（如鼠标移动、鼠标点击、键盘按键等）。在下图中就是一个带有附加选项的TimeLine 视图： 在这个视图中，我们可以了解到： 网络请求是并行从 6 个不同的域中下载的。 在onLoad 事件触发前使用了 6.5s(通过小 IE 标志能看到) 从 maps.gstatic.com 下载的main.js 用了 2.42s（鼠标停留在上面会有更详细的资料） 紧接着main.js，我们可以看到，脚本实际运行时间是 1.1s，期间有两个下载（1s，红色线JavaScript 行）和2 个附加的JavaScript 执行（2s） CPU 行显示了运行期间 CPU 的使用情况 事件行显示了我们的鼠标点击事件、XmlHttpRequest 事件和onUnload 事件有关信息。 首先让我们放大从第一次鼠标点击到 XmlHttpRequest 请求之间的TimeLine。在这个例子中就是从 11s 到 12s 之间的部分（从 JavaScript 行绿色的那条开始，之后在Netw ork 行相对较长的蓝色线表示XmlHttpRequest 请求，鼠标悬停上去有详细信息哈）。这里教大家一个小技巧，在实现线 3 《dynaTrace Ajax教程 – 进阶篇》 | 2010...
