1<!DOCTYPE html> 2<script src="../resources/runner.js"></script> 3<style> 4.a .b { background-color: green } 5</style> 6<div id="root"></div> 7<script> 8function appendDivChildren(root, childCount, levels) { 9 if (levels <= 0) 10 return; 11 for (var i = 0; i < childCount; i++) { 12 var div = document.createElement("div"); 13 appendDivChildren(div, childCount, levels - 1) 14 root.appendChild(div); 15 } 16} 17 18var root = document.getElementById("root"); 19appendDivChildren(root, 5, 5); 20root.firstChild.className = "b"; 21document.body.offsetTop; // force style recalc. 22 23PerfTestRunner.measureRunsPerSecond({ 24 description: "Measure the style recalc performance when changing a class affecting the style of a single descendant.", 25 run: function() { 26 root.className = "a"; 27 root.offsetTop; // force recalc. 28 root.className = ""; 29 root.offsetTop; // force recalc. 30 }}); 31</script> 32