¿Cuántos repintados del DOM provocará la adición de niños en un bucle for?
Tenía la impresión de que esto causaría 200. 1 por cada vez que se agrega un elemento y 1 cada vez que se actualiza su contenido de texto.
Pero, en la charla de Jake Archibald en JSConf , parece mencionar que los navegadores unirán esto por lotes.
for (let i = 0; i < 100; i++){ const div = document.createElement('div'); document.body.appendChild(div); div.textContent = 'Hello'; }Sólo una vez; vea la continuación de Erin Zimmer en la canalización de renderizado https://youtu.be/u1kqx6AenYw
Además, puedes probarlo con algo como:
//document.body.innerHTML = ''; for (let i = 0; i < 100; i++){ const div = document.createElement('div'); document.body.appendChild(div); div.textContent = 'Hello'; let x = 0; for(let j = 0; j < 1e7; j++){ x += Math.sin(Math.random()) } }```