制作游戏，我应该在开始游戏之前加载所有精灵动画图像吗？

Question

最好在开始之前将所有动画精灵加载到一个数组中，或者这样做也可以正常工作：

var frame = new Image();

function update(){
    window.requestAnimationFrame(update);
    ctx.drawImage(frame, x, y, width, height)
}

window.addEventListener("keydown", key => {
    if(key.keyCode == 65 || key.keyCode == 37){
        for(var i = 0; i <= 3; i++){
            frame.src = "./walkingspriteframes/frame"+i+".png";
        };
    }
})

Answer 1

预加载通常是最好的做法（至少对于经常使用的资产，例如动画精灵），原因如下：

通过网络获取资源会产生延迟成本。当您在应该运行每秒 30-60 帧并快速响应用户输入的游戏中执行此操作时，它可能会显着降低玩家的体验。
如果您是按需加载图片，您将需要考虑图片加载可能失败的可能性（例如，由于网络故障）以及在这种情况下应采取的措施。预加载的一个优点是，如果重要资产不可用，您可以选择不让游戏开始。

此外，您发布的代码可能无法像您预期的那样工作。它只会显示 frame3.png。这是因为浏览器中的 JavaScript 是单线程的： update 和 keydown 侦听器永远不会运行并发，所以 update 中的 ctx.drawImage 调用不会请参阅 frame.src 设置为 frame1.png 或 frame2.png。

制作游戏，我应该在开始游戏之前加载所有精灵动画图像吗？

Making a game, should i load all the sprite animation images before start the game?

javascript

canvas