Tại sao Công nhân Web không thể gọi trực tiếp chức năng?

Question

Chúng ta có thể sử dụng người lao động web HTML5 như thế này:

var worker = new Worker('worker.js'); 

nhưng tại sao chúng ta không thể gọi một chức năng như thế này?

var worker = new Worker(function(){ 
    //do something 
}); 

Answer 1

Đây là cách công nhân web được thiết kế. Họ phải có tệp JS bên ngoài riêng của họ và môi trường của riêng họ được khởi tạo bởi tệp đó. Họ không thể chia sẻ một môi trường với không gian JS toàn cầu thông thường của bạn vì các lý do xung đột đa luồng.

Một lý do khiến người lao động web không được phép truy cập trực tiếp vào biến toàn cầu của bạn là nó sẽ yêu cầu đồng bộ hóa luồng giữa hai môi trường không phải là thứ sẵn có (và nó sẽ làm phức tạp những thứ phức tạp). Khi công nhân web có các biến toàn cục riêng biệt của họ, họ không thể gây rối với chuỗi JS chính ngoại trừ hàng đợi nhắn tin được đồng bộ hóa chính xác với chuỗi JS chính. Có lẽ một ngày nào đó, các lập trình viên JS tiên tiến hơn sẽ có thể sử dụng các kỹ thuật đồng bộ hóa luồng truyền thống để chia sẻ quyền truy cập vào các biến chung, nhưng bây giờ tất cả các giao tiếp giữa hai luồng phải đi qua hàng đợi thông báo và nhân viên web không thể truy cập môi trường của luồng Javascript chính.

Answer 2

Bởi công nhân thiết kế web đa luồng, javascript là đơn luồng " *" nhiều tập lệnh không thể chạy cùng một lúc.

tham khảo: http://www.html5rocks.com/en/tutorials/workers/basics/

Answer 3

Câu hỏi này đã được hỏi before, nhưng đối với một số lý do, OP đã quyết định xóa nó.
Tôi đăng lại câu trả lời của mình, trong trường hợp người ta cần một phương pháp để tạo một nhân viên Web từ một hàm.

---

Trong this post, ba cách được hiển thị để tạo một công nhân Web từ một chuỗi tùy ý. Trong câu trả lời này, tôi đang sử dụng phương pháp thứ ba, vì nó được hỗ trợ trong tất cả các môi trường.

Một tập tin helper là cần thiết:

// Worker-helper.js 
self.onmessage = function(e) { 
    self.onmessage = null; // Clean-up 
    eval(e.data); 
}; 

Trong Worker thực tế của bạn, tập tin helper này được sử dụng như sau:

// Create a Web Worker from a function, which fully runs in the scope of a new 
// Worker 
function spawnWorker(func) { 
    // Stringify the code. Example: (function(){/*logic*/}).call(self); 
    var code = '(' + func + ').call(self);'; 
    var worker = new Worker('Worker-helper.js'); 
    // Initialise worker 
    worker.postMessage(code); 
    return worker; 
} 

var worker = spawnWorker(function() { 
    // This function runs in the context of a separate Worker 
    self.onmessage = function(e) { 
     // Example: Throw any messages back 
     self.postMessage(e.data); 
    }; 
    // etc.. 
}); 
worker.onmessage = function() { 
    // logic ... 
}; 
worker.postMessage('Example'); 

Lưu ý rằng phạm vi được tách nghiêm ngặt. Các biến chỉ có thể được chuyển qua và sử dụng worker.postMessage và worker.onmessage. Tất cả các tin nhắn là structured clones.

Answer 4

Câu trả lời này có thể hơi muộn, nhưng tôi đã viết thư viện để đơn giản hóa việc sử dụng nhân viên web và nó có thể phù hợp với nhu cầu của OP.Check it out: https://github.com/derekchiang/simple-worker

Nó cho phép bạn làm điều gì đó như:

SimpleWorker.run({ 
    func: intensiveFunction, 
    args: [123456], 
    success: function(res) { 
    // do whatever you want 
    }, 
    error: function(err) { 
    // do whatever you want 
    } 
}) 

Answer 5

Chỉ cần sử dụng plugin nhỏ của tôi https://github.com/zevero/worker-create

và làm

var worker_url = Worker.create(function(e){ 
    self.postMessage('Example post from Worker'); //your code here 
}); 
var worker = new Worker(worker_url); 

Answer 6

Trong khi nó không phải là tối ưu và nó được được đề cập trong các ý kiến, một tập tin bên ngoài là không cần thiết nếu trình duyệt của bạn hỗ trợ blobURL cho Web Worker. HTML5Rocks là inspiration cho mã của tôi:

function sample(e) 
{ 
    postMessage(sample_dependency()); 
} 

function sample_dependency() 
{ 
    return "BlobURLs rock!"; 
} 

var blob = new Blob(["onmessage = " + sample + "\n" + sample_dependency]); 
var blobURL = window.URL.createObjectURL(blob); 
var worker = new Worker(blobURL); 

worker.onmessage = function(e) 
{ 
    console.log(e.data); 
}; 

worker.postMessage(""); 

Hãy cẩn thận:

• Các công nhân blob sẽ không sử dụng thành công các liên kết URL. Liên kết HTML5Rocks bao gồm điều này nhưng nó không phải là một phần của câu hỏi ban đầu.

• Mọi người đã báo cáo sự cố khi sử dụng URL Blob với Công nhân web. Tôi đã thử nó với IE11 (bất cứ thứ gì được vận chuyển với FCU), MS Edge 41.16299 (Bản cập nhật của người tạo mùa thu), Firefox 57 và Chrome 62. Không có đầu mối nào đối với hỗ trợ Safari. Những cái tôi đã thử nghiệm đã hoạt động.

• Lưu ý rằng "mẫu" và "sample_dependency" tài liệu tham khảo trong các cuộc gọi constructor Blob ngầm gọi Function.prototype.toString() như sample.toString() và sample_dependency.toString(), mà là rất khác nhau vì gọi toString(sample) và toString(sample_dependency).

Được đăng bởi vì đây là luồng xếp chồng đầu tiên xuất hiện khi tìm kiếm cách sử dụng Công nhân trên web mà không yêu cầu tệp bổ sung.

Nhìn vào câu trả lời của Zevero và mã trong repo của anh ấy xuất hiện tương tự. Nếu bạn thích một wrapper sạch, đây là khoảng những gì mã của mình không.

Cuối cùng - tôi là một noob ở đây vì vậy mọi chỉnh sửa đều được đánh giá cao.