IT

자바스크립트 "Web Workers API"

아름다운전진 2023. 3. 9. 08:08
728x90

Web Workers API는 기본 실행 스레드와 별도로 백그라운드에서 스크립트를 실행하는 방법입니다. 이는 사용자 인터페이스를 차단하지 않고 CPU를 많이 사용하는 작업이나 장기 실행 작업을 실행하는 데 유용할 수 있습니다.

기본 개념

작업자(Worker) 만들기

새 작업자를 만들려면 `Worker` 생성자를 사용해야 합니다. 이 생성자는 작업자에서 실행될 JavaScript 파일의 URL인 단일 인수를 사용합니다.

const myWorker = new Worker('worker.js');

작업자(Worker)와 통신

작업자에게 메시지를 보내려면 `postMessage` 메서드를 사용할 수 있습니다. 이 메서드는 JSON 직렬화 가능 개체일 수 있는 단일 인수를 사용합니다.

myWorker.postMessage({ action: 'start' });

작업자로부터 메시지를 받으려면 `message` 이벤트를 수신해야 합니다. 이 이벤트는 작업자가 기본 스레드로 메시지를 다시 보낼 때마다 시작됩니다.

myWorker.onmessage = function(event) {

console.log('Received message:', event.data);

};

작업자(Worker) 종료

작업자를 종료하려면 `termetate` 메서드를 사용할 수 있습니다. 이 메서드는 작업자를 즉시 중지하고 사용 중이던 모든 리소스를 해제합니다.

myWorker.terminate();

예제 : 피보나치 수 계산

웹 작업자를 사용하는 한 가지 전형적인 예는 피보나치 수를 계산하는 것입니다. 다음은 작업자를 사용하여 특정 숫자까지 피보나치 수열을 계산하는 방법의 예입니다.

// main.js

const myWorker = new Worker('worker.js');

myWorker.onmessage = function(event) {

console.log('Fibonacci sequence:', event.data);

};

myWorker.postMessage(50); // Calculate the Fibonacci sequence up to 50

// worker.js

function fibonacci(n) {

if (n < 2) {

return n;

} else {

return fibonacci(n - 1) + fibonacci(n - 2);

}

}

onmessage = function(event) {

const result = [];

for (let i = 0; i <= event.data; i++) {

result.push(fibonacci(i));

}

postMessage(result);

};

이 예제에서 `main.js` 파일은 새 작업자를 만들고 숫자 50을 보냅니다. 그런 다음 `worker.js` 파일은 최대 50까지 피보나치 수열을 계산하고 그 결과를 다시 기본 스레드로 보냅니다.

728x90