tests: Vendor blink perf tests (#38654)

Vendors the [blink perf
tests](https://chromium.googlesource.com/chromium/src/+/HEAD/third_party/blink/perf_tests/).
These perf tests are useful to evaluate the performance of servo. 
The license that governs the perf tests is included in the folder. 
Running benchmark cases automatically is left to future work.

The update.py script is taken from mozjs and slightly adapted, so we can
easily filter
(and patch if this should be necessary in the future.

Testing: This PR just adds the perf_tests, but does not use or modify
them in any way.

---------

Signed-off-by: Jonathan Schwender <schwenderjonathan@gmail.com>
This commit is contained in:
Jonathan Schwender 2025-08-17 11:54:04 +02:00 committed by GitHub
parent 7621332824
commit ee781b71b4
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
648 changed files with 359694 additions and 0 deletions

View file

@ -0,0 +1,29 @@
<!DOCTYPE html>
<script src="../resources/runner.js"></script>
<div id="target"></div>
<script type='text/javascript'>
const kElements = 20000;
const selection = getSelection();
let range;
PerfTestRunner.measureTime({
description: `Measures performance of add a Range in a DOM tree of ${kElements} elements`,
setup: () => {
const fragments = []
for (let i = 0; i < kElements; ++i)
fragments.push(`<span>foo bar baz ${i} </span>`);
target.innerHTML = fragments.join('');
range = document.createRange();
range.setStart(target, 0);
},
run: () => {
selection.removeAllRanges();
selection.addRange(range);
},
done: () => {
target.innerHTML = '';
}
});
</script>

View file

@ -0,0 +1,22 @@
<!doctype html>
<script src="../resources/runner.js"></script>
<div id="hidden" style="height:0px; overflow:hidden;"></div>
<input type="password">
<script>
const kCount = 100;
const hidden = document.getElementById('hidden');
const password = document.querySelector('input[type=password]');
hidden.innerHTML= '<p>foo bar</p>'.repeat(999);
PerfTestRunner.measureTime({
description: 'Measures performance of delete in password field with many hidden elements',
setup: () => {
password.value = 'x'.repeat(kCount);
password.focus();
},
run: () => {
for (let counter = 0; counter < kCount; ++counter)
document.execCommand('delete');
},
});
</script>

View file

@ -0,0 +1,28 @@
<!DOCTYPE html>
<script src="../resources/runner.js"></script>
<div id="container" style="background-color:lime;" contenteditable></div>
<script>
var div = document.querySelector('div');
div.focus();
PerfTestRunner.measureRunsPerSecond({
description: "Measures performance of adding new lines to an editable div using document.execCommand, then clearing it.",
run: function() {
for (var i = 0; i < 500; ++i)
document.execCommand('InsertLineBreak');
for (var i = 0; i < 500; ++i)
document.execCommand('Delete');
for (var i = 0; i < 500; ++i)
document.execCommand('InsertLineBreak');
// Move cursor to the beginning of div.
var range = document.createRange();
range.selectNodeContents(div);
range.collapse(true);
getSelection().removeAllRanges();
getSelection().addRange(range);
for (var i = 0; i < 500; ++i)
document.execCommand('ForwardDelete');
}
});
</script>

View file

@ -0,0 +1,19 @@
<!doctype html>
<script src="../resources/runner.js"></script>
<div id="target">target</div>
<div id="sample" style="display: none"></div>
<script>
var selection = window.getSelection();
selection.selectAllChildren(document.getElementById('target'));
var sample = document.getElementById('sample');
var sampleHTML = new Array(1000).join('<br>');
PerfTestRunner.measureTime({
description: 'Measures performance of innerHTML setter with selection.',
run: function() {
sample.innerHTML = sampleHTML;
sample.innerHTML = '';
},
});
</script>

View file

@ -0,0 +1,46 @@
<!doctype html>
<style>
#sample {
font: 10px/14px monospace;
width: 80ch;
border: solid 3px green;
padding: 5px;
height: 300px;
overflow: scroll;
}
span {
background: rgba(250, 250, 250);
}
</style>
<script src="../resources/runner.js"></script>
<script src="../paint/resources/paint.js"></script>
<div id="sample" contenteditable></div>
<script>
const NUMBER_OF_ELEMENTS = 1000 * 10;
const MOVE_COUNT = NUMBER_OF_ELEMENTS / 10;
const selection = window.getSelection();
const sample = document.getElementById('sample');
PerfTestRunner.measureTime({
description: 'Measures performance of Selection#collapse() with many spans.',
setup: function() {
sample.innerHTML = '';
for (let index = 0; index < NUMBER_OF_ELEMENTS; ++index) {
const span = document.createElement('span');
span.innerHTML = `${index} `;
span.setAttribute('id', `e${index}`);
sample.appendChild(span);
if (index % 100 === 99)
sample.appendChild(document.createElement('br'));
}
},
run: function() {
const start = document.getElementById(`e${NUMBER_OF_ELEMENTS - 1}`);
const end = document.getElementById(`e${NUMBER_OF_ELEMENTS -100}`);
selection.collapse(start.firstChild, 0);
for (let i = 0; i < MOVE_COUNT; ++i)
selection.modify('extend', 'backward', 'character');
},
});
</script>

View file

@ -0,0 +1,45 @@
<!doctype html>
<style>
#sample {
font: 10px/14px monospace;
width: 80ch;
border: solid 3px green;
padding: 5px;
height: 300px;
overflow: scroll;
}
span {
background: rgba(250, 250, 250);
}
</style>
<script src="../resources/runner.js"></script>
<script src="../paint/resources/paint.js"></script>
<div id="sample" contenteditable></div>
<script>
const NUMBER_OF_ELEMENTS = 1000 * 10;
const SELECT_ALL_COUNT = NUMBER_OF_ELEMENTS / 10;
const selection = window.getSelection();
const sample = document.getElementById('sample');
PerfTestRunner.measureTime({
description: 'Measures performance of Selection#collapse() with many spans.',
setup: function() {
sample.innerHTML = '';
for (let index = 0; index < NUMBER_OF_ELEMENTS; ++index) {
const span = document.createElement('span');
span.innerHTML = `${index} `;
span.setAttribute('id', `e${index}`);
sample.appendChild(span);
if (index % 100 === 99)
sample.appendChild(document.createElement('br'));
}
},
run: function() {
for (let i = 0; i < SELECT_ALL_COUNT; ++i) {
selection.collapse(sample, 0);
document.execCommand('selectAll');
}
},
});
</script>

View file

@ -0,0 +1,27 @@
<!DOCTYPE html>
<script src="../resources/runner.js"></script>
<div id="div" hidden></div>
<p id="container" contenteditable>foo</p>
<script>
const kElements = 20000;
div.innerHTML = '<div>test</div>'.repeat(kElements);
container.focus();
container.hidden = true;
var div2 = document.createElement('div');
PerfTestRunner.measureTime({
description: `Measures performance of WebViewImpl::handleInputEvent when selection null and has ${kElements} hidden elements`,
setup: () => {
eventSender.mouseMoveTo(0, 0);
document.body.appendChild(div2);
},
run: () => {
eventSender.mouseMoveTo(100, 100);
},
done: () => {
document.body.removeChild(div2);
}
});
</script>

View file

@ -0,0 +1,36 @@
<!doctype html>
<script src="../resources/runner.js"></script>
<div id="sample"></div>
<script>
const kElements = 10000;
const metaElements = (() => {
const result = [];
for (let count = 0; count < kElements; ++count)
result.push('<meta>', '</meta>');
return result;
})();
const sample = document.getElementById('sample');
sample.innerHTML = [
'<h1 id="before">first line of renderered text</h1>',
'<div hidden>', ...metaElements, '</div>',
'<h1 id="target">second line of renderered text</h1>',
'<div hidden>', ...metaElements, '</div>',
'<h1 id="after">third line of renderered text</h1>',
].join('');
const selection = window.getSelection();
PerfTestRunner.measureTime({
description: 'Measures performance of move-down through non-renderered elements',
setup: () => {
selection.removeAllRanges();
const target = document.getElementById('target');
selection.collapse(target.firstChild, 5);
selection.extend(target.firstChild, 10);
},
run: () => {
selection.modify('extend', 'forward', 'line');
},
});
</script>

View file

@ -0,0 +1,36 @@
<!doctype html>
<script src="../resources/runner.js"></script>
<div id="sample"></div>
<script>
const kElements = 10000;
const metaElements = (() => {
const result = [];
for (let count = 0; count < kElements; ++count)
result.push('<meta>', '</meta>');
return result;
})();
const sample = document.getElementById('sample');
sample.innerHTML = [
'<h1 id="before">first line of renderered text</h1>',
'<div hidden>', ...metaElements, '</div>',
'<h1 id="target">second line of renderered text</h1>',
'<div hidden>', ...metaElements, '</div>',
'<h1 id="after">third line of renderered text</h1>',
].join('');
const selection = window.getSelection();
PerfTestRunner.measureTime({
description: 'Measures performance of move-up through non-renderered elements',
setup: () => {
selection.removeAllRanges();
const target = document.getElementById('target');
selection.collapse(target.firstChild, 5);
selection.extend(target.firstChild, 10);
},
run: () => {
selection.modify('extend', 'backward', 'line');
},
});
</script>

View file

@ -0,0 +1,35 @@
<!DOCTYPE html>
<body>
<script src="../resources/runner.js"></script>
<script src="resources/line-layout-perf-test.js"></script>
<style>
#container {
width: 400px;
height: 200px;
overflow: scroll;
}
</style>
<div id="container"></div>
<script>
const NUMBER_OF_WORDS = 300;
const NUMBER_OF_MOVES = 500;
const container = document.getElementById('container');
const selection = window.getSelection();
for (let wordCount = NUMBER_OF_WORDS; wordCount > 0; --wordCount) {
const word = document.createElement('span');
word.textContent = Math.random().toString(36).slice(2) + ' ';
container.appendChild(word);
}
PerfTestRunner.measureRunsPerSecond({
setup: () => {
},
run: () => {
container.scrollTo(0, container.scrollHeight);
selection.collapse(container, container.childNodes.length);
for (let i = 0; i < NUMBER_OF_MOVES; ++i)
selection.modify('extend', 'backward', 'character');
},
});
</script>

