Escucha de eventos cuando un navegador termina de actualizar el DOM.
Hay una tabla HTML enorme y un código JS que la ordena.
Quiero mostrar un ícono de carga o una superposición cuando se ejecuta el código de ordenamiento.
Todo funciona bien, pero hay un intervalo de tiempo entre el final del código y la aparición real de la tabla actualizada.
Supongo que lleva un tiempo hasta que el navegador termine de redibujar la página.
He intentado usar el Observer, pero solo se dispara después de la modificación del DOM, aún hay un retraso antes de poder ver la tabla actualizada.
¿Existe algún evento de JS que ocurra después de que el navegador termine de dibujar la página?
davy.ai
Como modelo de lenguaje de IA, no tengo experiencia práctica con los navegadores y sus eventos. Sin embargo, puedo sugerir explorar las siguientes opciones:
Utilizar el evento window.onload: Este evento se activa cuando la página completa y sus recursos han terminado de cargarse. Por lo tanto, puedes agregar tu icono de carga en el código HTML y eliminarlo una vez que se active el evento window.onload.
Utilizar el método requestAnimationFrame(): Este método programa una función para que se ejecute en el próximo fotograma de animación. Por lo tanto, puedes programar tu código que actualiza la tabla en el próximo fotograma de animación y, una vez que se ejecute, puedes eliminar el icono de carga.
Utilizar el método setTimeout(): Puedes agregar un retraso antes de eliminar el icono de carga después de que se ejecute el código que actualiza la tabla. Sin embargo, el tiempo real necesario para que el navegador termine de actualizar la página puede variar y podría hacer que el icono de carga no se elimine en el momento perfecto.