| <!DOCTYPE html> |
| <title>Custom Highlights Painting Baseline</title> |
| <style> |
| .example > p > span { |
| color: blue; |
| background: yellow; |
| } |
| </style> |
| <script src="../resources/runner.js"></script> |
| <script src="resources/paint.js"></script> |
| <pre id="log"></pre> |
| <script> |
| const REPETITIONS = 1000; |
| const LOREM_IPSUM = "Lorem ipsum dolor sit <span>a</span>met, consectetur <span>a</span>dipiscing elit, sed do eiusmod tempor incididunt ut l<span>a</span>bore et dolore m<span>a</span>gn<span>a</span> <span>a</span>liqu<span>a</span>. Ut enim <span>a</span>d minim veni<span>a</span>m, quis nostrud exercit<span>a</span>tion ull<span>a</span>mco l<span>a</span>boris nisi ut <span>a</span>liquip ex e<span>a</span> commodo consequ<span>a</span>t. Duis <span>a</span>ute irure dolor in reprehenderit in volupt<span>a</span>te velit esse cillum dolore eu fugi<span>a</span>t null<span>a</span> p<span>a</span>ri<span>a</span>tur. Excepteur sint occ<span>a</span>ec<span>a</span>t cupid<span>a</span>t<span>a</span>t non proident, sunt in culp<span>a</span> qui offici<span>a</span> deserunt mollit <span>a</span>nim id est l<span>a</span>borum."; |
| |
| function setupTest() { |
| for (let i = 0; i < REPETITIONS; i++) { |
| let p = document.createElement("p"); |
| p.innerHTML = LOREM_IPSUM; |
| document.body.appendChild(p); |
| } |
| } |
| |
| setupTest(); |
| |
| measurePaint({ |
| description: "Measure time for painting <span> elements to be used as baseline for Custom Highlights (emulates searching 'a' in a large text)", |
| run: () => document.body.className = "example", |
| setup: () => document.body.className = "", |
| }); |
| </script> |
