Canvas 不只在某些移动设备上绘制所有图像

Question

我在画布上遇到问题，无法在特定设备上绘制所有图像（仅绘制了一些图像）。
确切地说Mobile Chrome（三星），到目前为止我还没有在任何其他设备上遇到这个问题。

  const drawSymbol = (
    ctx: CanvasRenderingContext2D,
    symbol: CardSymbol,
    image: HTMLImageElement,
  ) => {
    window.requestAnimationFrame(() => {
      ctx.drawImage(
        image,
        symbol.x,
        symbol.y,
        symbol.width,
        symbol.height,
      );
    });
  };

  useEffect(() => {
    const canvas = canvasRef.current;
    if (canvas) {
      const ctx = canvas.getContext('2d');
      if (ctx) {
        ctx.clearRect(0, 0, canvas.width, canvas.height);
        for (const symbol of card) {
          const image = images[symbol.image.id];
          if (image.loadedImg) {
            drawSymbol(ctx, symbol, image.loadedImg);
          } else {
            const img = new Image();
            img.onload = () => {
              image.loadedImg = img; // Cache loaded image
              drawSymbol(ctx, symbol, img);
            };
            img.src = image.src;
          }
        }
      }
    }
  }, [card]);

有些图像看起来像是画出来的，有些根本就没有。我注意到有时会绘制一部分图像，然后将其移除，然后绘制另一部分，但我无法确认这是否真的发生了，因为很难发现（毫秒）。 有谁知道为什么会这样？

您认为所有图像的单个

window.requestAnimationFrame

可以解决问题吗？