Last active
February 25, 2019 23:10
-
-
Save joeljeske/b53f6c3aede1aea5fb397cdd68ffbfc9 to your computer and use it in GitHub Desktop.
Reproduce Chrome 72.x Android Layout CPU Spike
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
</head> | |
<body> | |
<span id="test"></span> | |
<p> | |
Click on the buttons below to use 'n' number of children in the inline container. | |
<br /> | |
On my test device, 20-23 children made the CPU spike | |
<p> | |
<button onclick="updateChildren(5)">Use 5 Children</button><br /> | |
<button onclick="updateChildren(10)">Use 10 Children</button><br /> | |
<button onclick="updateChildren(15)">Use 15 Children</button><br /> | |
<button onclick="updateChildren(20)">Use 20 Children</button><br /> | |
<button onclick="updateChildren(25)">Use 25 Children</button><br /> | |
<button onclick="updateChildren(30)">Use 30 Children</button><br /> | |
<button onclick="updateChildren(35)">Use 35 Children</button><br /> | |
<script> | |
function updateChildren(count) { | |
document.getElementById('test').innerHTML = '<span><div>child</div></span>'.repeat(count); | |
} | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment