Многопоточность — это способность любой программы выполнять несколько потоков одновременно. Как мы знаем, JavaScript — это однопоточный язык программирования, что означает, что он имеет один поток, который последовательно обрабатывает все выполнение. Однопоточный означает, что за один раз запускается одна строка кода. Первоначально Javascript был однопоточным, потому что он просто использовался в языке сценариев веб-браузера для одного пользователя, но в настоящее время он превратился во что-то большее и сделал вычисления очень огромными.
Существуют различные методы стимулирования многопоточности в JavaScript:
Web Workers
Web Workers дают нам возможность писать многопоточный JavaScript, который не блокирует DOM. Даже асинхронные операциив некоторой степени блокируют DOM. С другой стороны, веб-воркеры помогают нам решить эту проблему, избегая однопоточной среды и повышая производительность наших веб-страниц. По сути, веб-работники запускают скрипт в фоновом потоке, что позволяет избежать вмешательства в пользовательский интерфейс. Из-за особенности фонового потока мы можем создать или запустить дорогостоящую операцию.
Пример 1: В этом примере мы покажем, в чем разница в поведении нашей страницы с воркерами и без них.
- main.js
Javascript
// Creating new web worker
const worker =
new
Worker(
'worker.js'
);
let message =
'Hello'
;
// Message using postMessage
worker.postMessage(message);
// Response
worker.onmessage =
function
(e) {
console.log(e.data);
};
- worker.js
Javascript
self.onmessage =
function
(e) {
if
(e.data !== undefined) {
let total = e.data +
'Geeks'
;
self.postMessage(total)
}
}
Выход:
'Hello Geeks'
Объяснение: В этом примере мы создали два файла JavaScript: main.js и worker.js. main.js представляет основной файл, а worker.js — рабочий файл. В приведенном выше примере рабочий процесс объединяет полученную строку с определенной и отправляет ее обратно в файл main.js, не прерывая работу страницы.
Асинхронное программирование
При асинхронных вызовах следующий оператор выполняется, даже не дожидаясь выполнения предыдущего. JavaScript предоставляет нам обратные вызовы, промисы и async/await для выполнения неблокирующей функции. С помощью асинхронного программирования мы достигаем параллельного поведения, инициируя многопоточность, а также обрабатывая ее завершение.
Пример 2. В этом примере мы используем функцию setTimeout() для асинхронной программы, чтобы проиллюстрировать многопоточность в Javascript.
Javascript
console.log(
"Starting..."
);
setTimeout(
function
() {
console.log(
"Welcome to geeksforgeeks"
);
}, 2000);
console.log(
"Ending..."
);
Вывод: приведенный выше пример показывает, что когда мы используем асинхронную программу, код не блокируется, фактически он выполняет следующую строку, а функция выполняется через указанное время.
Starting... Ending... Welcome to geeksforgeeks