Как сделать паузу в js вычислениях, чтобы отрисовать изменения?

Question

[zzmaster]

Есть страница, которая грузит большой текст из localStorage и небыстро его по html рассовывает. Перед началом операции я показываю css лоадер. Однако, лоадер не анимируется, видимо браузеру недосуг. Как выделить браузеру кусок времени, чтоб он отрисовывал лоадер?

Comments

[RAX7]

https://habr.com/ru/company/timeweb/blog/587908/#r...

Answer 1

[Сергей Соколов]

Как вариант, всю тяжёлую работу передать в web worker.

1. показать лоадер
   
2. вынуть из localStorage данные, и отправить их в worker
   
3. спиннер крутится, воркер в другом треде считает
   
4. воркер наконец пришлёт ответ: большой кусок готового HTML
   
5. вставить весь полученный HTML разом
   
6. скрыть спиннер
   

Answer 2

[Rsa97]

JS каждой страницы в браузере однопоточный. Поэтому для того, чтобы на странице что-то происходило, вам необходимо разбить свой код на быстро выполняющиеся фрагменты так, чтобы каждый фрагмент вызывал следующий через setTimeout. Тогда между этими фрагментами браузер сможет обрабатывать события пользовательского интерфейса.