| Index: third_party/WebKit/PerformanceTests/Paint/transform-changes.html
|
| diff --git a/third_party/WebKit/PerformanceTests/Paint/transform-changes.html b/third_party/WebKit/PerformanceTests/Paint/transform-changes.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..fbbe214995e72b17697958c02678452896139cfa
|
| --- /dev/null
|
| +++ b/third_party/WebKit/PerformanceTests/Paint/transform-changes.html
|
| @@ -0,0 +1,54 @@
|
| +<!DOCTYPE html>
|
| +<body>
|
| +<script src="../resources/runner.js"></script>
|
| +<style>
|
| + span {
|
| + border: 1px solid blue;
|
| + }
|
| + .changeTransform {
|
| + position: absolute;
|
| + transform: rotate(0);
|
| + }
|
| +</style>
|
| +<script>
|
| +// This test measures the lifecycle update performance of changing transforms
|
| +// in large trees.
|
| +
|
| +function buildTree(parent, depth, arity, createElementCallback) {
|
| + for (var child = 0; child < arity; child++) {
|
| + var element = document.createElement('span');
|
| + parent.appendChild(element);
|
| + createElementCallback(element, depth);
|
| + if (depth > 1)
|
| + buildTree(element, depth - 1, arity, createElementCallback);
|
| + }
|
| +}
|
| +
|
| +// Build a tall tree (depth=10) that is skinny (arity=2). A middle layer of
|
| +// the tree should have the changeTransform class.
|
| +buildTree(document.body, 11, 2, function(element, depth) {
|
| + element.style.borderColor = 'red';
|
| + if (depth == 5)
|
| + element.setAttribute('class', 'changeTransform');
|
| +});
|
| +
|
| +// Build a short tree (depth=6) that is fat (arity=4). A middle layer of
|
| +// the tree should have the changeTransform class.
|
| +buildTree(document.body, 6, 4, function(element, depth) {
|
| + element.style.borderColor = 'orange';
|
| + if (depth == 3)
|
| + element.setAttribute('class', 'changeTransform');
|
| +});
|
| +
|
| +var runCount = 0;
|
| +var elementsToChange = document.getElementsByClassName('changeTransform');
|
| +PerfTestRunner.measureFrameTime({
|
| + run: function() {
|
| + runCount += 10;
|
| + for (var index = 0; index < elementsToChange.length; index++)
|
| + elementsToChange[index].style.transform = 'rotate(' + runCount + 'deg)';
|
| + },
|
| + warmUpCount: 5,
|
| +});
|
| +</script>
|
| +</body>
|
|
|
Chromium Code Reviews
Issue 2488913002:
Add lifecycle update microbenchmarks (Closed)
