وب کارگر یک JavaScript است که در پس زمینه اجرا می شود ، بدون اینکه بر عملکرد صفحه تأثیر بگذارد.
وب کارگر چیست؟
هنگام اجرای اسکریپت ها در یک صفحه HTML ، صفحه تا زمان پایان اسکریپت پاسخ نمی دهد.
وب کارگر یک JavaScript است که در پس زمینه ، مستقل از سایر اسکریپت ها اجرا می شود ، بدون اینکه بر عملکرد صفحه تأثیر بگذارد. در حالی که کارگر وب در پس زمینه اجرا می شود ، می توانید به انجام هر کاری که می خواهید ادامه دهید: کلیک کردن ، انتخاب موارد و غیره.
پشتیبانی مرورگر
اعداد موجود در جدول اولین نسخه های مرورگر را مشخص می کنند که به طور کامل از Web Workers پشتیبانی می کنند:
مثال کارگران وب
مثال زیر یک وب کارگر ساده ایجاد می کند که اعداد را در پس زمینه شمارش می کند:
مثال
Count numbers: Start Worker Stop Worker
پشتیبانی وب کارگر را بررسی کنید
قبل از ایجاد یک وب کارگر ، بررسی کنید که آیا مرورگر کاربر از آن پشتیبانی می کند:
if (typeof(Worker) !== "undefined") {
// Yes! Web worker support!
// Some code.....
} else {
// Sorry! No Web Worker support..
}
یک پرونده وب کارگر ایجاد کنید
حال ، بیایید وب کارگر خود را در یک JavaScript خارجی ایجاد کنیم.
در اینجا ، ما یک اسکریپت ایجاد می کنیم که دارای اهمیت باشد. اسکریپت در پرونده “demo_workers.js” ذخیره شده است:
let i = 0;
function timedCount() {
i ++;
postMessage(i);
setTimeout("timedCount()",500);
}
timedCount();
قسمت مهم کد بالا postMessage()روش است – که برای ارسال پیام به صفحه HTML استفاده می شود.
توجه: به طور معمول از وب کارگران برای چنین اسکریپت های ساده ای استفاده نمی شود ، بلکه برای کارهای بیشتر پردازنده استفاده می شود.
ایجاد یک کارگر وب
اکنون که پرونده وب کارگر را در اختیار داریم ، باید آن را از یک صفحه HTML فراخوانی کنیم.
خطوط زیر بررسی می کند که آیا کارگر از قبل وجود دارد یا خیر – این یک شی web وب کارگر جدید ایجاد می کند و کد را در “demo_workers.js” اجرا می کند:
if (typeof(w) == "undefined") {
w = new Worker("demo_workers.js");
}
سپس می توانیم از طریق وب کارگر پیام ارسال و دریافت کنیم.
شنونده رویداد “onmessage” را به وب کارگر اضافه کنید.
w.onmessage = function(event){
document.getElementById("result").innerHTML = event.data;
};
وقتی کارگر وب پیامی را ارسال می کند ، کد درون شنونده رویداد اجرا می شود. داده های کارگر وب در event.data ذخیره می شود.
یک وب کارگر را خاتمه دهید
وقتی یک شی worker وب کارگر ایجاد می شود ، تا پایان یافتن پیام برای گوش دادن به پیام (حتی پس از پایان اسکریپت خارجی) ادامه خواهد داشت.
برای خاتمه یک وب کارگر و منابع رایگان مرورگر / رایانه ، از terminate()روش زیر استفاده کنید:
w.terminate();
از Web Worker استفاده مجدد کنید
اگر متغیر کارگر را روی تعریف نشده تنظیم کنید ، پس از پایان یافتن آن ، می توانید از کد استفاده مجدد کنید:
w = undefined;
کد مثال کامل کارگر وب
ما قبلاً کد Worker را در پرونده .js مشاهده کرده ایم. در زیر کد صفحه HTML آورده شده است:
مثال
<!DOCTYPE html>
<html>
<body>
<p>Count numbers: <output id="result"></output></p>
<button onclick="startWorker()">Start Worker</button>
<button onclick="stopWorker()">Stop Worker</button>
<script>
let w;
function startWorker() {
if (typeof(w) == "undefined") {
w = new Worker("demo_workers.js");
}
w.onmessage = function(event) {
document.getElementById("result").innerHTML = event.data;
};
}
function stopWorker() {
w.terminate();
w = undefined;
}
</script>
</body>
</html>
وب کارگران و DOM
از آنجا که کارگران وب در پرونده های خارجی هستند ، به اشیا Java JavaScript زیر دسترسی ندارند:
- شی پنجره
- شی document سند
- شی parent والدین
