تفاوت بین سوکت های وب، کارگران وب و کارگران خدمات

Web Sockets، Web Workers، Service Workers... اینها اصطلاحاتی هستند که ممکن است خوانده باشید یا شنیده باشید. شاید نه همه آنها، اما احتمالاً حداقل یکی از آنها. و حتی اگر مدیریت خوبی در توسعه front-end داشته باشید، شانس خوبی وجود دارد که باید معنای آنها را جستجو کنید. یا شاید شما هم مثل من هستید و هر از گاهی آنها را با هم مخلوط می کنید. اصطلاحات همه شبیه به هم هستند و گیج کردن آنها واقعاً آسان است.

بنابراین، بیایید آنها را با هم تجزیه کنیم و Web Sockets، Web Workers و Service Workers را از هم تشخیص دهیم. نه به معنای غلیظی که در آن غواصی عمیق انجام می‌دهیم و تجربه عملی با هر یک به دست می‌آوریم - بیشتر شبیه کمکی کوچک برای نشانه‌گذاری دفعه بعد I شما به یک تجدید کننده نیاز دارید

مرجع دم دست

برای مقایسه و کنتراست سریع، با یک نمای کلی در سطح بالا شروع می کنیم.

ویژگی	چه چیزی است
سوکت وب	یک ارتباط دو طرفه باز و دائمی بین مرورگر و سرور برای ارسال و دریافت پیام ها از طریق یک اتصال منفرد ایجاد شده توسط رویدادها برقرار می کند.
کارمند وب	به اسکریپت‌ها اجازه می‌دهد در پس‌زمینه در رشته‌های جداگانه اجرا شوند تا از مسدود کردن یکدیگر در رشته اصلی جلوگیری شود.
کارگر خدمات	نوعی Web Worker که یک سرویس پس‌زمینه ایجاد می‌کند که میان‌افزار را برای رسیدگی به درخواست‌های شبکه بین مرورگر و سرور، حتی در موقعیت‌های آفلاین، عمل می‌کند.

سوکت های وب

سوکت وب یک پروتکل ارتباطی دو طرفه است. این را مانند یک تماس مداوم بین شما و دوستتان در نظر بگیرید که به پایان نمی رسد مگر اینکه یکی از شما تصمیم بگیرد تلفن را قطع کند. تنها تفاوت این است که شما مرورگر هستید و دوست شما سرور. مشتری درخواستی را به سرور ارسال می کند و سرور با پردازش درخواست مشتری پاسخ می دهد و بالعکس.

ارتباطات بر اساس رویدادها است. آ WebSocket شی ایجاد می شود و به یک سرور متصل می شود و پیام های بین سرور باعث ایجاد رویدادهایی می شود که آنها را ارسال و دریافت می کند.

این بدان معناست که وقتی اتصال اولیه برقرار می شود، ما یک ارتباط کلاینت-سرور داریم که در آن یک اتصال آغاز می شود و زنده نگه داشته می شود تا زمانی که کلاینت یا سرور تصمیم بگیرند با ارسال یک آن را خاتمه دهند. CloseEvent. این موضوع سوکت های وب را برای برنامه هایی که به ارتباط مستمر و مستقیم بین مشتری و سرور نیاز دارند، ایده آل می کند. اکثر تعاریفی که من دیده‌ام برنامه‌های چت را به عنوان یک مورد معمول فراخوانی می‌کنند - شما پیامی را تایپ می‌کنید، آن را به سرور ارسال می‌کنید، رویدادی را راه‌اندازی می‌کنید، و سرور بدون نیاز به پینگ کردن مکرر سرور با داده‌ها پاسخ می‌دهد.

این سناریو را در نظر بگیرید: شما در راه خروج هستید و تصمیم می‌گیرید Google Maps را روشن کنید. احتمالاً قبلاً می‌دانید که Google Maps چگونه کار می‌کند، اما اگر نمی‌دانید، پس از اتصال به برنامه، مکان شما را به‌طور خودکار پیدا می‌کند و هر کجا که می‌روید آن را پیگیری می‌کند. تا زمانی که این اتصال زنده است، از انتقال بی‌درنگ داده برای پیگیری موقعیت مکانی شما استفاده می‌کند. این یک سوکت وب است که یک مکالمه دو طرفه مداوم بین مرورگر و سرور برقرار می کند تا داده ها را به روز نگه دارد. یک برنامه ورزشی با امتیازهای بلادرنگ نیز ممکن است از این طریق از Web Sockets استفاده کند.

