Работники Web - Как они работают?

Я пытаюсь понять this example:Работники Web - Как они работают?

HTML (основной код):

<html> 
    <title>Test threads fibonacci</title> 
    <body> 

    <div id="result"></div> 

    <script language="javascript"> 

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

     worker.onmessage = function(event) { 
     document.getElementById("result").textContent = event.data; 
     dump("Got: " + event.data + "\n"); 
     }; 

     worker.onerror = function(error) { 
     dump("Worker error: " + error.message + "\n"); 
     throw error; 
     }; 

     worker.postMessage("5"); 

    </script> 
    </body> 
    </html>

Javascript (рабочий код):

var results = []; 

    function resultReceiver(event) { 
    results.push(parseInt(event.data)); 
    if (results.length == 2) { 
     postMessage(results[0] + results[1]); 
    } 
    } 

    function errorReceiver(event) { 
    throw event.data; 
    } 

    onmessage = function(event) { 
    var n = parseInt(event.data); 

    if (n == 0 || n == 1) { 
     postMessage(n); 
     return; 
    } 

    for (var i = 1; i <= 2; i++) { 
     var worker = new Worker("fibonacci.js"); 
     worker.onmessage = resultReceiver; 
     worker.onerror = errorReceiver; 
     worker.postMessage(n - i); 
    } 
    };

У меня есть следующие вопросы:

Когда именно рабочий код начинает работать? Сразу после исполнения var worker = new Worker("fibonacci.js");?
Это правда, что назначение onmessage = function(event) { ... } в рабочем коде будет выполнено до worker.postMessage("5"); в основном коде?
Может ли рабочий код получить доступ к глобальным переменным, определенным в основном коде (например, worker)?
Может ли основной код получать доступ к глобальным переменным, определенным в рабочем коде (например, results)?
Мне кажется, что worker.onmessage = function(event) {...} в основном коде имеет такое же значение, как onmessage = function(event) {...} в коде работника (который является onmessage обработчик события работника). Где я ошибаюсь? В чем разница между ними?
Что должен делать этот код? Когда я запускаю его here, он просто печатает «5». Это то, что он должен делать, или я что-то упускаю?

Большое спасибо!

источник

2010-05-24 Misha Moroshko

Если вы еще этого не сделали, дайте спецификации (http://www.w3.org/TR/workers/) прочитать. Он * должен * охватывать большинство или все это. –

Я должен сказать, что калькулятор Фибоначчи невелик в списке вещей, которые я выбрал, чтобы создать пример веб-работников! :-) Не, если я хотел сделать что-то, что было бы простым и ясным примером. Это может быть полезно: http://ejohn.org/blog/web-workers/ BTW, я также получаю '5', когда я запускаю этот пример в Firefox; Я подозреваю, что это возможно было написано на ранней версии веб-работников и/или 'postMessage', а Firefox 3.6 (теперь) поддерживает более позднюю итерацию. (Это очень ультрасовременный материал.) –

Я хочу изучить этот материал на примерах, и я видел несколько примеров, прежде чем писать это. У меня все еще есть основные недоразумения в том, как это работает. Я был бы рад, если бы кто-нибудь мог ответить на мои вопросы. Чтение Spec слишком болезненно для меня прямо сейчас. –

Отъезд HTML5 Rocks: The Basics of Web Workers для общего учебника.

Работники начнут работу, как только вы назовете метод работника postMessage.
Функция, связанная с рабочим onmessage рабочего, в основном коде будет работать, когда рабочий называет postMessage.
глобальные переменные не разделяются между основными и рабочими потоками. Единственный способ передачи данных - обмен сообщениями через postMessage.
, как вы и предполагали, onmessage как для рабочего, так и для основного кода имеет то же значение. Это обработчик событий, когда поток получает событие сообщения. Вы даже можете использовать addEventListener вместо ловли message событие:

Основной код:

function showResult(event) { 
    document.getElementById("result").textContent = event.data; 
    dump("Got: " + event.data + "\n"); 
} 
var worker = new Worker("fibonacci.js"); 
worker.addEventListener('message', showResult, false);

Worker код:

addEventListener('message', resultReceiver, false);

Пример Фибоначчи вы взяли это рекурсивный пример работника.Если вы не используете рабочих, было бы что-то вроде этого:

function fibonacci(n) { 
    if (n == 0 || n == 1) return n; 
    return fibonacci(n-1) + fibonacci(n-2); 
} 

var result = fibonacci(5); 
dump("Got: " + result + "\n");

(. О, нет, я не собираюсь делать Stackless для вас написать его самостоятельно!)

источник

2011-04-18 17:34:44 syockit

Я также хочу добавить что вы можете отладки веб-работников только в Chromium основанные браузеры. Вы должны выбрать Источники в панели разработчика и в правой колонке разверните нижнюю строку Рабочие, а затем установите флажок пауза на старте.

источник

2013-08-10 16:51:52 r90t

Работники Web - Как они работают?

ответ

Смежные вопросы