Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[g]即使动画都停掉,requestAnimationFrame的调用不会停止 #1626

Closed
coredesign1234 opened this issue Jan 11, 2024 · 2 comments
Closed
Assignees

Comments

@coredesign1234
Copy link

单独在界面上使用canvas,或者做一次canvas的appendChild动作,requestAnimationFrame会不停止地被调用。定位代码如下:

Canvas.prototype.run = function () {
        var _this = this;
        var tick = function () {
            _this.render();
            _this.frameId = _this.requestAnimationFrame(tick);
        };
        tick();
    };

即使界面上什么元素都没有,这个函数也会不停调用

@coredesign1234
Copy link
Author

请协助优化一下,这个循环的调用会增加系统整体功耗

@xiaoiver
Copy link
Contributor

rAF 中的 render 方法内部会进行脏检查,如果画布中的图形未发生改变,是不会调用底层绘制方法的。

至于 rAF 循环的调用,Three.js 中也是这样使用的(参考文档中 Rendering the scene 一节):
https://threejs.org/docs/index.html#manual/en/introduction/Creating-a-scene

最后如果实在想手动调用 render 方法,可以覆盖掉 run 这个方法,然后在合适的时机手动调用。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants