mamrehn · August 29, 2015 14:18 · mamrehn · Apr 8, 2015
diff --git a/README.md b/README.md
diff --git a/index.html b/index.html
 <!DOCTYPE html>
 <html>

  <head>
    <script src="http://chancejs.com/chance.min.js"></script>
    <script src="script.js"></script>
    <title>HTML5 WebSocket profiling</title>
  </head>

  <body>
    <h2>WebSocket Test</h2>
    <div id="outcome"></div>
  </body>

 </html>
diff --git a/script.js b/script.js
 // http://www.websocket.org/echo.html
 var wsUri = "wss://echo.websocket.org/";
 var outcome;
 var time = {'start': [], 'end': []};
 var timeDiff = [];
 var count = 0;
 var websocket;

 var debug = false;
 var dataSize = 512;
 var iters = 25;

 var message = JSON.stringify({
  'some': {
    'foo': 'bar',
    'baz': [1, 2, 3, 4]
  },
  'data': chance.pick(
    Array.apply(null, Array(5000)).map(function(_, i) {return i;}), // same as _.range(5000)
    dataSize
  )
 }); //, null, 2);

 // http://jsfiddle.net/hiddenloop/TPeJt/
 var average = function(a) {
  var r = {mean: 0, variance: 0, deviation: 0}, t = a.length;
  for (var m, s = 0, l = t; l--; s += a[l]);
  for (m = r.mean = s / t, l = t, s = 0; l--; s += Math.pow(a[l] - m, 2));
  return r.deviation = Math.sqrt(r.variance = s / t), r;
 };

 function init() {
  outcome = document.getElementById("outcome");
  testWebSocket();
 }

 function testWebSocket() {
  websocket = new WebSocket(wsUri);
  websocket.onopen = function(evt) {
    onOpen(evt);
  };
  websocket.onclose = function(evt) {
    onClose(evt);
  };
  websocket.onmessage = function(evt) {
    onMessage(evt);
  };
  websocket.onerror = function(evt) {
    onError(evt);
  };
 }

 function onOpen(evt) {
  if (debug)
    writeToScreen("CONNECTED");
  doSend(message);
 }

 function onClose(evt) {
  if (debug)
    writeToScreen("DISCONNECTED");
  if (count++ > iters) {
    timeDiff = [];
    for (var i = 0; i < time.start.length; ++i) {
      var diff = time.end[i] - time.start[i];
      if (0 < diff)
        timeDiff.push(diff);
    }
    var x = average(timeDiff);
    writeToScreen(
      "iterations = " + iters + "<br />" +
      "dataSize   = " + dataSize + "<br />" +
      "mean [ms]  = " + x.mean + "<br />" +
      "deviation  = " + x.deviation + "<br />" +
      "variance   = " + x.variance + "<br /><br />"
    );
    return;
  }
  testWebSocket();
 }

 function onMessage(evt) {
  time.end.push((new Date()).getMilliseconds());
  if (debug)
    writeToScreen('<span style="color: blue;">RESPONSE:' + evt.data + '</span>');
  writeToScreen('<code>Time: ' + (time.end[time.start.length - 1] - time.start[time.start.length - 1]) + 'ms</code>');
  websocket.close();
 }

 function onError(evt) {
  writeToScreen('<span style="color: red;">ERROR:</span> ' + evt.data);
 }

 function doSend(message) {
  time.start.push((new Date()).getMilliseconds());
  if (debug)
    writeToScreen("SENT: " + message);
  websocket.send(message);
 }

 function writeToScreen(message) {
  var p = document.createElement("p");
  p.style.wordWrap = "break-word";
  p.innerHTML = message;
  outcome.appendChild(p);
 }

 window.addEventListener("load", init, false);
	<!DOCTYPE html>
	<html>

	<head>
	<script src="http://chancejs.com/chance.min.js"></script>
	<script src="script.js"></script>
	<title>HTML5 WebSocket profiling</title>
	</head>

	<body>
	<h2>WebSocket Test</h2>
	<div id="outcome"></div>
	</body>

	</html>
	// http://www.websocket.org/echo.html
	var wsUri = "wss://echo.websocket.org/";
	var outcome;
	var time = {'start': [], 'end': []};
	var timeDiff = [];
	var count = 0;
	var websocket;

	var debug = false;
	var dataSize = 512;
	var iters = 25;

	var message = JSON.stringify({
	'some': {
	'foo': 'bar',
	'baz': [1, 2, 3, 4]
	},
	'data': chance.pick(
	Array.apply(null, Array(5000)).map(function(_, i) {return i;}), // same as _.range(5000)
	dataSize
	)
	}); //, null, 2);

	// http://jsfiddle.net/hiddenloop/TPeJt/
	var average = function(a) {
	var r = {mean: 0, variance: 0, deviation: 0}, t = a.length;
	for (var m, s = 0, l = t; l--; s += a[l]);
	for (m = r.mean = s / t, l = t, s = 0; l--; s += Math.pow(a[l] - m, 2));
	return r.deviation = Math.sqrt(r.variance = s / t), r;
	};

	function init() {
	outcome = document.getElementById("outcome");
	testWebSocket();
	}

	function testWebSocket() {
	websocket = new WebSocket(wsUri);
	websocket.onopen = function(evt) {
	onOpen(evt);
	};
	websocket.onclose = function(evt) {
	onClose(evt);
	};
	websocket.onmessage = function(evt) {
	onMessage(evt);
	};
	websocket.onerror = function(evt) {
	onError(evt);
	};
	}

	function onOpen(evt) {
	if (debug)
	writeToScreen("CONNECTED");
	doSend(message);
	}

	function onClose(evt) {
	if (debug)
	writeToScreen("DISCONNECTED");
	if (count++ > iters) {
	timeDiff = [];
	for (var i = 0; i < time.start.length; ++i) {
	var diff = time.end[i] - time.start[i];
	if (0 < diff)
	timeDiff.push(diff);
	}
	var x = average(timeDiff);
	writeToScreen(
	"iterations = " + iters + "<br />" +
	"dataSize = " + dataSize + "<br />" +
	"mean [ms] = " + x.mean + "<br />" +
	"deviation = " + x.deviation + "<br />" +
	"variance = " + x.variance + "<br /><br />"
	);
	return;
	}
	testWebSocket();
	}

	function onMessage(evt) {
	time.end.push((new Date()).getMilliseconds());
	if (debug)
	writeToScreen('<span style="color: blue;">RESPONSE:' + evt.data + '</span>');
	writeToScreen('<code>Time: ' + (time.end[time.start.length - 1] - time.start[time.start.length - 1]) + 'ms</code>');
	websocket.close();
	}

	function onError(evt) {
	writeToScreen('<span style="color: red;">ERROR:</span> ' + evt.data);
	}

	function doSend(message) {
	time.start.push((new Date()).getMilliseconds());
	if (debug)
	writeToScreen("SENT: " + message);
	websocket.send(message);
	}

	function writeToScreen(message) {
	var p = document.createElement("p");
	p.style.wordWrap = "break-word";
	p.innerHTML = message;
	outcome.appendChild(p);
	}

	window.addEventListener("load", init, false);