I am trying to write real-time chart with Epoch.js by using websocket to get data. My current goal is to allow user to pause/play the chart by pressing the button. The problem is that the response is too slow when pressing the button.

The javascript code below shows that every time the button is pressed the value 1000 or 500 is put and drawn on timechart alternatively.

var ws = new WebSocket("ws://localhost:8000/publish");
var data = [
{ label: "Series 1", values: [] }
];
var lineChart = $('#graph').epoch({
type: 'time.line',
data: data,
axes: ['left', 'right', 'bottom']
});

var pushPoint = function(isplaying) {
ws.onmessage = function(msg) {
  if(isplaying){
    value=1000
  }
  else{
    value=500
  }
  var current = [
    { time:time, y: value }
  ]
  lineChart.push(current);
  };
};

$('button').on('click', function(e) {
if (isplaying) {/* will pause */
  $(e.target).text('play');
  isplaying=false;
}
else { /* will play */
  $(e.target).text('Pause');
  isplaying=true;
}
pushPoint(isplaying)
}

(apologize for the messy code as I am new to js) The problem is that the value in the chart won't change as soon as the button is pressed, which takes 7-8seconds that is too slow. How could I solve this problem? Any advice would be welcome. Thank you.