Perf tests using different payloads.

This test has workers sending different realistic payloads back and forth
from the parent context to the worker.

Change-Id: I656df3737d037593c9ce54d2739b58cebcde198b
Reviewed-on: https://chromium-review.googlesource.com/c/1323559Reviewed-by: Shubhie Panicker <panicker@chromium.org>
Reviewed-by: Kentaro Hara <haraken@chromium.org>
Commit-Queue: Katie Dillon <kdillon@chromium.org>
Cr-Commit-Position: refs/heads/master@{#610267}

third_party/blink/perf_tests/bindings/resources/data/preact-from-worker.json

+{"fromWorker":[{"id":2,"timestamp":1528913391942,"data":{"type":"MutationRecord","mutations":[{"attributeName":"class","attributeNamespace":null,"oldValue":"icon ion-chatbubble","target":{"nodeType":1,"nodeName":"I","childNodes":[],"attributes":[{"ns":null,"name":"class","value":"icon ion-checkmark-circled"}],"style":{},"normalizedNodeName":"i","__id":"50"},"type":"attributes"},{"attributeName":"style","attributeNamespace":null,"oldValue":"","target":{"nodeType":1,"nodeName":"DIV","childNodes":[{"nodeType":1,"nodeName":"I","childNodes":[],"attributes":[{"ns":null,"name":"class","value":"icon ion-checkmark-circled"}],"style":{},"normalizedNodeName":"i","__id":"50"},{"nodeType":3,"nodeName":"#text","childNodes":[],"data":"Linh Grazyna","__id":"51"}],"attributes":[{"ns":null,"name":"class","value":"item item-icon-left"},{"ns":null,"name":"style","value":"background:#EEE;"}],"style":{},"normalizedNodeName":"div","_listeners":{},"__id":"49"},"type":"attributes"}]}},{"id":2,"timestamp":1528913392538,"data":{"type":"MutationRecord","mutations":[{"attributeName":"class","attributeNamespace":null,"oldValue":"icon ion-chatbubble","target":{"nodeType":1,"nodeName":"I","childNodes":[],"attributes":[{"ns":null,"name":"class","value":"icon ion-checkmark-circled"}],"style":{},"normalizedNodeName":"i","__id":"47"},"type":"attributes"},{"attributeName":"style","attributeNamespace":null,"oldValue":"","target":{"nodeType":1,"nodeName":"DIV","childNodes":[{"nodeType":1,"nodeName":"I","childNodes":[],"attributes":[{"ns":null,"name":"class","value":"icon ion-checkmark-circled"}],"style":{},"normalizedNodeName":"i","__id":"47"},{"nodeType":3,"nodeName":"#text","childNodes":[],"data":"Rachal Jenniffer","__id":"48"}],"attributes":[{"ns":null,"name":"class","value":"item item-icon-left"},{"ns":null,"name":"style","value":"background:#EEE;"}],"style":{},"normalizedNodeName":"div","_listeners":{},"__id":"46"},"type":"attributes"}]}},{"id":2,"timestamp":1528913397714,"data":{"type":"MutationRecord","mutations":[{"oldValue":"0ms","target":{"nodeType":3,"nodeName":"#text","childNodes":[],"data":"2ms","__id":"30"},"type":"characterData"},{"oldValue":"Blocked for ...ms","target":{"nodeType":3,"nodeName":"#text","childNodes":[],"data":"Blocked for 6ms","__id":"34"},"type":"characterData"}]}},{"id":2,"timestamp":1528913397873,"data":{"type":"MutationRecord","mutations":[{"oldValue":"2ms","target":{"nodeType":3,"nodeName":"#text","childNodes":[],"data":"4ms","__id":"30"},"type":"characterData"},{"oldValue":"Blocked for 6ms","target":{"nodeType":3,"nodeName":"#text","childNodes":[],"data":"Blocked for 5ms","__id":"34"},"type":"characterData"}]}},{"id":2,"timestamp":1528913399012,"data":{"type":"MutationRecord","mutations":[{"oldValue":"Blocked for 5ms","target":{"nodeType":3,"nodeName":"#text","childNodes":[],"data":"Blocked for 10ms","__id":"34"},"type":"characterData"},{"oldValue":"","target":{"nodeType":3,"nodeName":"#text","childNodes":[],"data":"The app running in a worker intentionally blocks for an abnormally long time to simulate an artificially heavy diff.\nReal appliations are unlikely to come anywhere close to a 200ms blocking diff (more like 5ms), but it's fun to show off.","__id":"639"},"type":"characterData"},{"attributeName":"class","attributeNamespace":null,"oldValue":"dialog","target":{"nodeType":1,"nodeName":"DIV","childNodes":[{"nodeType":1,"nodeName":"DIV","childNodes":[{"nodeType":3,"nodeName":"#text","childNodes":[],"data":"The app running in a worker intentionally blocks for an abnormally long time to simulate an artificially heavy diff.\nReal appliations are unlikely to come anywhere close to a 200ms blocking diff (more like 5ms), but it's fun to show off.","__id":"639"}],"attributes":[{"ns":null,"name":"class","value":"inner"}],"style":{},"normalizedNodeName":"div","__id":"638"}],"attributes":[{"ns":null,"name":"class","value":"dialog open"}],"style":{},"normalizedNodeName":"div","_listeners":{},"__id":"637"},"type":"attributes"}]}},{"id":2,"timestamp":1528913400160,"data":{"type":"MutationRecord","mutations":[{"oldValue":"Blocked for 10ms","target":{"nodeType":3,"nodeName":"#text","childNodes":[],"data":"Blocked for 11ms","__id":"34"},"type":"characterData"},{"oldValue":"The app running in a worker intentionally blocks for an abnormally long time to simulate an artificially heavy diff.\nReal appliations are unlikely to come anywhere close to a 200ms blocking diff (more like 5ms), but it's fun to show off.","target":{"nodeType":3,"nodeName":"#text","childNodes":[],"data":"","__id":"639"},"type":"characterData"},{"attributeName":"class","attributeNamespace":null,"oldValue":"dialog open","target":{"nodeType":1,"nodeName":"DIV","childNodes":[{"nodeType":1,"nodeName":"DIV","childNodes":[{"nodeType":3,"nodeName":"#text","childNodes":[],"data":"","__id":"639"}],"attributes":[{"ns":null,"name":"class","value":"inner"}],"style":{},"normalizedNodeName":"div","__id":"638"}],"attributes":[{"ns":null,"name":"class","value":"dialog"}],"style":{},"normalizedNodeName":"div","_listeners":{},"__id":"637"},"type":"attributes"}]}},{"id":2,"timestamp":1528913404425,"data":{"type":"MutationRecord","mutations":[{"attributeName":"class","attributeNamespace":null,"oldValue":"icon ion-checkmark-circled","target":{"nodeType":1,"nodeName":"I","childNodes":[],"attributes":[{"ns":null,"name":"class","value":"icon ion-chatbubble"}],"style":{},"normalizedNodeName":"i","__id":"47"},"type":"attributes"},{"attributeName":"style","attributeNamespace":null,"oldValue":"background:#EEE;","target":{"nodeType":1,"nodeName":"DIV","childNodes":[{"nodeType":1,"nodeName":"I","childNodes":[],"attributes":[{"ns":null,"name":"class","value":"icon ion-chatbubble"}],"style":{},"normalizedNodeName":"i","__id":"47"},{"nodeType":3,"nodeName":"#text","childNodes":[],"data":"Rachal Jenniffer","__id":"48"}],"attributes":[{"ns":null,"name":"class","value":"item item-icon-left"},{"ns":null,"name":"style","value":""}],"style":{},"normalizedNodeName":"div","_listeners":{},"__id":"46"},"type":"attributes"}]}},{"id":2,"timestamp":1528913405184,"data":{"type":"MutationRecord","mutations":[{"attributeName":"class","attributeNamespace":null,"oldValue":"icon ion-checkmark-circled","target":{"nodeType":1,"nodeName":"I","childNodes":[],"attributes":[{"ns":null,"name":"class","value":"icon ion-chatbubble"}],"style":{},"normalizedNodeName":"i","__id":"50"},"type":"attributes"},{"attributeName":"style","attributeNamespace":null,"oldValue":"background:#EEE;","target":{"nodeType":1,"nodeName":"DIV","childNodes":[{"nodeType":1,"nodeName":"I","childNodes":[],"attributes":[{"ns":null,"name":"class","value":"icon ion-chatbubble"}],"style":{},"normalizedNodeName":"i","__id":"50"},{"nodeType":3,"nodeName":"#text","childNodes":[],"data":"Linh Grazyna","__id":"51"}],"attributes":[{"ns":null,"name":"class","value":"item item-icon-left"},{"ns":null,"name":"style","value":""}],"style":{},"normalizedNodeName":"div","_listeners":{},"__id":"49"},"type":"attributes"}]}}]}

third_party/blink/perf_tests/bindings/resources/worker-structured-clone-different-payloads-perf-test.js

+const WorkerStructuredCloneDifferentPayloadsPerfTestRunner = (function() {
+  function pingPong(data) {
+    return new Promise((resolve, reject) => {
+      let mainThreadBeginSerialize, mainThreadEndDeserialize, iteration, numMessages;
+      iteration = 0;
+      numMessages = data['toWorker'].length;
+      worker.addEventListener('message', function listener(e) {
+        try {
+          e.data.sendData;  // Force deserialization.
+	  // keep sending messages to worker until worker runs out of responses.
+	  if (!e.data.done && iteration < numMessages) {
+	    iteration++;
+	    worker.postMessage({'data' : data['toWorker'][iteration], 'iteration' : iteration});
+	  } else {
+            mainThreadEndDeserialize = performance.now();
+            worker.removeEventListener('message', listener);
+            totalTime = mainThreadEndDeserialize - mainThreadBeginSerialize;
+            resolve([totalTime]);
+	  }
+        } catch (err) { reject(err); }
+      });
+      mainThreadBeginSerialize = performance.now();
+      worker.postMessage({'data' : data['toWorker'][iteration], 'iteration' : iteration});
+    });
+  }
+
+  return {
+    measureTimeAsync(test) {
+      let isDone = false;
+      worker = new Worker('resources/worker-structured-clone-different-payloads.js');
+      PerfTestRunner.startMeasureValuesAsync({
+        description: test.description,
+        unit: 'ms',
+        warmUpCount: test.warmUpCount || 5,
+        iterationCount: test.iterationCount || 15,
+        done() { isDone = true; },
+        run: pingPongUntilDone,
+      });
+
+      function pingPongUntilDone() {
+        pingPong(test.data).then(([totalTime]) => {
+          console.log([totalTime]);
+          if (test.measure == 'roundtrip')
+            PerfTestRunner.measureValueAsync(totalTime);
+          if (!isDone) pingPongUntilDone();
+        });
+      }
+    },
+  };
+})();

third_party/blink/perf_tests/bindings/resources/worker-structured-clone-different-payloads.js

+var xhr = new XMLHttpRequest();
+xhr.open("GET", "data/preact-from-worker.json", false);
+xhr.send(null);
+var sendData = JSON.parse(xhr.responseText)
+var length = sendData['fromWorker'].length;
+
+self.onmessage = function(e) {
+  var data = e.data;  // Force deserialization.
+  var iteration = e.data.iteration;
+  var done = false;
+  if (iteration == length - 1){
+    done = true;
+  }
+  self.postMessage({'sendData' : sendData['fromWorker'][iteration], 'done': done});
+};

third_party/blink/perf_tests/bindings/worker-structured-clone-different-payloads.html

+<!DOCTYPE html>
+<body>
+<script src="../resources/runner.js"></script>
+<script src="resources/worker-structured-clone-different-payloads-perf-test.js"></script>
+<script>
+WorkerStructuredCloneDifferentPayloadsPerfTestRunner.measureTimeAsync({
+  description: "Measures performance of worker round-trip with structured clone, for JSON-like data where different payloads are sent back and forth.",
+  data: JSON.parse(PerfTestRunner.loadFile("resources/data/preact-to-worker.json")),
+  measure: "roundtrip",
+});
+</script>
+</body>