Recent Posts
Recent Comments
Link
11-17 02:31
Today
Total
관리 메뉴

삶 가운데 남긴 기록 AACII.TISTORY.COM

javascript Web Workers 본문

DEV&OPS/Javascript

javascript Web Workers

ALEPH.GEM 2022. 3. 21. 09:03

자바스크립트에서 메인 스레드 외에 Web Wokers에서 병렬로 처리되는 스레드를 워커(woker)라고 합니다.

워커와 메인 스레드는 서로 다른 전역 객체를 가지기 때문에 상대방의 전역 객체를 참조할 수 없습니다.

그래서 워커와 메인 스레드 사이에는 postMessage를 사용한 비동기 통신만 가능합니다.

 

Worker 객체 생성

var worker = new Worker("worker.js");

메인스레드와 같은 디렉터리에 있는 worker.js 가 워커를 정의한 자바스크립트 파일입니다.

Worker생성자의 인수로 URL(같은 사이트)을 넘길 수 있습니다.

 

 

워커에 메시지 전송

worker.postMessage("message");

worker 인스턴스가 생성되면 postMessage로 메시지를 보낼 수 있습니다.

 

 

워커에서 메시지 받기

워커에서 메시지를 받으려면 전역 객체에 message이벤트 처리기를 등록해야 합니다.

메인 스레드에서 보낸 데이터는 이벤트 객체의 data 프로퍼티에 들어있습니다.

self.onmessage = function(e){
    var message = e.data;
    ...
}

 

 

워커에서 메인 스레드로 메시지 보내기

self.postMessage("message");

전역 객체인 self는 생략 가능합니다.

 

 

메인스레드에서 워커의 메시지 받기

비동기 통신이기 때문에 마찬가지로 전역 객체에 message 이벤트 처리기를 등록해야 합니다.

마찬가지로 이벤트 객체의 data 프로퍼티에서 읽어 옵니다.

worker.onmessage = function(e){
    var message = e.data;
    ...
};

 

 

메인 스레드에서 워커 스레드 강제 종료

worker.terminate();

 

 

워커 스레드 스스로 종료

close();

 

 

 

 

 

 

 

 

 

 

728x90

'DEV&OPS > Javascript' 카테고리의 다른 글

javascript 로 select box option 다루기 예제  (0) 2022.04.19
jquery ajax post 예제  (0) 2022.04.19
javascript BLOB  (0) 2022.03.18
javascript 드래그 앤 드롭  (0) 2022.03.17
javascript class  (0) 2022.03.15