Программисты JavaScript привыкли имитировать параллелизм, но есть способ добиться настоящего параллелизма, который вам следует использовать прямо сейчас.

JavaScript может бороться с задачами, требовательными к производительности, потому что это однопоточный язык. Используя параллелизм, вы можете добиться многопоточного выполнения в JavaScript и повысить производительность и скорость отклика ваших современных веб-приложений.

Параллелизм в программировании на JavaScript

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

Распространенным методом, используемым для достижения параллелизма в программировании, является многопоточность. Однако поток JavaScript представляет собой однопоточную систему и может одновременно обрабатывать только одну задачу. Это означает, что он не знаком с выполнением параллельных программ.

JavaScript подделывает параллельное программирование

instagram viewer

Распространенное заблуждение о параллелизме состоит в том, что его можно достичь с помощью методы асинхронного программирования например, async/await, обратные вызовы и обещания:

// Асинхронная/ожидающая функция, имитирующая сетевой запрос
асинхронныйфункциявыборка данных() {
константа ответ = Ждите принести();
константа данные = Ждите ответ.json();
возвращаться данные;
}

// Функция обратного вызова, которая записывает полученные данные в консоль
функцияlogData(данные) {
консоль.log (данные);
}

// Метод Promise.all(), выполняющий несколько промисов параллельно
Обещать.все([
выборка данных(),
выборка данных(),
]).затем((Результаты) => {
консоль.log (результаты);
});

// Вызываем функцию fetchData и передаем функцию logData в качестве обратного вызова
fetchData(). затем (logData);

Эти методы фактически не выполняют код параллельно. JavaScript использует цикл обработки событий, чтобы имитировать параллельное программирование в однопоточном дизайне.

Цикл событий является фундаментальной частью среды выполнения JavaScript. Это позволяет выполнять асинхронные операции, такие как сетевые запросы, в фоновом режиме, не блокируя основной отдельный поток.

Цикл событий постоянно проверяет наличие новых событий или задач в очереди и последовательно выполняет их одно за другим. Этот метод позволяет JavaScript достичь параллелизма и теоретического параллелизма.

Параллелизм против. Параллелизм

Параллелизм и параллелизм часто неправильно понимаются и меняются местами в мире JavaScript.

Параллелизм в JavaScript относится к возможности выполнять несколько задач путем перекрытия выполнения задач. Где одна задача может начаться до завершения другой, но задачи не могут ни начинаться, ни заканчиваться одновременно. Это позволяет JavaScript эффективно обрабатывать операции, например, получение данных из REST API или чтение файлов, не блокируя основной поток выполнения.

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

Приложения JavaScript могут достичь истинного параллелизма за счет использование веб-воркеров.

Веб-воркеры внедряют параллелизм в JavaScript

Веб-воркеры — это функция современных веб-браузеров, позволяющая выполнять код JavaScript в фоновых потоках, отдельно от основного потока выполнения. В отличие от основного потока, который обрабатывает взаимодействия с пользователем и обновления пользовательского интерфейса. Web Worker будет предназначен для выполнения ресурсоемких вычислительных задач.

Ниже представлена ​​схема работы Web Worker в JavaScript.

Основной поток и Web Worker могут взаимодействовать с помощью передачи сообщений. Используя postMessage способ отправки сообщений и сообщение обработчик событий для получения сообщений, вы можете передавать инструкции или данные туда и обратно.

Создание веб-воркера

Чтобы создать Web Worker, вам нужно создать отдельный файл JavaScript.

Вот пример:

// main.js

// Создаем новый веб-воркер
константа рабочий = новый Рабочий('рабочий.js');

// Отправляем сообщение веб-воркеру
рабочий.postMessage(«Привет из основной темы!»);

// Слушаем сообщения от Web Worker
рабочий.onmessage = функция(событие) {
консоль.бревно("Получено сообщение от Web Worker:", событие.данные);
};

В приведенном выше примере создается новый веб-воркер путем передачи пути к рабочему скрипту (рабочий.js) в качестве аргумента Рабочий конструктор. Вы можете отправить сообщение Web Worker, используя postMessage метод и прослушивать сообщения от Web Worker с помощью сообщение обработчик события.

Затем вы должны создать рабочий скрипт (рабочий.js) файл:

// рабочий.js

// Слушаем сообщения из основного потока
self.onmessage = функция(событие) {
консоль.бревно('Получено сообщение из основного потока:', событие.данные);

// Отправляем сообщение обратно в основной поток
self.postMessage("Привет от worker.js!");
};

Сценарий Web Worker прослушивает сообщения из основного потока, используя сообщение обработчик события. Получив сообщение, вы выходите из сообщения внутри событие.данные и отправить новое сообщение в основной поток с postMessage метод.

Использование параллелизма с веб-воркерами

Основной вариант использования Web Workers — параллельное выполнение ресурсоемких задач JavaScript. Перенеся эти задачи на веб-воркеров, вы можете добиться значительного повышения производительности.

Вот пример использования веб-воркеров для выполнения сложных вычислений:

// main.js

константа рабочий = новый Рабочий('рабочий.js');

// Отправляем данные в Web Worker для расчета
рабочий.postMessage([1, 2, 3, 4, 5]);

// Слушаем результат от Web Worker
рабочий.onmessage = функция(событие) {
константа результат = событие.данные;
консоль.бревно('Результат расчета:', результат);
};

Рабочий.js:

// Слушаем данные из основного потока
self.onmessage = функция (событие) {
константа числа = событие.данные;

константа результат = выполнить тяжелый расчет (числа);

// Отправляем результат обратно в основной поток
self.postMessage (результат);
};

функциявыполнитьтяжелый расчет(данные) {
// Выполняем сложные вычисления над массивом чисел
возвращаться данные
.карта((число) =>Математика.pow (число, 3)) // Кубирование каждого числа
.фильтр((число) => число % 20) // Фильтровать четные числа
.уменьшать((сумма, число) => сумма + число, 0); // Суммируем все числа
}

В этом примере вы передаете массив чисел из основного потока в Web Worker. Web Worker выполняет вычисления, используя предоставленный массив данных, и отправляет результат обратно в основной поток. выполнитьтяжелый расчет() Функция сопоставляет каждое число с его кубом, отфильтровывает четные числа и, наконец, суммирует их.

Ограничения и соображения

Хотя Web Workers предоставляют механизм для достижения параллелизма в JavaScript, важно учитывать несколько ограничений и соображений:

  • Нет общей памяти: веб-воркеры работают в отдельных потоках и не делят память с основным потоком. Таким образом, они не могут напрямую обращаться к переменным или объектам из основного потока без передачи сообщений.
  • Сериализация и десериализация: при передаче данных между основным потоком и веб-воркерами вам необходимо сериализовать и десериализовать данные, так как передача сообщений является текстовой связью. Этот процесс влечет за собой снижение производительности и может повлиять на общую производительность приложения.
  • Поддержка браузера: хотя веб-воркеры хорошо поддерживаются в большинстве современных веб-браузеров, некоторые старые браузеры или ограниченные среды могут иметь частичную поддержку или не поддерживать веб-воркеры.

Добейтесь истинного параллелизма в JavaScript

Параллелизм в JavaScript — захватывающая концепция, которая обеспечивает истинное параллельное выполнение задач даже в основном однопоточном языке. С введением Web Workers вы можете использовать возможности параллелизма и добиться значительного повышения производительности в ваших приложениях JavaScript.