View file

@ -0,0 +1,26 @@
<!doctype html>
<script src="../resources/runner.js"></script>
<textarea id="text" style="width:300px; height:300px" spellcheck="false"></textarea>
<script>
const kCount = 10;
const kLines = 20000
const kCharactersPerPage = 482;
text.textContent = (() => {
const result = [];
for (let count = 0; count < kLines; ++count)
result.push(`${('00000' + count).slice(-5)} of brown foxes\n`);
return result.join('');
})();
text.focus();
PerfTestRunner.measureRunsPerSecond({
description: 'Measures performance of move-page-down on many lines',
run: () => {
const cursorIndex = text.value.length - 1 - kCharactersPerPage * kCount;
text.setSelectionRange(cursorIndex, cursorIndex);
for (let counter = 0; counter < kCount; ++counter)
testRunner.execCommand("MovePageDown");
},
});
</script>

View file

@ -0,0 +1,25 @@
<!doctype html>
<script src="../resources/runner.js"></script>
<textarea id="text" style="width:300px; height:300px" spellcheck="false"></textarea>
<script>
const kCount = 10;
const kLines = 20000
text.textContent = (() => {
const result = [];
for (let count = 0; count < kLines; ++count)
result.push(`${('00000' + count).slice(-5)} of brown foxes\n`);
return result.join('');
})();
text.focus();
PerfTestRunner.measureRunsPerSecond({
description: 'Measures performance of move-page-up on many lines',
run: () => {
const cursorIndex = text.value.length - 1;
text.setSelectionRange(cursorIndex, cursorIndex);
for (let counter = 0; counter < kCount; ++counter)
testRunner.execCommand("MovePageUp");
},
});
</script>

