websocket経由で最適な描画方法を教えてください。

Question

私は現在、オンラインの絵画館で働いています（1人は絵を描き、他の人はそれが何であるかを推測しなければなりません）。

現在私は "mouseup" DOMイベントのbase64（サーバー上の）の引き出しから画像をサーバーに送信していますが、私はそれを同じ形式の推測者に送り返します。かなり重いと私は軽いペイロードを持ってどのように考えていない。

$('#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}); 
}, 

私のイメージデータを送信する方がいいですか？

Answer 1

マウスの位置のリストまたはキャンバスの増分変更のリストを送信することができます。つまり、2番目のキャンバスを使用して新しい図面のみを送信することができます。

Answer 2

私は最善のアプローチは、あなたが描画された座標を送信することだと思うまあ、私は事の似たようなものを実装している、uが見 http://connectboard.herokuapp.com/ をHV cnを二つ以上の異なるブラウザやパソコンで開いて描きます。