开始使用Adobe Scout(上)

转自:http://blog.sina.com.cn/s/blog_6bfa2fc10101bqn5.html

开始使用Adobe  Scout

http://www.adobe.com/devnet/flashruntimes/articles/adobe-scout-getting-started.html 

ADOBE SCOUT是下一代为桌面和移动端的FLASH内容分析的工具,它可以让你从内部观察flash的运行,这在过去是不可能的。更棒的是,它真的非常简单非常容易上手,没有复杂的安装步骤。

在过去,你可以用FLASH BUILDER   PROFILERACTIONSCRIPT的代码级别观察FLASH 的运行,但所有FLASH PLAYER的内容操作对你来说是隐藏起来的。如果你在渲染或不正确地使用了某个api时,原来的分析器不可能指出你的错误,因为你不能看到在场景后面发生了什么。

SCOUT通过收集正在进行的内部数据解决了这个问题。它帮你明白你的代码如何和运行时交互,因此你可以真正发现执行时错误的根源。

 

ADOBE SCOUT 是如何工作的

SCOUT依赖telemetry 功能,这个功能在Flash Player 11.4   Adobe AIR 3.4中引入的。该功能在ACTIONSCRIPT代码执行的同时收集FLASH运行时的内部的详细信息,并且把它发送给SCOUTSCOUT再把它清晰地简明地图形地呈现出来,因此你可以快速的诊断执行时的错误。

 开始使用Adobe Scout(上)_第1张图片 

SCOUT不需要DEBUG版本的FLASH PLAYER,这意味着你可以用发行版的环境,在用户最终运行的swf和网页中分析你的内容。再重要的是,SCOUT以快速的分析你的内容,因些,你可以更加关注用户体验时执行的问题。

SWF中开启高级的telemetry 功能

你不必作任何特殊的事来开启SCOUT,仅仅是在SCOUT运行时运行你的swf你就可以看到一个新的会话出现了,并且数据传了进来。但默认的状态下swf仅仅为scout提供了一些最基本的信息,为了得到所有可以得到数据,如ACTIONSCRIPT代码的信息,渲染时显示列表的详细信息,STAGE3D信息,你需要在swf文件中打开 advanced telemetryADOBE不默认暴露这些信息的原因是防止一些人用scout轻松的得到你的flahs内容的详细信息。尽管这样别急,开启这个功能很简单,SCOUT已经提供。

有几个不同的方式开启advanced telemetry.

使用Flash Builder 4.7

最简单的方式开启advanced telemetry.ADOBE推荐的,它内置了SCOUT的支持。4.7有新的ACTIONSCIRPT编译选项开启advanced telemetry.。选择 EnableDetailed Telemetry如下图

 开始使用Adobe Scout(上)_第2张图片

使用Flash Professional

如果你在使用Flash Professional,没有集成可视的选项,在下个版本中ADOBE会加入,但同时你可以下载使用PYTHON脚本(add-opt-in.py) https://github.com/adamcath/telemetry-utils. 如果你还没在安装PYTHON,访问http://python.org 。然后你仅仅运行add-opt-in.py  对你的swf里就可以了。这个方法对已存在的swf或不方便再编译的swf

已开启advanced telemetry.的例子

  Hungry Hero (Starling) http://www.hungryherogame.com

  Feathers Components Demo (Feathers) http://feathersui.com/examples/components-explorer

  Invawayders (Away3D) http://awaymedia.co.uk/projects/invawayders/Main.html

  Back yard

Demo (Coppercube) http://www.ambiera.com/coppercube/demo.php?demo=backyard&mode=flash 

仅需要打开scout,访问上述链接。

本地和远程分析

使用SCOUT需要下面的组件

 

  Flash Player 11.4 (plugin  or standalone) or Adobe AIR  3.4.

  Adobe  Scout 

如果你正分析的内容和scout在同一台机器上,上面的已经够了,只需要打开scout,运行swf就可以了。

