HTML5 Canvas游戏玩家限制
HTML5 Canvas游戏玩家限制
提问于 2018-06-05 03:21:59
我将1000名玩家放在画布上，但他们的移动并不流畅。canvas有没有办法处理这么多玩家？我有什么选择？
使用socket.IO每秒发送20次球员的位置。当事件到达客户端时，它会在画布上绘制球员。
var images = {};
images.spriteSheet = new Image();
images.spriteSheet.src = "/images/spriteSheet.png";
socket.on('drawing', function(data){
ctx.clearRect(0,0,1000,500);
for(var i = 0; i < data.length; i++){
ctx.drawImage(images['spriteSheet'], data[i].sx, data[i].sy, 100, 100, data[i].x, data[i].y, 70, 70);
}
});回答 1
Stack Overflow用户
回答已采纳
发布于 2018-06-05 03:34:23
我将1000名球员放在画布上，但他们的移动并不流畅。canvas有没有办法处理这么多玩家？
我想你的意思是你每秒在画布上绘制1000个精灵20倍。毫无疑问，这将是一件困难的事情。
使用socket.IO每秒发送20次球员的
位置。
当然，你可以发送一个位置和向量，让客户端有预见性地本地更新每一帧，直到下一次真正的更新。这就是所有其他游戏的工作原理，这是有原因的。你甚至可以每秒获取20次数据的想法并不总是这样的。
如果没有更多的细节，很难给出一个具体的答案，但在一般情况下，我建议研究SVG。然后，您可以更新单个元素，并让浏览器担心合成等问题，这可能会比您在画布中完成的速度更快。不过，您必须针对您的特定用例进行实验。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/50687437
复制相关文章
相似问题