>웹 프론트엔드 >JS 튜토리얼 >HTML5 웹 워커와의 JavaScript 스레딩

HTML5 웹 워커와의 JavaScript 스레딩

尊渡假赌尊渡假赌尊渡假赌
尊渡假赌尊渡假赌尊渡假赌원래의
2025-03-08 00:51:09207검색

JavaScript Threading With HTML5 Web Workers

키 포인트

JavaScript의 웹 작업자는 브라우저의 강력한 기능으로 개발자가 별도의 스레드에서 연속 프로세스를 실행할 수있게하여 클라이언트 성능을 크게 향상시킬 수 있습니다. 그러나 브라우저 UI 스레드와 독립적으로 실행되며 페이지에서 DOM, 글로벌 변수 또는 JavaScript 함수에 액세스 할 수없는 제한 사항이 있습니다. 전용 웹 워커와 제작하고 통신하기 위해 개발자는 JavaScript 파일 이름을 작업자 객체의 새 인스턴스로 전달하고 이벤트 인터페이스를 통해 모든 통신을 처리합니다. 웹 스크립트는 메소드를 통해 단일 데이터 매개 변수를 전달하고

이벤트 핸들러를 통해 리턴 데이터를 수신합니다.
    최신 브라우저는 웹 작업자를 널리 지원하지만 인터넷 익스플로러 버전은 없습니다. 표준 JavaScript 데이터 유형을 사용하고 XMLHTTPREQUEST (AJAX) 호출을 프로세스하고 타이머 사용, 다른 작업자 가져 오기, 대규모 데이터 블록 분석, 게임 AI 논리 및 광선 추적과 같은 시간이 소요되는 작업을 처리하는 데 이상적입니다.
  • 전환, 네이티브 비디오, 시맨틱 태그 및 기타 화려한 HTML5 기능을 제외하고는 JavaScript가 제공되기 때문에 웹 워커는 브라우저에서 가장 좋은 기능입니다! 웹 작업자는 궁극적으로 개발자가 별도의 스레드에서 진행중인 프로세스를 실행할 수 있도록합니다. 스레딩은 복잡해 보이고 일부 개발 언어로 인해 까다로워 지지만 JavaScript가 잘 구현되고 W3C 작업 초안이 안정적이라는 소식을 듣고 기쁩니다. 웹 작업자는 엄청난 고객 성능 향상을 제공하지만 시작하기 전에 주목할만한 사항이 있습니다 ...
  • postMessage() 웹 워커 제한 onmessage
  • 웹 작업자는 브라우저 UI 스레드와 독립적으로 실행되므로 JavaScript 개발자가 친숙하고 사랑하는 많은 기능에 액세스 할 수 없습니다. 주요 제한 사항은 웹 작업자가 DOM에 액세스 할 수 없다는 것입니다. 또한 페이지에서 글로벌 변수 또는 JavaScript 함수에 액세스 할 수 없습니다. 마지막으로, 특정 객체에 대한 액세스가 제한됩니다 (예 :
  • 속성은 읽기 전용입니다. 그러나 웹 워커는 표준 JavaScript 데이터 유형을 사용하고 XMLHTTPREQUEST (AJAX) 호출을 프로세스하고 타이머를 사용하며 다른 작업자를 가져올 수 있습니다. 대규모 데이터 블록 분석, 게임 AI 논리, 레이 추적 등과 같은 시간 소비 작업을 처리하는 데 이상적입니다.
웹 워커 브라우저 지원

작성 시점에서 모든 최신 버전의 Firefox, Chrome, Safari 및 Opera는 웹 작업자를 어느 정도 지원합니다. 어떤 브라우저가 지원하지 않는지 추측합니까? 예상대로, 인터넷 익스플로러 버전은 웹 워커를 구현하지 않습니다. IE9가 지원을 제공하지 않더라도 최종 버전에서 구현되기를 바랍니다. 그때까지, 당신은 세 가지 옵션이 있습니다 :

    1 년 또는 2 년 이내에 웹 작업자를 잊어 버리십시오.
  • 응용 프로그램을 수락하면 IE에서 충돌이 발생합니다.
  • 는 타이머 기반의 의사 스레드 또는 어레이 처리로 돌아가는 자신의 웹 워커 Shim을 구현합니다. 이것은 모든 응용 프로그램에서 실현 가능하거나 바람직하지 않을 수 있습니다.
  • 웹 작업자는 무엇입니까?
  • 웹 워커는 백그라운드에서로드 및 실행되는 단일 JavaScript 파일입니다. 두 가지 유형이 있습니다 :
  • <:> 특별 노동자 :이 근로자들은 제작자 (근로자를로드하는 대본)와 관련이 있습니다.
공유 작업자 : 동일한 도메인 (somesite.com)의 스크립트가 작업자와 의사 소통 할 수 있도록합니다.

오늘, 우리는 전용 웹 워커에 대해 논의 할 것입니다.… 전용 웹 워커를 만듭니다 전용 웹 워커를 만들려면 JavaScript 파일 이름을 작업자 개체의 새 인스턴스로 전달할 수 있습니다.

전용 웹 워커와 통신

웹 작업자가 페이지 스크립트에서 DOM에 액세스하거나 기능을 실행할 수 없으므로 모든 통신은 이벤트 인터페이스를 통해 처리됩니다. 웹 스크립트는 메소드를 통해 단일 데이터 매개 변수를 전달하고
    이벤트 핸들러 (예 : pagescript.js : )를 통해 반환 데이터를 수신합니다.
  • 웹 워커 스크립트는 자체
  • 이벤트 핸들러 및 메소드를 통해 데이터를 수신하고 보냅니다.
  • 메시지 데이터는 문자열, 숫자, 부울, 배열, 객체, null 또는 정의되지 않은 일 수 있습니다. 데이터는 항상 가치에 따라 전달되며 통신 중에 직렬화 된 다음 사산화됩니다.
웹 작업자 오류 처리

웹 워커 코드는 완벽하지 않을 가능성이 높으며 페이지 스크립트가 전달한 데이터로 인해 논리적 오류가 발생할 수 있습니다. 다행히도 <p> 이벤트 핸들러를 사용하여 오류를 잡을 수 있습니다. 핸들러 이벤트는 3 속성의 객체를 전달합니다 <strong> </strong> : 오류를 일으킨 스크립트의 이름; </p> : 오류가 발생한 줄 번호; <p> : 잘못된 설명. </p> <pre class="brush:php;toolbar:false">var worker = new Worker(&quot;thread1.js&quot;);</pre> <j j> pagescript.js : <p> <strong> 더 많은 JavaScript 파일을로드하십시오 </strong> 당신은 </p>를 사용하여 하나 이상의 추가 자바 스크립트 라이브러리를 웹 작업자에로드 할 수 있습니다. <p> <can> 또는 더 많은 웹 워커를로드 할 수 있습니다. 그러나 브라우저가 스레딩 야망을 따라 잡을 때까지 간단하게 유지하는 것이 좋습니다! <code>postMessage() onmessage 전용 웹 워커를 중지

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

// 接收来自 Web Worker 的消息
worker.onmessage = function(e) {
    alert(e.data);
};

// 发送消息到 Web Worker
worker.postMessage("Jennifer");
메소드를 사용하여 thread1.js : 와 같은 웹 작업자 스레드를 중지 할 수 있습니다.

이것은 보류중인 작업을 폐기하고 추가 이벤트가 대기되는 것을 방지합니다. 전용 웹 워커에 대해 알아야 할 전부입니다. 다음 게시물에서는 웹 워커 공유에 대해 논의 할 것입니다 - 더 복잡한 사람! onmessage JavaScript 병렬 처리 및 HTML5 웹 작업자에 대한 FAQS (FAQS) postMessage()

self.onmessage = function(e) {
    self.postMessage("Hello " + e.data);
};

(FAQ 부분은 길이가 너무 길고 의사 원리 목표와 일치하지 않기 때문에 여기서 생략됩니다. FAQ 부분은 필요에 따라 재구성되고 다시 작성 될 수 있지만 원래 의도는 변경되지 않아야합니다.)

위 내용은 HTML5 웹 워커와의 JavaScript 스레딩의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.