การใช้ Web Workers ใน HTML5

Web Workers: รัน JavaScript แบบ Background Thread

ไม่บล็อก Main Thread (UI Responsive) เหมาะสำหรับ Heavy Computation

ข้อจำกัด

• ไม่เข้าถึง DOM ได้
• ไม่เข้าถึง window, document, parent ได้
• Communicate ผ่าน postMessage() และ onmessage
• Heavyweight - ไม่ควรสร้างเยอะ (เช่น 1 Worker ต่อ Pixel ไม่ได้)

Syntax

// Main Thread
var worker = new Worker('bigLoop.js');

worker.postMessage({ data: 'start' }); // ส่งข้อมูล

worker.onmessage = function(event) {
    console.log('Result:', event.data);
};

// bigLoop.js (Worker)
self.onmessage = function(event) {
    // Heavy computation...
    var result = heavyCalculation(event.data);
    self.postMessage(result); // ส่งกลับ
};

ใช้สำหรับ: Image Processing, Crypto, Large Data Sorting, Background Sync