你也可以在不同的机器上分别运行scoutswf,这叫远程分析。这样的情况很普遍:

  一个桌面机器正在运行swf,但另一台电脑运行SCOUT。这非常有用对于debug一个远程项目或对于不能运行scout的机器来说。

  一个移动设备正运行相应的内容,另一台电脑运行scout。这对于开发移动项目来说是非常有用的,因为你需要调整执行效果在特定的设备上。

对桌面内容的远程分析

如果你正运行你的内容在另一台机器,你可以控制Flash telemetry 数据到任何一台正在运SCOUT的机器。你需要创建一个叫.telemetry.cfg的文件在运行flash内容的机器上,它的位置依赖于你的操作系统。

  MacOS: ~/.telemetry.cfg

  Windows: %HOMEDRIVE%%HOMEPATH%\.telemetry.cfg

注:如果你的内容在chrome里运行,在文章最后有一列表被频繁问道的问题。

假设SCOUT运行在192.168.1.20:7934,为了连接到它,文件内容是这样的

TelemetryAddress=192.168.1.20:7934

SamplerEnabled = true

CPUCapture = true

DisplayObjectCapture = false

Stage3DCapture = false

 

上面后四行响应了scout中的“新会话的设置”,但需要在这里重点指出的是你必须手动输入这些如果你在进行远程分析。你进行配置之后,只需要运行你的内容,它就会出现在scout里。

 

为移动设备远程分析AIR

在应用Scout Companion的帮助下移动设备的配置已经变得非常简单了,对IOS ANDROID的都已经可以下载了。下载安装之后,你可以使用你本地的SCOUT了,然后在SCOUT里配置想要接收哪些数据。

使用Scout Companion时注意

  确保的你设备和电脑连接在相同的网络里,登陆Scout Companion,它会寻找运行SCOUT的电脑,它会显示一系列运行scout中的电脑。

  当你电脑的名子出现时,点击它 

  SCOUT桌面里,选择你想接收的数据,你会看见它会反应在Companion 

  登陆你的AIR应用,你会看见多了一个新的会话

 开始使用Adobe Scout(上)_第3张图片

scout中开始新的会话

如果你在运行本地的flash 内容,或者跟着上面的指导作的,那么你已经开始分析了。只需要登陆你的内容,一个新的会话就会出现在SCOUT中,你的内容可以是安装了标准版本player的浏览器中,或者通过AIR。当你看到一个有很多颜色的图表出现就说明它开始工作了。

Flash Player 只是开始运行的时候检查是否有scout在运行,如果flash player 已经运行后启动scout,那么你必须重新启动你的内容。在屏幕左边,你一系列打开的会话,会显示出swf文件的名子和它的域。如果你想新的数据传进来,只需要点击红方块。如果你把你的flash 内容停止后,会话会自动停止。

 开始使用Adobe Scout(上)_第4张图片

默认情况下,所有你加载的flash 内容会在SCOUT中开始一个新的会话。这使得启动分析非常简单,但如果你同时在浏览器中打开其它的flash 内容也会被加载进来这令人非常讨厌。

为更好的控制,你可以告诉scout过虑掉你不想要的会话。如果你点击过虑图标,scout仅会开始和选择的那个swf有相同名子的会话。这意味着你可以在浏览器上访问各种内容而你选择的那个会话不会在列表中沉下去,而一旦你开始具有相同名的swfscout又能开始新的会话。

 

 开始使用Adobe Scout(上)_第5张图片

 

设置新的会话

现在你可以在scout里开始一个新的会话了,你可以开始考虑什么样的数据你想收集。在屏幕的左边所有会话之上你可以看到有一个叫“新会话的设置”标签。这代表你可以flash player 传递不同数据过来。注意一些scout的功能只有收集到相关数据时才会工作。

 开始使用Adobe Scout(上)_第6张图片

开始一个新的会话前,检查这些收集数据选择项,因为会话开始之后就不能改变了,事先考虑好你需要观测的数据非常重要。如果你对执行的观测如在某个函数上的时间花费感兴趣,仅需要收集低功效的数据。如果你索性将所有数据都收集起来,定时传过来的数据可能不准确,因为flash player 不得不收集额外的工作来收集和传送数据。

