画布动画的行为很奇怪，就像一个步长函数

我的意思是，帧块将以极快的速度执行，然后在块之间暂停很长时间（4-6k毫秒）

它被明确地定义为每隔42ms一个间隔。相反，在第一次调用之后，会有一个暂停，然后5-6次迭代会突然出现（您可以通过日志记录看到）。当它进行迭代时，它会正确地遍历子画面表，迭代不是每42ms1次发生一次。

只是在铬上测试，因为我稍后会把它插入Electron。但首先我必须弄清楚这一点。

这是js，只有html<canvas id="person1"></canvas>

var people = [];
    var p1_canvas = document.getElementById("person1");
    p1_canvas.width = 321;
    p1_canvas.height = 571;
    var p1_img = new Image();
    p1_img.src = "person1.png";
    var person1 = {x:0,y:0,f:1,max_x:3852-321,max_y:55958-571,canvas:p1_canvas,img:p1_img,width:321,height:571,name:"person1",playing:false};
    people[person1.name] = person1;
    function talk(person){
        if(!person.playing){return;}
        if(person.x == person.max_x){ //next row or at end 3852/12=321
            if(person.y == person.max_y){ //at end 55958/98=571
                person.x=0; person.y=0; person.f=0;
            } else { //next row
                person.x=0; person.y+=571;
            }
        } else { //same row, move 321 to the right
            person.x+=321;
        }
        console.log("frame: "+person.f+" coords:"+person.x+","+person.y); person.f++;
        //clear old frame and move to x,y
        var context = person.canvas.getContext("2d");
        context.clearRect(0,0,person.width,person.height);
        context.drawImage(person.img,person.x,person.y,person.width,person.height,0,0,person.width,person.height);
    }
    function play(person){ person.playing = true; person.interval = window.setInterval(function(){talk(person1);},42); }
    function stop(person){ person.playing = false; window.clearInterval(person.interval); }