性能检测

概述

为了确保动效在不同设备上都能以稳定的帧率运行，避免卡顿和延迟，需要在动效上线前检查运行时的性能瓶颈，避免资源浪费和过度消耗。通过性能检测插件，开发者可以识别和解决潜在的性能问题。

基本使用

1、安装依赖

需要额外接入 插件（请确保插件版本号与 @galcean/effects 版本号一致）。

$ npm i @galacean/effects-plugin-stats --save

2、使用示例

import { Stats } from '@galacean/effects-plugin-stats';

// ...播放器创建代码
// player 为播放器对象
new Stats(player);
// ...业务代码

效果

如上图所示，从上到下分别表示帧率、内存占用（真机不生效）、绘制调用、三角面数、图片数量、Shader 数量、渲染程序数量、WebGL 版本（通常主要关注前四项）。画面稳定性看帧率，当帧率小于 30 时，画面会出现明显卡顿。其他不做强制要求，当然也是数量越少对动效流畅度越友好，当出现卡顿时，可以选择减少粒子数量、图层数量等缓解。

推荐指标

下面给出 Unity 在游戏中低高端画质推荐设置对应了动效中的中低高端机型设置。

进阶

你可以自定义 Stats 组件的 onUpdate 方法，用于在每帧更新时获取性能数据：

const stats = new Stats(player, { visible: false });
const [_, component] = await Promise.all([
  player.loadScene(json),
  stats.getComponent(),
]);

component?.monitor.on('update', data => {
  console.info(data);
});