Web worker js

Что это и для чего
Как с этим работать
Создаём встроенный worker

Web worker js

Что это и для чего

Как с этим работать

В js код добавляем



// Поддерживается ли
if (typeof(Worker) !== "undefined") {  console.log('Worker Not work'); }

// Подключение
var worker = new Worker("/ajax/webworker/1.js?");

// Подключение без кэша
// var worker = new Worker("/ajax/webworker/1.js?" + String(new Date().getTime()));

// Отправка данных
worker.postMessage(25);

// Приём данных
worker.onmessage = function(event) {
    console.log(event.data);
};

В самом файле, куда подключается worker


onmessage = function(event) {
    let  n = event.data;
    //console.log(n); // Вывод в обычной консоли

    n = n * 2; // Обработка
    postMessage(n);// Отдаём результат
}

Создаём встроенный worker

Тут брал инфу


<script id="worker" type="javascript/worker">
onmessage = function(event) {
    let  n = event.data;

    n = n * 2; // Обработка
    postMessage(n);// Отдаём результат
}
</script>

// document.querySelector('#worker').textContent


app.worker_test = function() {
    window.Blob = window.Blob || window.WebKitBlobBuilder || window.MozBlobBuilder;
    window.URL = window.URL || window.webkitURL;
    
    var worker_text = document.getElementById('worker').innerHTML;
    var worker_blob = new window.Blob([worker_text], {type: 'text/plain'});
    var worker_url = window.URL.createObjectURL(worker_blob);
    var worker = new Worker(worker_url);
    
    // Отправка данных
    worker.postMessage(25);
    
    // Приём данных
    worker.onmessage = function(event) {
        console.log(event.data);
    } 
}