博客添加实时显示FPS帧率代码

无心博客
2025-05-26 / 0 评论 / 18 阅读 / 正在检测是否收录...

网页上实时显示 FPS(每秒帧数)帧率,不知道有什么用,可能好的电脑才能看出区别吧。
5a961b7fdeb49e8d68024047473d11fd49230cef81a67a34504de680385da3f0.0.PNG

<script>
    jQuery(document).ready(function($){
    $('body').before('<div id="fps" style="position: fixed;right: 20px;color: #fff;line-height: 1;z-index:10000;padding: 5px 8px;"></div>');
    var showFPS = (function() {
        var requestAnimationFrame = window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame ||
        function(callback) {
            window.setTimeout(callback, 1000 / 60);
        };
        var e, pe, pid, fps, last, offset, step, appendFps;
        fps = 0;
        last = Date.now();
        step = function() {
            offset = Date.now() - last;
            fps += 1;
            if (offset >= 1000) {
                last += offset;
                appendFps(fps);
                fps = 0;
            }
            requestAnimationFrame(step);
        };
        appendFps = function(fps) {
            console.log(fps + ' FPS');
            $('#fps').html(fps + ' FPS');
        };
        step();
    })();
});
</script>
1

评论 (0)

取消