Am niste casete de selectare, care atunci când a făcut clic va provoca o mulțime de modificări în DOM, și acesta îngheață la cerere pentru mai multe secunde. Aș vrea casetele de selectare pentru a actualiza în primul rând, și/sau pentru a afișa o așteptare indicator. Am încercat diferite lucruri, dar pentru unii motiv, nimic altceva în DOM se va actualiza înainte de înghețare. Modificările sunt făcute la o masă mare, fie eliminarea sau adăugarea de coloane întregi, și se comportă ca și cum acest lucru are prioritate față de orice altceva, pentru orice alte încercări de a actualiza DOM după ce faceți clic pe caseta de selectare nu trece prin până la masă a finalizat re-randare. FWIW pot folosi consola.jurnal pentru a afișa un mesaj înainte de masă actualizări, și, de asemenea, după ce se completează pentru un anumit motiv.
0
import {tick} from "svelte";
let checked = false;
$: applyChanges(checked);
async function applyChanges() {
messageVisible = true
await tick()
requestAnimationFrame(() => {
requestAnimationFrame(() => {
// do the stuff that causes a lots of dom updates
})
})
}
La await tick() aplică messageVisible modificări la DOM.
Dublu raf va astept pe browser-ul pentru a trage actualizat DOM.