Tengo una función que hace algunos cálculos que tarda entre 2 y 3 segundos. Mientras se ejecuta esa función, quiero mostrar un cargador en la página, hasta que finalice la función. Sin embargo, el cargador no se inserta en la página hasta que finaliza la función. La función inserta un lienzo que muestra los resultados una vez que finaliza, ¿tal vez eso esté causando un problema? Porque cuando reemplazo esa función con setTimeout, no tengo ningún problema. También lo reemplacé con una función que registra "HI" 10000 veces, pero obtengo el mismo efecto que con setTimeout; el cargador se muestra correctamente. Código usado:
var header = document.querySelector(".header"); var loader = document.createElement("div"); loader.className = "loader"; header.append(loader); var master = new CalculatingMaster(); master.calculateAndDisplayResults();