تفاوت بزرگ بین Web Sockets و Web Workers (و، همانطور که خواهیم دید، Service Workers) این است که آنها دسترسی مستقیم به DOM دارند. در حالی که Web Workers (و Service Workers) روی رشته های جداگانه اجرا می شوند، سوکت های وب بخشی از رشته اصلی هستند که به آنها توانایی دستکاری DOM را می دهد.

ابزارها و خدماتی برای کمک به ایجاد و حفظ اتصالات Web Socket وجود دارد، از جمله: SocketCluster, AsyncAPI, گاو چران, WebSocket King, کانال هاو گوریلا وب سوکت. MDN دارای یک لیست در حال اجرا که شامل سایر خدمات است.

اطلاعات بیشتر Web Sockets

کارگران وب

سناریویی را در نظر بگیرید که در آن شما نیاز به انجام یکسری محاسبات پیچیده و در عین حال ایجاد تغییرات در DOM دارید. جاوا اسکریپت یک برنامه تک رشته ای است و اجرای بیش از یک اسکریپت ممکن است رابط کاربری را که می خواهید تغییراتی در آن ایجاد کنید و همچنین محاسبات پیچیده ای که انجام می شود مختل کند.

اینجاست که Web Workers وارد بازی می شوند.

Web Workers اجازه می دهد تا اسکریپت ها در پس زمینه در رشته های جداگانه اجرا شوند تا از مسدود کردن اسکریپت ها در رشته اصلی جلوگیری کنند. این آنها را برای بهبود عملکرد برنامه‌هایی که به عملیات فشرده نیاز دارند عالی می‌کند، زیرا این عملیات‌ها را می‌توان در پس‌زمینه روی رشته‌های جداگانه بدون تأثیر بر رابط کاربر از رندر انجام داد. اما آن‌ها در دسترسی به DOM چندان عالی نیستند، زیرا برخلاف Web Sockets، یک وب‌کار خارج از رشته اصلی در رشته خود اجرا می‌شود.

Web Worker یک شی است که یک فایل اسکریپت را با استفاده از a اجرا می کند Worker اعتراض به انجام وظایف و وقتی در مورد کارگران صحبت می کنیم، آنها به یکی از سه نوع تقسیم می شوند:

• کارگران فداکار: یک کارگر متعهد فقط با اسکریپتی که آن را فراخوانی می کند در دسترس است. همچنان وظایف یک وب کار معمولی مانند اسکریپت های چند رشته ای خود را اجرا می کند.
• کارگران مشترک: کارگر مشترک نقطه مقابل کارگر فداکار است. توسط چندین اسکریپت قابل دسترسی است و عملاً می‌تواند هر وظیفه‌ای را که یک وب‌کار اجرا می‌کند تا زمانی که در همان دامنه کارگر وجود دارد، انجام دهد.
• کارگران خدماتی: یک سرویس دهنده به عنوان یک پروکسی شبکه بین برنامه، مرورگر و سرور عمل می کند و به اسکریپت ها اجازه می دهد حتی در صورت آفلاین شدن شبکه اجرا شوند. در بخش بعدی به این موضوع خواهیم پرداخت.

اطلاعات بیشتر Web Workers

کارگران خدمات

برخی چیزها وجود دارد که ما به عنوان توسعه دهندگان هیچ کنترلی روی آنها نداریم و یکی از آن چیزها اتصال شبکه کاربر است. هر شبکه ای که کاربر به آن متصل شود همان چیزی است که هست. ما فقط می‌توانیم تمام تلاش خود را برای بهینه‌سازی برنامه‌هایمان انجام دهیم تا در هر اتصالی که اتفاقاً استفاده می‌شود بهترین عملکرد را داشته باشند.