这里有一条简明的策略: 

  基本的遥测是一直都被允许的,它提供关于flash player 正在持续工作的信息,和CPU显存的一些基本信息。

  ACTIONSCRIPT采样器通过定期的调用栈的快照测量执行你的代码的时间花费。它种方式效率比较低,因为它使用statistical sampling,如果你用足够长的一段时间观察采样器,它能准确指出哪些函数花费大量时间。

  CPU使用状态会定期测量操作系统报告的FLASH PLAYERcpu的消耗。它和MAC的活动监视器或windows的任务管理器看到的恰好一样。

  显示列表渲染的详细信息会提供正在渲染的可见的展示在屏幕上的所有对象的详细分解。它会让你知识屏幕的哪个区域花费大量时间渲染。

  STAGE3D记录捕捉每一条STAGE3D的命令,因些你可以在scout里重复单步测试它们。由于非常容易在几分种里产生GB级的数据,你可以在选择记录模式时选择延时,它让你在捕获STAGE3D数据时开始统计。记住,开启任何除基本遥测信息之外的类别,你的swf必须打开advanced telemetry 

使用scout分析

Scout用户界面设计的很简单高效的去用。有很多可视化的功能使用明白数据并过滤掉不需要的信息,这样你可以快速的发现执行时的问题所在。界面有很多不同的面板,乍一看有点压抑,但当你得知每一个部分的详细信息你就会明白它们是如何合理的组织在一起的

 开始使用Adobe Scout(上)_第7张图片

面板可以通过简单的拖拽tab 就可以重新设置位置。如果你关闭一个面板,你可以在window菜单里再次打开。一个具体的布局被叫作工作空间,你可以在window菜单保存并切换工作空间。

你可以隐藏左边的显示会话列表的侧边栏,通过点击折叠按钮

 开始使用Adobe Scout(上)_第8张图片

最重要的面板是帧和时间轴,就是在最中心的图表。它展示了你的swf每一帧的时间花费的分解,包括的内存使用情况和事件情况。

为了使一个会话中导航更方便,屏幕最上面展示了一个放大的帧时间轴示图。由于它使你看到了整个会话中峰值的所在,所以被叫作会话概况。

 

会话概况

如果你想跳到某一个时间或会话,如一个大峰值时,简单的在点击会话概况中相应的部分,默认下,你会看到一个图表展示每一帧的时间花费,但你可以右键它着其它额外的图表。如

下图所示。

 开始使用Adobe Scout(上)_第9张图片
开始使用Adobe Scout(上)_第10张图片 

这些和帧和时间轴上看到的图表是一致的,并且在整个会话过程中你可以选择他们中的任意得到这种图表的全部视图。这在最后监视整个过程中的内存使用特别有用。例如,如果你运行你的程序足够长时间,一个非常慢的内存泄露可以很清晰的在会话概况的图表中看到。

 

帧和时间轴

scout里最主要的用于定位执行问题的面板是帧和时间轴。在面板最上面的图表里显示了帧时间轴,把整个会话分解为各个单独的帧,并且显示了每一帧消耗的时间

 开始使用Adobe Scout(上)_第11张图片
 

最需要注意的是红色的线。它代表在程序中设定的fps 下预定的每帧执行时间。例如一个swf fps30帧,那么预定的执行时间就是33ms,也就是说如果每帧花费走过33ms,你的程序会变得卡,这是真的不想发生的。

上图清晰的展示了哪一帧超过预算时间并且需要注意。你可能好奇为什么红色的线会变,因为在你的程序动态的改变了framerate.

下面需要注意的是帧时间轴图表上的颜色是变化的。每一个颜色代表执行时不同的活动,所以你可以看到每一帧上最花费时间的是什么。

  蓝色  执行as

  绿色  显示列表渲染

  黄色  网络和视频

  橙色  其它(垃圾处理,事件处理等等)

 

