آشنایی با Worker ها (۲)

در پست قبلی اگر یادتون مونده باشه با هم با web worker ها آشنا شدیم اگر یادتون نیست میتونین لینک زیرو ببینین

https://virgool.io/@arainjast/%D8%A2%D8%B4%D9%86%D8%A7%DB%8C%DB%8C-%D8%A8%D8%A7-worker-%D9%87%D8%A7-%DB%B1-y5ahwihwowgr

در ادامه پست قبلی میخوایم این ورکر هارو بیشتر بشناسیم.

وب ورکر ها ۲ نوع اند: Shared و Dedicated

ورکری که در پست پیش باهاش آشنا شدیم Web Worker از نوع Dedicated بود.حال در ادامه با Shared ورکرها آشنا میشیم.




Photo by John Salvino on Unsplash
Photo by John Salvino on Unsplash

آشنایی با Shared Workers

برخلاف Dedicated (اختصاصی) ها که فقط مختص اون اسکریپتی که تعریفشون کرده هستن نوع Shared وب ورکر ها در تمامی اسکریپت هایی که در یک دامنه هستن قابل دسترسی و استفاده هستن. برای آشنایی با شما با این نوع ورکر ها مثال قبلیمون رو این بار دوباره برای استفاده در Shared Worker ها بازنویسی میکنیم.

//sharedwebworker1.js
var port;
addEventListener("connect", function (evt) {
       port = evt.ports[0];
        port.addEventListener("message", function (evt) {
            let num = evt.data.number;
            if (num === 0 || num === 1)  
                port.postMessage(1);
            let result = num;
            while (num > 1)
            {
                num--;
                result *= num;
            } 
            port.postMessage(result);
       }
       port.start();
}

و در فایل اصلی:

const worker = new SharedWorker('sharedwebworker1.js'); // ایجاد worker
worker.port.addEventListener("message", function (event) { 
    console.log(`Result is: ${event.data}`); 
 };
worker.port.start();
worker.port.postMessage({ number: 8 }); // ارسال message

تفاوت Dedicated با Shared در این هست که برخلاف dedicated ها برای اتصال و Communicating این است که باید از آبجکت port که پورت فعال ورکر هست استفاده کنیم.

محدودیت های Web Worker ها

در قسمت اول گفتیم که ورکر ها دارای محدودیت هایی هستند که تنها به عدم دسترسی به dom در انجا اشاره شد ولی محدودیت های دیگه ای هم وب ورکر ها دارند:

  • انها دسترسی به متغیر ها و function های صفحه سایت شما ندارند.
  • انها دسترسی به object های عمومی صفحه ندارند مثل window,document
  • انها نمیتوانند function هایی نظیر alert یا confirm را صدا بزنند.

ولی میتوانند

۱- ایمپورت اسکریپت های دیگر

وب ورکرها میتوانند اسکریپت های دیگه را ایمپورت و اجرا کنند. این اسکریپت میتواند اسکریپتی در داخل/خارج از سایت شما باشد.

importScripts(); // ایمپورت هیچی
importScripts('helpers.js'); // ایمپورت اسکریپت helpers در سایت فعلی
importScripts('//example.io/js/network.js', 'example.js'); ایمپورت ۲ اسکریپت یکی از خارج یکی از داخل

۲- هندلینگ خطاها

علاوه بر event های message , connect شما میتوانید از error هم برای هندلینگ خطاها در وب ورکر استفاده کنین.

۳- بستن یا Terminate

شما میتوانید ارتباط با ورکر را در مواقعی که لازم میدونین قطع کنین این کار توسط Termiante انجام میگیرد.

۴- دسترسی به Navigator

۵- دسترسی به XMLHttpRequest

۶- دسترسی به Array, Date, Math و String

۷- دسترسی به setTimeout و setInterval



خب فکر میکنم تا اینجا با وب ورکر ها آشنایی خوبی پیدا کردیم و میتونیم باهاش چیزای جالبی بنویسیم. در ادامه و از قسمت ۳ به بعد با سرویس ورکر ها آشنا میشیم.