View file

@ -0,0 +1,25 @@
<!doctype html>
<script src="../resources/runner.js"></script>
<div id="target">target</div>
<div id="sample" style="display: none"></div>
<script>
var selection = window.getSelection();
selection.selectAllChildren(document.getElementById('target'));
var sample = document.getElementById('sample');
for (var index = 0; index < 1000; ++index) {
var span = document.createElement('span');
span.textContent = `item ${index}\n`;
sample.appendChild(span);
}
PerfTestRunner.measureTime({
description: 'Measures performance of removeChild() with selection.',
run: function() {
var copy = sample.cloneNode(true);
while (sample.firstChild)
sample.removeChild(sample.firstChild);
while (copy.firstChild)
sample.appendChild(copy.firstChild);
},
});
</script>

View file

@ -0,0 +1,30 @@
<!DOCTYPE html>
<body>
<style>
textarea:valid {
background-color: lime;
}
textarea:invalid {
background-color: red;
}
</style>
<script src="../resources/runner.js"></script>
<textarea maxlength=2147483647 id="container"></textarea>
<script>
var container = document.getElementById('container');
var nodes = [];
var childCount = 1000;
// Vary the text nodes added, avoiding secondary effects of using identical strings and allocation reuse.
for (var i = 0; i < childCount; ++i)
nodes.push(document.createTextNode('A quick brown fox jumps over the ' + i + 'th lazy dog.\n'));
PerfTestRunner.measureRunsPerSecond({
description: "Measures performance of adding text nodes to a textarea, then clearing it.",
run: function() {
for (var i = 0; i < childCount; ++i)
container.appendChild(nodes[i]);
container.innerHTML = '';
}
});
</script>
</body>

View file

@ -0,0 +1,25 @@
<!DOCTYPE html>
<body>
<style>
textarea:valid {
background-color: lime;
}
textarea:invalid {
background-color: red;
}
</style>
<script src="../resources/runner.js"></script>
<textarea maxlength=2147483647 id="container"></textarea>
<script>
var container = document.getElementById('container');
container.focus();
PerfTestRunner.measureRunsPerSecond({
description: "Measures performance of adding text to a textarea using document.execCommand, then clearing it.",
run: function() {
for (var i = 0; i < 500; ++i)
document.execCommand('insertText', false, 'A quick brown fox jumps over the lazy dog.\n');
container.value = '';
}
});
</script>
</body>