游戏DrawCall分析利器-SpectorJS使用入门

1、什么是DrawCall

一个DrawCall就是CPU向GPU发送一次绘制命令，例如，某个场景的DrawCall是80，代表该场景每个渲染帧内GPU需要绘制80次。每一次DrawCall都需要传输纹理、顶点数据以及渲染上下文切换，是非常消耗性能的操作，DarwCall过高会直接影响游戏的整体性能，带来卡顿、CPU占用率高、设备发烫等问题。所以游戏的DrawCall越低越好，应该尽可能多的将节点数据合并，减少提交和绘制次数。

如果发现DrawCall已经过高，如何判断哪些DrawCall是可以合并的呢？Web端有个强大的工具 SpectorJS，可以很方便的查看当前渲染状态、DrawCall等信息，以可视化的方式来帮助分析。（ SpectorJS的作者也是微软开发的WebGL引擎 BabylonJS的开发者）

2、安装SpectorJS

SpectorJS工具提供了npm模块、Chrome扩展程序等多种安装方式。本文以Chrome扩展程序为例。

通过 Chrome浏览器的菜单，进入“扩展程序”界面，输入“Spector”，然后安装即可，如下所示。提示：如果你未搜索到Spector，请科学上网:)

3、使用SpectorJS

3.1

SpectorJS安装完成后，Chrome浏览器的地址栏右侧将会出现一个红色小图标，如下所示。