一点背景:
我正在制作一款基于浏览器的2D游戏.渲染代码将移动的对象和场景对象分成两组,然后将每个组全部绘制到8192x8192画布上,该画布不会直接显示.仅当该组中的某些内容以某种方式更改时才会执行此操作.对于所有帧,完成以下操作:
canvas.drawImage(
zoneBufferStatic,
Math.floor((w / 2 - playerX) * tileSize),
Math.floor((h / 2 - playerY) * tileSize)
);
canvas.drawImage(
zoneBufferDynamic,
Math.floor((w / 2 - playerX) * tileSize),
Math.floor((h / 2 - playerY) * tileSize)
);
Run Code Online (Sandbox Code Playgroud)
(canvas用户可见画布的2d上下文; zoneBufferStatic以及zoneBufferDynamic分别用于场景和移动对象的屏幕外画布; w以及h用户可见画布在画面中的宽度和高度; playerX以及playerY玩家的位置,同样在画面中;并且tileSize是图块一侧的像素数,目前为32)
UI(聊天文本,对话框)直接在可见画布上绘制.
上面显示的两个drawImage调用在我的桌面上完全正常工作(16GB RAM,i7,GTX 780),但我的Chromebook(三星ARM(codenames daisy,snow),2GB RAM)什么都不做.UI正常显示,但不会显示风景和字符.Chrome的开发者控制台中没有错误.我已经确认document.body.appendChild(zoneBufferStatic)在Chrome开发者控制台中使用了后台缓冲区.
有没有更好的方法来做到这一点,或者(非hacky)方式来检测它什么时候失败所以我可以回到直接在可见画布上绘图?