Changeset 217119 in webkit

Timestamp:

May 19, 2017, 3:09:13 AM (8 years ago)

Author:

rniwa@webkit.org

Message:

Speedometer 2.0: Elem test isn't updating DOM during the measurement
​https://bugs.webkit.org/show_bug.cgi?id=172343

Reviewed by Antti Koivisto.

Elem test wasn't doing much work because it simply enqueues items into the work queue, which doesn't get
executed until the next requestAnimationFrame or setTimeout callback happens.

Expose elm's work function as contentWindow.elemWork and make the first use of rAF a synchronous callback
just as it would when requestAnimationFrame isn't defined, and make the second use of rAF queue up to
an array of callbacks, and have the test runner manually invoke each callback.

This increases the runtime of the Elm suite from 100ms to 300ms on Safari.

• Speedometer/resources/tests.js:

(processElmWorkQueue): Added. A helper which processes Elm's work queue and manually invokes render callbacks.

• Speedometer/resources/todomvc/functional-prog-examples/elm/dist/elm.js:

Location:

trunk/PerformanceTests

Files:

• ChangeLog (modified) (1 diff)
• Speedometer/resources/tests.js (modified) (2 diffs)
• Speedometer/resources/todomvc/functional-prog-examples/elm/dist/elm.js (modified) (3 diffs)

trunk/PerformanceTests/ChangeLog

@@ +1 @@
+2017-05-19  Ryosuke Niwa  <rniwa@webkit.org>
+
+        Speedometer 2.0: Elem test isn't updating DOM during the measurement
+        https://bugs.webkit.org/show_bug.cgi?id=172343
+
+        Reviewed by Antti Koivisto.
+
+        Elem test wasn't doing much work because it simply enqueues items into the work queue, which doesn't get
+        executed until the next requestAnimationFrame or setTimeout callback happens.
+
+        Expose elm's work function as contentWindow.elemWork and make the first use of rAF a synchronous callback
+        just as it would when requestAnimationFrame isn't defined, and make the second use of rAF queue up to
+        an array of callbacks, and have the test runner manually invoke each callback.
+
+        This increases the runtime of the Elm suite from 100ms to 300ms on Safari.
+
+        * Speedometer/resources/tests.js:
+        (processElmWorkQueue): Added. A helper which processes Elm's work queue and manually invokes render callbacks.
+        * Speedometer/resources/todomvc/functional-prog-examples/elm/dist/elm.js:
+
 2017-05-18  Ryosuke Niwa  <rniwa@webkit.org>
 

trunk/PerformanceTests/Speedometer/resources/tests.js

@@ -414 +414 @@
 });
 
+function processElmWorkQueue(contentWindow)
+{
+    contentWindow.elmWork();
+    var callbacks = contentWindow.rAFCallbackList;
+    var i = 0;
+    while (i < callbacks.length) {
+        callbacks[i]();
+        i++;
+    }
+    contentWindow.rAFCallbackList = [];
+}
+
 Suites.push({
     name: 'Elm-TodoMVC',
@@ -431 +443 @@
                   cancelable: true
                 }));
-                triggerEnter(newTodo, 'keydown');
-            }
-        }),
-        new BenchmarkTestStep('CompletingAllItems', function (params, contentWindow, contentDocument) {
-            var checkboxes = contentDocument.querySelectorAll('.toggle');
-            for (var i = 0; i < checkboxes.length; i++)
-                checkboxes[i].click();
-        }),
-        new BenchmarkTestStep('DeletingItems', function (params, contentWindow, contentDocument) {
-            var deleteButtons = contentDocument.querySelectorAll('.destroy');
-            for (var i = 0; i < deleteButtons.length; i++)
-                deleteButtons[i].click();
+                processElmWorkQueue(contentWindow);
+                triggerEnter(newTodo, 'keydown');
+                processElmWorkQueue(contentWindow);
+            }
+        }),
+        new BenchmarkTestStep('CompletingAllItems', function (params, contentWindow, contentDocument) {
+            var checkboxes = contentDocument.querySelectorAll('.toggle');
+            for (var i = 0; i < checkboxes.length; i++) {
+                checkboxes[i].click();
+                processElmWorkQueue(contentWindow);
+            }
+        }),
+        new BenchmarkTestStep('DeletingItems', function (params, contentWindow, contentDocument) {
+            for (var i = 0; i < numberOfItemsToAdd; i++) {
+                contentDocument.querySelector('.destroy').click();
+                processElmWorkQueue(contentWindow);
+            }
         }),
     ]

trunk/PerformanceTests/Speedometer/resources/todomvc/functional-prog-examples/elm/dist/elm.js

@@ -2679 +2679 @@
     setTimeout(work, 0);
 }
-
+window.elmWork = work;
 
 return {
@@ -7010 +7010 @@
 }
 
-var rAF = typeof requestAnimationFrame !== 'undefined'
-    ? requestAnimationFrame
-    : function(callback) { callback(); };
+var rAF = function(callback) { callback(); };
 
 function withNode(id, doStuff)
@@ -7486 +7484 @@
 
 
-var rAF =
-    typeof requestAnimationFrame !== 'undefined'
-        ? requestAnimationFrame
-        : function(cb) { setTimeout(cb, 1000 / 60); };
+window.rAFCallbackList = [];
+var rAF = function (callback) {
+    window.rAFCallbackList.push(callback);
+}