Как выполнить JS Promise асинхронно [дубликат]

На чтение 3 мин Просмотров 1 Опубликовано 11.10.2024

Вопрос или проблема

Я создал библиотеку для бенчмаркинга, которая выполняет несколько операций на компьютере пользователя для измерения его производительности. Я хочу запускать тест бенчмарка асинхронно, так как я хочу, чтобы пользователь продолжил свою работу в обычном режиме. Поэтому я создаю обещание, ожидая, что выполнение кода быстро пройдет мимо вызова (поскольку вызов должен быть асинхронным), и как только будет вызван “resolve”, результаты бенчмарка будут обработаны. Но выполнение ожидает 2 секунды (это время выполнения бенчмарка на моем компьютере), когда вызывается новый Promise. Я что-то делаю неправильно или я неправильно понимаю механизм обещаний? Мой код:

var benchmarkLib = new _benchmarkLib();

const promise = new Promise((resolve, reject) => {
    benchmarkLib.run();
    resolve();
});

promise.then(() => saveClientStat());

Ответ или решение

Для решения вопроса о том, как запускать JavaScript Promise асинхронно, важно сначала рассмотреть ваше текущее понимание Promise и то, как они работают в JS. Обратимся к основам:

Понимание работы JavaScript Promise

Promise в JavaScript по своей природе асинхронны, однако их использование не гарантирует автоматический не-блокирующий код. Когда вы создаете новый Promise, переданный в него код (executor function) выполняется сразу и синхронно до тех пор, пока не будет вызван resolve или reject. Assync используется именно в chain (цепочке) then и catch после разрешения или отклонения Promise.

Вот детальный анализ вашего кода:

var benchmarkLib = new _benchmarkLib();

const promise = new Promise((resolve, reject) => {
    benchmarkLib.run();
    resolve();
});

promise.then(() => saveClientStat());

Проблема:

Код внутри executor function в вашем Promise — benchmarkLib.run() — выполняется синхронно. Это означает, что если данный метод занимает несколько секунд, весь скрипт будет застопорен до завершения выполнения этой функции, и только затем Promise перейдет в состояние resolved и вызовет метод saveClientStat().

Решение:

Чтобы сделать выполнение асинхронным, вам нужно убедиться, что benchmarkLib.run() сама по себе работает асинхронно. Это может быть достигнуто разными способами:

Использование Асинхронных API:
Убедитесь, что внутри benchmarkLib.run() используются асинхронные операции, такие как setTimeout, setInterval, или работа с асинхронными функциями и методами.

Рефакторинг через setTimeout:
Если изменения внутри библиотеки невозможны, оберните вызов в setTimeout.

const promise = new Promise((resolve, reject) => {
   setTimeout(() => {
       benchmarkLib.run();
       resolve();
   }, 0); // Используем задержку в 0, чтобы выполнить сразу в следующем tick.
});

promise.then(() => saveClientStat());

Использование Web Workers:
Для действительно тяжелых операций, которые вы хотите вынести из основного потока исполнения, Web Workers могут быть полезным решением, однако это требует дополнительной настройки и управления сообщениями.
Использование Асинхронных Функций:
Если benchmarkLib.run() можно изменить, то вы можете переписать его как асинхронную функцию, внедряя концепт async/await, что автоматически сделает её не-блокирующей.

Подводя итог, ключ к асинхронности заключается в том, чтобы убедиться, что тяжёлые или долго выполняющиеся задачи выполняются в асинхронном режиме, что позволяет основному потоку JS продолжать выполнение других задач. Это улучшит пользовательский опыт и позволит вашему приложению оставаться отзывчивым.