Javascript 画布函数结果在while循环激活之前不显示

我试图在画布上绘制一个图形，对画布的调用在while循环中。问题是，在完成整个循环之前，结果不会显示（绘制）在画布上。代码示例附在后面。如果不清楚，我可以发布整个代码

while (remainingLetters > 0 && numOfTries > 0) {
z++;
ctx.fillRect(10*z,10*z, 50, 50);
}

---

我的预期结果是，每次循环都会绘制一个矩形，并在x和y方向偏移10像素。这确实发生了，但只有在循环完成之后，我才知道这是因为这是一个刽子手游戏，它还有一些其他的检查和调用来提示（）和警报（）函数。这些形状仅在游戏（while循环）结束后绘制。

对画布了解不多，但您是否尝试过使用setinterval（）而不是while（），或者使用requestAnimationFrame（）来绘制

请添加您的代码或至少一个指向codepen或JSFIDLE的链接，或任何JavaScript同步的内容，循环不会给浏览器任何时间来更新渲染。您将需要使用

requestAnimationFrame

或其他类型的函数一次只更改一次调用

fillRect

timer@enxaneta这里有一个小提琴链接，很抱歉有些单词和输出是克罗地亚语，但是理解逻辑应该不会太难，因为我的大多数函数都是英文的。@BaliBalo谢谢你提供的信息。我会看看我是否可以做一个变通办法，然后发布我的结果。我还没有尝试过。我可能会用JQuery和keypress方法重做游戏，但我仍然会尝试其他一些解决方法，因为这是一个相当不错的学习挑战。