Service Workers یکی از کارهایی است که ما می توانیم برای افزایش تدریجی عملکرد یک برنامه انجام دهیم. یک سرویس‌کار بین برنامه، مرورگر و سرور قرار می‌گیرد و به لطف Web Workers - شما حدس زدید - یک اتصال امن را ارائه می‌دهد که در پس‌زمینه روی یک رشته جداگانه اجرا می‌شود. همانطور که در بخش آخر آموختیم، Service Workers یکی از سه نوع Web Workers هستند.

بنابراین، چرا نیاز دارید که یک سرویس دهنده بین برنامه شما و مرورگر کاربر بنشیند؟ باز هم، ما هیچ کنترلی بر اتصال شبکه کاربر نداریم. بگویید اتصال به دلایل نامعلومی قطع می شود. این امر ارتباط بین مرورگر و سرور را قطع می کند و از انتقال داده ها به عقب و جلو جلوگیری می کند. یک سرویس‌کار اتصال را حفظ می‌کند و به‌عنوان یک پروکسی همگام عمل می‌کند که قادر به رهگیری درخواست‌ها و اجرای وظایف - حتی پس از قطع اتصال شبکه است.

این محرک اصلی چیزی است که اغلب به آن اشاره می شود توسعه "اول آفلاین".. ما می‌توانیم دارایی‌ها را به جای شبکه در حافظه پنهان محلی ذخیره کنیم، در صورت آفلاین شدن کاربر، اطلاعات مهمی را ارائه کنیم، چیزهایی را از قبل واکشی کنیم تا زمانی که کاربر به آنها نیاز دارد آماده باشند، و در پاسخ به خطاهای شبکه، مواردی را ارائه دهیم. آنها کاملاً ناهمزمان هستند، اما برخلاف سوکت های وب، به DOM دسترسی ندارند زیرا روی رشته های خود اجرا می شوند.

نکته مهم دیگری که باید در مورد Service Workers بدانید این است که آنها تک تک درخواست ها و پاسخ های برنامه شما را رهگیری می کنند. به این ترتیب، آنها دارای برخی پیامدهای امنیتی هستند، به ویژه اینکه آنها از یک خط مشی منشا یکسان پیروی می کنند. بنابراین، این بدان معناست که یک سرویس دهنده از CDN یا سرویس شخص ثالث اجرا نمی شود. آنها همچنین به یک اتصال HTTPS ایمن نیاز دارند، به این معنی که برای اجرا به گواهی SSL نیاز دارید.

اطلاعات بیشتر کارکنان خدمات

پسگفتار

این یک توضیح فوق العاده سطح بالا از تفاوت ها (و شباهت ها) بین Web Sockets، Web Workers و Service Workers است. باز هم، اصطلاحات و مفاهیم به اندازه کافی مشابه هستند تا یکی را با دیگری مخلوط کنید، اما امیدواریم که این به شما ایده بهتری در مورد نحوه تشخیص آنها می دهد.

ما کارها را با یک جدول مرجع سریع شروع کردیم. در اینجا همان چیزی است، اما کمی گسترش یافته تا مقایسه های ضخیم تر انجام شود.

ویژگی	چه چیزی است	چند رشته ای؟	HTTPS؟	دسترسی به DOM؟
سوکت وب	یک ارتباط دو طرفه باز و دائمی بین مرورگر و سرور برای ارسال و دریافت پیام ها از طریق یک اتصال منفرد ایجاد شده توسط رویدادها برقرار می کند.	روی موضوع اصلی اجرا می شود	لازم نیست	بله
کارمند وب	به اسکریپت‌ها اجازه می‌دهد در پس‌زمینه در رشته‌های جداگانه اجرا شوند تا از مسدود کردن یکدیگر در رشته اصلی جلوگیری شود.	روی یک موضوع جداگانه اجرا می شود	ضروری	نه
کارگر خدمات	نوعی Web Worker که یک سرویس پس‌زمینه ایجاد می‌کند که میان‌افزار را برای رسیدگی به درخواست‌های شبکه بین مرورگر و سرور، حتی در موقعیت‌های آفلاین، عمل می‌کند.	روی یک موضوع جداگانه اجرا می شود	ضروری	نه