JavaScript性能监控器

JavaScript性能监控器

简介

stats.js是一个JavaScript性能监控器。

这个类提供了一个简单的信息框，帮助您监控代码的性能。

---

检测参数说明

• FPS 帧渲染的最后一秒。数字越高越好。
• MS 渲染一帧需要毫秒。数字越低就越好。
• MB 分配的内存字节。（运行铬-启用精确的内存信息）。
• CUSTOM 用户定义的面板支持。

Screenshots（图片来自github）

---

实践

• github：https://github.com/mrdoob/stats.js
• cdn：http://cdn.bootcss.com/stats.js/r16/Stats.js

用法：

var stats = new Stats();
stats.showPanel(0); // 0: fps, 1: ms, 2: mb, 3+: custom
// Align top-left
stats.domElement.style.position = 'absolute';
stats.domElement.style.left = '0px';
stats.domElement.style.top = '0px';
document.body.appendChild(stats.domElement);

function animate() {
    stats.begin();
// 监控代码写这里

    stats.end();
    requestAnimationFrame(animate);
}
// 此为测试效果，当有监控代码时，需改成animate();
requestAnimationFrame(animate);