#web_workers — Public Fediverse posts

Один поток, а всё успевает: как работает цикл событий в JavaScript

Promise , setTimeout и async/await часто работают совсем не в том порядке, которого ждёшь по коду, а тяжёлая синхронная функция способна заморозить весь интерфейс. Разберём модель цикла событий, которая объясняет эти эффекты и помогает понимать, где возникают блокировки, гонки запросов и лишние задержки.

https://habr.com/ru/companies/otus/articles/1062056/

#цикл_событий #JavaScript #асинхронность #стек_вызовов #микрозадачи #макрозадачи #промисы #setTimeout #Web_Workers

Web Workers и React: как разгрузить UI и ускорить приложение

Всем, привет, меня зовут Дмитрий, я React-разработчик, и я снова здесь и попробую сегодня рассказать про Web Workers. Если вы хоть раз пробовали обрабатывать большой файл, парсить массив из сотен тысяч элементов или запускать сложные вычисления прямо в React-компоненте, то наверняка сталкивались с тем, что интерфейс подвисает, кнопки перестают реагировать, анимации застывают, и всё на секунду подвисает, пока скрипт не разлучит нас (ой, это не из этой сказки) завершит свою работу. Почему так происходит? Всё дело в том, что React, как и JS, в браузере работает на одном основном потоке. Точнее, чтобы меня не закидали помидорами, React — это библиотека JS, и она полностью работает в основном потоке браузера, который однопоточен. Когда вы запускаете тяжёлую синхронную задачу, она полностью занимает этот поток и блокирует его, мешая браузеру рендерить интерфейс и обрабатывать события пользователя. В современном фронтенде отзывчивость интерфейса — требование по умолчанию. Пользователи ожидают, что ваше приложение будет мгновенно реагировать на действия, даже если оно выполняет тяжёлые вычисления или загружает большие объёмы данных. В этой статье мы разберём, как можно решить эту проблему одним из вариантов — с помощью Web Workers.

https://habr.com/ru/companies/gnivc/articles/932256/

#web_workers #react #javascript #ui #оптимизаци #reactjs #reactjs