Комментарий: веб -работники - это новая технология, добавленная в HTML5 для реализации обработки бэкэнд в веб -приложениях.
Web Workers - это новая технология, добавленная в HTML5 для реализации фоновой обработки в веб -приложениях.
В HTML4 программы, созданные JS, все однопоточные. Если это займет много времени, веб -интерфейс не будет отвечать в течение длительного времени. В худшем случае появится ящик для сценария:
Это подсказывает, что сценарий работает слишком долго, будь то продолжать. Полем Полем Полем Таким образом, главный герой этой статьи представлен: API веб -работников
Использование этого API пользователи могут легко создавать потоки, работающие в фоновом режиме, и очень просто создать фоновые программы:
var Worker = new Worker ('*. JS');
ПРИМЕЧАНИЕ. Фоновые потоки не могут получить доступ к страницам или окнам объектам.
Данные могут быть переданы с помощью фоновых потоков путем отправки сообщений и получения сообщений:
Worker.onmessage = function (e) {};
Worker.postmessage = function (e) {};
Поговорим о суммировании:
<! Doctype html>
<html xmlns = "http://www.w3.org/1999/xhtml">
<голова>
<title> </title>
<script type = "text/javascript">
Функция Calculate () {
var num = 1000000000000;
var r = 0;
для (var i = 1; i <num; i ++) {
r += i;
}
предупреждение (r);
}
рассчитывать ();
</script>
</head>
<тело>
</body>
</html>
Так что моя красивая рама была дана. Полем Полем Но использование веб -работников не будет:
<! Doctype html>
<html xmlns = "http://www.w3.org/1999/xhtml">
<голова>
<title> </title>
<script type = "text/javascript">
var Worker = новый работник ('c.js');
Worker.onmessage = function (e) {
оповещение ('и:' + e.Data);
};
Функция Calculate () {
var num = 1000000;
Worker.postmessage (num);
}
рассчитывать ();
</script>
</head>
<тело>
</body>
</html>
onMessage = function (e) {
var num = e.data;
var r = 0;
для (var i = 1; i <num; i ++) {
r += i;
}
postmessage (r);
}
Иногда я думаю, почему я рассчитываю такое большое количество, если мне нечего делать. Полем Полем Полем Полем Конечно, это скучный трюк, но я думаю, что есть сценарий, который может потребовать этого.
Когда я изучал API файла ранее, была операция для чтения локальных файлов. Если файл слишком большой, он будет очень медленным. Интересно, можно ли это применить? Необходимо попробовать это во время второго исследования.
Взаимодействовать с потоками
Мы выполняем здесь функцию, случайным образом генерируем массив на переднем плане, а затем возвращаемся на передний план, чтобы печатать на заднем плане, если расчет может быть 3 из 3:
Основная программа
<! Doctype html>
<html xmlns = "http://www.w3.org/1999/xhtml">
<голова>
<title> </title>
<style>
охватывать
{
Заполнение: 10px;
}
</style>
<script src = "../ jQuery-1.7.1.js" type = "text/javascript"> </script>
<script type = "text/javascript">
$ (document) .ready (function () {
var Worker = new Worker ('t1.js');
Worker.postmessage ('');
Worker.onmessage = function (e) {
var arr = e.data.split (';');
for (var i = 0, len = arr.length; i <len; i ++) {
var dom = $ ('<pan>' + arr [i] + '</span>');
$ ('#body'). Append (dom);
}
}
});
</script>
</head>
<тело>
<div>
</div>
</body>
</html>
Программа, которая генерирует массив
onMessage = function (e) {
var arr = [];
для (var i = 0; i <100; i ++) {
arr.push (parseint (math.random () * 100));
}
var Worker = новый работник ('t2.js');
Worker.postmessage (json.stringify (arr));
Worker.onmessage = function (e) {
// Отправить результаты выбора обратно на стойку регистрации
Postmessage (E.Data);
};
}
Определите, разделены ли все данные в массиве на 3
onMessage = function (e) {
var arr = json.parse (e.data);
var str = '';
for (var i = 0, len = arr.length; i <len; i ++) {
if (parseint (arr [i]) % 3 == 0) {
if (str! = '') str += ';'; ';
str += arr [i];
}
}
postmessage (str);
закрывать();
};
Описание логики программы:
Здесь используется гнездование нити
Во -первых, выполните программу переднего плана, где дочерняя нить T1 инициализируется для инициализации 100 массивов.
Затем дочерняя потока T1 инициализирует дочернюю резьбу T2 (используется для прохождения массива, взять числа, которые можно делить на 3, и сформировать строку), а T1 передает данные массива в T2
T2 получает данные T1, и после расчета он будет передавать строку T1, T1 на стойку регистрации, а стойка регистрации выполнит свою собственную логику
Процесс заканчивается
Заключение
Проще говоря, я объявляю детскую ветку здесь, а затем отправляю данные в Postmessage ребенка, а затем жду результата.
Похоже, что в сочетании с последними веб -розетками API Communication, два могут быть объединены в программу веб -чата, и даже могут использоваться некоторые локальные базы данных хранения/локальных данных.
Это может быть хорошо.