Chromium Code Reviews| Index: tools/perf/page_sets/tough_scheduling_cases/second_batch_js.html |
| diff --git a/tools/perf/page_sets/tough_scheduling_cases/second_batch_js.html b/tools/perf/page_sets/tough_scheduling_cases/second_batch_js.html |
| new file mode 100644 |
| index 0000000000000000000000000000000000000000..96edc121ae1af3d28e8c3725f123a8d09fce05af |
| --- /dev/null |
| +++ b/tools/perf/page_sets/tough_scheduling_cases/second_batch_js.html |
| @@ -0,0 +1,105 @@ |
| +<!doctype html> |
| +<html> |
| +<head> |
| + <meta name="viewport" content="width=device-width, initial-scale=1"> |
| + <title>Second batch JS</title> |
| +</head> |
| + |
| +<style> |
| +#spinner { |
| + width: 600px; |
| + height: 10px; |
| + border-right: black; |
| + position: relative; |
| + background: repeating-linear-gradient( |
| + -45deg, |
| + orange, |
| + orange 21px, |
| + yellow 21px, |
| + yellow 42px |
| + ); |
| +} |
| +#spinner-container { |
| + width: 300px; |
| + height: 10px; |
| + overflow: hidden; |
| + border: solid thin darkorange; |
| + border-radius: 4px; |
| + margin-top: 50px; |
| +} |
| +.spinner-loaded #spinner { |
| + background: repeating-linear-gradient( |
| + -45deg, |
| + steelblue, |
| + steelblue 21px, |
| + aqua 21px, |
| + aqua 42px |
| + ); |
| +} |
| +#spinner-container.spinner-loaded { |
| + border: solid thin steelblue; |
| +} |
| +input { |
| + font-size: 150%; |
| + width: 302px; |
| + margin-top: 30px; |
| + margin-bottom: 30px; |
| +} |
| +#run { |
| + display: none; |
|
rmcilroy
2015/03/17 13:59:36
nit - I'm not sure on 'html code style', but it wo
Sami
2015/03/18 14:05:31
Yeah, that's cleaner. Done.
|
| +} |
| +</style> |
| + |
| +<center> |
| + <div id="spinner-container"> |
| + <div id="spinner"></div> |
| + </div> |
| + |
| + <input id="load" type="button" value="Start loading" onclick="kickOffLoading()"></input> |
|
rmcilroy
2015/03/17 13:59:36
(for a future CL) - could we have a variation whic
Sami
2015/03/18 14:05:31
Good point. Actually there's a subtlety here in th
|
| + <input id="run" type="button" value="Click me!" onclick="onClick()"></input> |
| + |
| + <p id="results"></p> |
| +</center> |
| + |
| +<script> |
| +// Perform main thread animation during the benchmark to gauge main thread |
| +// responsiveness. |
| +window.__ready = false; |
| +var results = document.getElementById('results'); |
| +var spinner = document.getElementById('spinner'); |
| +var spinnerContainer = document.getElementById('spinner-container'); |
| +function animateSpinner(timestamp) { |
| + var width = parseInt(window.getComputedStyle(spinnerContainer).width); |
| + var x = -(timestamp / 8) % width; |
| + spinner.style.left = x + 'px'; |
| + window.requestAnimationFrame(animateSpinner); |
| +} |
| + |
| +function kickOffLoading() { |
| + var loadButton = document.getElementById('load'); |
| + loadButton.style.display = 'none'; |
| + |
| + var variant = |
| + location.search.length > 0 ? location.search.substr(1) : 'medium'; |
| + var script = document.createElement('script'); |
| + script.setAttribute('type', 'text/javascript') |
| + script.setAttribute('src', 'second_batch_js_' + variant + '.min.js') |
| + script.addEventListener('load', onLoadComplete); |
| + document.body.appendChild(script); |
| +} |
| + |
| +function onLoadComplete() { |
| + var runButton = document.getElementById('run'); |
| + runButton.style.display = 'block'; |
| + spinnerContainer.classList.add('spinner-loaded'); |
| + window.__ready = true; |
| +} |
| + |
| +function onClick() { |
|
rmcilroy
2015/03/17 13:59:36
nit - onRunClick() ?
Sami
2015/03/18 14:05:31
Done.
|
| + results.innerText = 'Your lucky number is: ' + main(1); |
| +} |
| + |
| +window.requestAnimationFrame(animateSpinner); |
|
rmcilroy
2015/03/17 13:59:36
nit - move this after you define the animateSpinne
Sami
2015/03/18 14:05:32
Done.
|
| +</script> |
| + |
| +</html> |