文本以不同字体显示两次| Javascript画布

我正在repl.it上使用javascript创建一个游戏。我的游戏的菜单屏幕出现问题。我的游戏的标题文本以不同的字体显示两次。但是，如果刷新窗口，文本将正常显示。这是什么原因造成的？我如何修复它？多谢各位

游戏：
我的代码：

---

（错误图片）

在菜单中呈现文本之前，您需要运行

ctx.clearRect（0，0，宽度，高度）

，以便在重新绘制之前清除先前绘制的文本

function menu() {
    ctx.clearRect(0, 0, width, height);
    ctx.font = "75px Oswald";
    ctx.textAlign = "center";
    ctx.fillStyle = txtColor;
    ctx.fillText("Almost Pong!", 250, 200);
    ctx.font = "25px Oswald";
    ctx.fillText("space for two player", 250, 250);
    ctx.fillText("c for one player", 250, 300);
    if (start) {
      addEventListener('keydown', keyDown2, false); addEventListener('keyup', keyUp2, false);
      start = false;
      clearInterval(me_nu);
      anim = setInterval(game, 10);
    }
    if (compStart) {
      p1.name = "CPU";
      compStart = false;
      clearInterval(me_nu);
      anim = setInterval(game, 10);
      compute = true;
    }
 }

固定代码：

---

结果：

谢谢！为什么文本首先以不同的字体显示？我在填充之前定义了字体。加载字体需要一点时间，因此在加载字体并开始绘制之前，它可能会以默认浏览器字体呈现。