[Qt][WK2]REGRESSION(r93784): It made many tests crash
[WebKit.git] / PerformanceTests / Layout / floats.html
1 <!DOCTYPE html>
2 <html>
3     <head>
4         <title>Floats layout performance tester</title>
5         <style>
6             .float {
7                 float: left;
8                 width: 5px;
9                 height: 5px;
10                 border: 1px solid green;
11             }
12             .big {
13                 width: 10px;
14             }
15             .float-end {
16                 clear:left;
17             }
18
19             #framerate_panel {
20                 display: none;
21             }
22         </style>
23         <script>
24             function createElement(tag, parent, className, id)
25             {
26                 var el = document.createElement(tag);
27                 el.className = className;
28                 el.id = id;
29                 parent.appendChild(el);
30                 return el;
31             }
32
33             function createSet(width, height, nested)
34             {
35                 var container = createElement("div", document.body, "container");
36                 for (var y = 0; y < height; ++y) {
37                     for (var x = 0; x < width; ++x)
38                         createElement("div", container, "float", "float" + x + "_" + y);
39
40                     var nestedContainer = container;
41                     for ( ; nested > 0; --nested)
42                         nestedContainer = createElement("div", nestedContainer, "nested", "nested" + x + "_" + nested);
43                     
44                     createElement("div", container, "float-end", "end" + x)
45                 }
46             }
47
48             function toggle(str, str1, str2)
49             {
50                 if (str == str1)
51                     return str2;
52                 return str1;
53             }
54
55             function test(width, height, nested) 
56             {
57                 nested = nested || 0;
58
59                 document.getElementById("test_panel").style.display = "none";
60                 document.getElementById("framerate_panel").style.display = "block";
61
62                 createSet(width, height, nested);
63                 var updates = 0;
64                 var startTime = new Date();
65
66                 function updateTimer()
67                 {
68                     ++updates;
69
70                     var newTime = new Date();
71                     var deltaTime = newTime - startTime;
72
73                     if ((deltaTime > 0 && updates > 100) || deltaTime > 1000) {
74                         var fps = updates * 100 / deltaTime;
75                         document.getElementById("fps").innerHTML = fps;
76                         updates = 0;
77                         startTime = newTime;
78                     }
79                 }
80
81                 function update()
82                 {
83                     var x = Math.floor(Math.random() * width);
84                     var y = Math.floor(Math.random() * height);
85                     var el = document.getElementById("float" + x + "_" + y);
86                     el.className = toggle(el.className, "float", "float big");
87                     updateTimer();
88                 }
89                 setInterval(update, 0);
90             }
91         </script>
92     </head>
93     <body>
94         <div id="framerate_panel">Framerate: <span id="fps">calculating...</span> fps</div>
95         <div id="test_panel">
96             <p>Choose the size of the test:</p>
97             <button onclick="test(2, 100)">2 by 100</button>
98             <button onclick="test(20, 100)">20 by 100</button>
99             <button onclick="test(50, 100)">50 by 100</button>
100             <button onclick="test(100, 100)">100 by 100</button>
101             <p>Nested divs:</p>
102             <button onclick="test(2, 100, 100)">2 by 100, 100 nested</button>
103             <button onclick="test(20, 100, 100)">20 by 100, 100 nested</button>
104             <button onclick="test(50, 100, 100)">50 by 100, 100 nested</button>
105             <button onclick="test(100, 100, 100)">100 by 100, 100 nested</button>
106         </div>
107     </body>
108 </html>