= WEB WORKERS = * 웹 워커 : ìžë°”스í¬ë¦½íЏ 코드를 백그ë¼ìš´ë“œì—서 실행하기 위한 ê¸°ìˆ * 워커 : 백그ë¼ìš´ë“œì—서 실행ë˜ëŠ” 코드, UI(DOM)과는 ì™„ì „ížˆ ë¶„ë¦¬ëœ í™˜ê²½ì—서 ë™ìž‘ * 현재 브ë¼ìš°ì €ì™€ 웹어플리케ì´ì…˜ì´ 가진 설계ìƒì˜ ë¬¸ì œë¡œ ìƒê²¨ë‚¨ * 현재 웹브ë¼ìš°ì €ëŠ” 웹페ì´ì§€ë¥¼ í•˜ë‚˜ì˜ ìŠ¤ë ˆë“œë¡œ 실행 * ì²˜ë¦¬í• ë‚´ìš©ì´ ë§Žì•„ì§€ë©´ 사용ìžëŠ” 페ì´ì§€ë¥¼ ì¡°ìž‘í• ìˆ˜ ì—†ìŒ * ì´ ë¬¸ì œë¥¼ 해결하기 위해 Web workers를 사용 * web workersê°€ ë©”ì¸ ìŠ¤ë ˆë“œ(웹 페ì´ì§€)와는 별ë„ì˜ ë°±ê·¸ë¼ìš´ë“œ 프로세스로 ìžë°”스í¬ë¦½íЏ 실행 * ë³‘ë ¬ 처리가능 * 종류 * ì¼ ëŒ€ ì¼ : <워커>, í•˜ë‚˜ì˜ ì›Œì»¤ ê°ì²´ì™€ í•˜ë‚˜ì˜ ë°±ê·¸ë¼ìš´ë“œ 프로세스가 ì¼ëŒ€ì¼ë¡œ ëŒ€ì‘ * 다 대 ì¼ : <ê³µìœ ì›Œì»¤>, ì—¬ëŸ¬ê°œì˜ ì›Œì»¤ ê°ì²´ê°€ í•˜ë‚˜ì˜ ë°±ê·¸ë¼ìš´ë“œ 프로세스와 ëŒ€ì‘ = 워커를 ì´ìš©í•œ í”„ë¡œê·¸ëž˜ë° = * 워커는 ìƒì„±ì‹œë¶€í„° UI와 다른 ìŠ¤ë ˆë“œì—서 ë™ìž‘ * UI와 워커 ìŠ¤ë ˆë“œëŠ” 변수를 ê³µìœ í• ìˆ˜ 없다. * ë”°ë¼ì„œ 워커는 DOMì— ì ‘ê·¼í• ìˆ˜ 없다. = ì›Œì»¤ì˜ ìƒì„± = * 워커 ì¸í„°íŽ˜ì´ìФ ìƒì„±ìžì— JavaScript 소스 파ì¼ì˜ URLì¸ìˆ˜ë¡œ ì „ë‹¬í•˜ë©´ 소스파ì¼ì„ ë‚´ë ¤ë°›ì•„ 백그ë¼ìš´ë“œì—서 실행한다 * ì§€ì—변수, ì§€ì—함수ì´ë¯€ë¡œ 외부ì—서 호출 불가! {{{ // workers.js를 실행하여 워커를 ìƒì„± var worker = new Worker("worker.js"); }}} = ì›Œì»¤ì™€ì˜ í†µì‹ = * 워커ì—게 메세지 ì†¡ì‹ * ì›Œì»¤ì™€ì˜ ë©”ì„¸ì§€ í†µì‹ ì€ postMessage()를 ì´ìš© {{{ // 워커ì—게 메세지 hello보냄 worker.postMessage("hello"); }}} {{{ // 워커ì—ì„œì˜ ë©”ì„¸ì§€ 처리 onmessage = function(e){ // 처리 }; }}} * ì›Œì»¤ì˜ ë©”ì„¸ì§€ ì†¡ì‹ {{{ // ì „ì—함수 postMessage 사용 postMessage("hello"); }}} {{{ // ì›Œì»¤ì˜ ë©”ì„¸ì§€ 처리 worker.onmessage = function(e){ // 처리 }; }}} = 워커 ìƒì„± = * 워커ìƒì„± : Worker ì´ìš© {{{ // worker.jsì´ìš©í•´ ìƒì„± var worker = new Worker("worker.js"); }}} * ê³µìœ ì›Œì»¤ ìƒì„± : SharedWorker ì´ìš© * ê³µìœ ì›Œì»¤ëŠ” 윈ë„ìš°ê°€ 달ë¼ë„ URLê³¼ ì´ë¦„ì´ ê°™ìœ¼ë©´ ê°™ì€ í”„ë¡œì„¸ìŠ¤ ê³µìœ {{{ var worker1 = new SharedWorker("worker.js", "wk"); var worker2 = new SharedWorker("worker.js", "wk"); }}} = 워커 ê°ì²´ì˜ 메소드 = * onerror : ì—러 í¬ì°©í•˜ê¸° 위한 ì´ë²¤íЏ 핸들러 * terminate() : 워커 ê°•ì œ 종료 * postMessage(message, [ports]) : 워커ì—게 메세지 보냄 * onmessage() : ì›Œì»¤ë¡œë¶€í„°ì˜ ë©”ì„¸ì§€ ìˆ˜ì‹ ì„ ìœ„í•œ ì´ë²¤íЏ 핸들러 = 워커ì—서 사용가능한 변수, 메서드, ìƒì„±ìž = * window, document사용 불가 * onmessage(), postMessage(), onconnect()등 사용가능 * (TODO : 표 추가 í•„ìš”)