Javascript 如何通过websocket发送图形？

我目前正在做一个在线的绘画（一个人画一幅画，其他人必须猜它是什么）

目前，我在“mouseup”DOM事件中将我的整个图像从抽屉（在画布中）base64发送到服务器，并以相同的格式将其发送回guesser，我的问题是它看起来很重，我不知道如何拥有更轻的负载

$('#canvas').on('mouseup touchend', function() {
    mouse.down = false;

    // My problem is sending canvas.toDataURL() every time
    update_canvas(canvas.toDataURL());
});

// I use this function inside ActionCable so this.perform will send the data to my channel
var update_canvas = function(data_url) {
    this.perform('update_canvas', {data_url: data_url});
},

---

你有更好的方法发送我的图像数据吗？

你可以发送鼠标位置列表或画布的增量更改，即只发送使用第二个画布的新图形。

我认为最好的方法是发送你正在绘制的坐标，我已经实现了类似的事情，看一看

---

在两个或多个不同的浏览器或计算机中打开它并绘制。

这是一个很好的方法。可以找到一个基本的实现方法。您是否找到了更好的实现方法？这里可能有太多的问题。您是否也使用该方法测量了网络延迟？