不用记住这些颜色的含意。右边的总结面板会显示每种颜色的含义。当你鼠标移到某一个条上时也会出现相应的提示,如下图。

 开始使用Adobe Scout(上)_第12张图片

在帧和时间轴面板里还有其它几种图表。CPU监控一目了然,需要注意的是多核的cpu使用可能超过100%。内存分解反应了相应执行活动的内存使用,颜色的含义和上面一样。

通过点击开关按钮你可以选择显示哪个面板。

如果你点击事件,你会看到事件轨道在内存图表下弹出。每一个水平轨代表一种具体类型的事件,高亮度的蓝色条告诉你有多少事件在这帧发生。


事件轨道如下

 

  鼠标  有多少鼠标事件发生

  键盘  有多少键盘事件发生

  网络  有多少网络io 操作发生

  定时器  timer 类正在被使用

  渲染  是否正在渲染

  Trace 事件  在你的as代码里是否有trace()函数被调用。

正如你所看到的,帧和时间轴面板让你快速发现你应用的热点,识别哪里花费了大量的时间并且为什么花费这么多时间。

 

总结面板

总结面板是对帧和时间轴面板中不同颜色的图表的描述,但它不只是图例的作用。你可以在帧和时间轴面板里点选或拖一系列帧。总结面板然后对这些帧进行统计,这样你可以看到这段时间里执行的整体情况。

下图展示了选择了两帧的总结面板。第一个要注意的是左上角的帧频率。图里只有1.8fps而起始设置的目标是24,因些帧频超过248%的预算时间。内容运行的不流畅,你肯定要知道发生了什么。

请看分解的时间,你可以看到最主要的时间是花费在as代码上。这暗示你可能想调查代码在作什么,然后去优化它。在scout里有其它的几个面板帮你作这件事,一会你会看到。注意,如果你点击右边齿轮状的icon,可以选择是显示全部时间还是每一帧的下平均时间。

 

假设,由于代码确实有问题,你可能想过滤掉其它的分类,以便专注在as代码的执行上。scout里有不同的颜色,这可能会使人分心,因些需要花几秒钟过滤掉你不想要的东西。点击as分类,你可以看到其它的分类变成灰色的了。更重要的是,帧时间轴也被过滤了,这样你可以看到每帧仅有as代码的图表。实际上,所有在scout里的颜色都被过滤了,这让你非常简单的专注在你关心的数据上。

 


在过滤的分类上再点一下,更详细的信息分类会展示出来。如下图 Bitmap 以更详细的分类 说明。

 

首要活动

首要活动面板展示了比总结面板更详细的关于flash player 内容所发生的内容的信息。它不是把时间分解成高级别的分类,而是展示了一个详细的活动的分解,如处理特殊事件。如下

 

右边的列反应了每个活动花费的时间和所在时间的百分比。在这个例子中,最花费时间的 54% 2279ms )花费在 enterframe 事件处理上,因此有必要去优化它。

 

活动序列

活动序列面板显示了哪个活动花费最多时间,但是它通常对查看每一个活动的精确序列非常有用。这是活动序列面板最主要的目的。不像首要活动面板那样统计很多个帧,活动序列面板只显示单帧的信息(否则就有太多的信息需要显示了)。

 

在活动序列面板里展示了简明的顺序和一帧中嵌套的活动。例如,在上图中,你可以看到92%的时间花费在处理enterframe事件上,并且这依次引起了gameObjectDie 事件,这个事件花费了61%的时间,你可以同时看到不少的垃圾回收在处理的时候发生和文本布局的更新。

默认情况下,活动花费少于0.5ms被过滤掉不显示在活动序列和首要活动面板里,这样你可以专心于最花费时间的操作上。你可以点击面板左上面的过滤按钮来选择是否过滤这些小活动。

注意这里的颜色含义和总结面板里的一样,这样你可以把不同面板里的内容联系起来。在总结面板里过滤一个类别也会在这两个面板里过滤掉相应的活动。


你可能感兴趣的:(Flash开发)