מבוא לעובדי אינטרנט

עובדי אינטרנט הוא ממשק API של JavaScript שמאפשר לך להפעיל סקריפטים חוט נפרד מן הראשי. זה יכול להיות שימושי כאשר אתה לא רוצה שום מכשול בביצוע של סקריפטים הראשי, בשל סקריפטים ברקע אסק.

ממשק ה- API של Web Workers הוא נתמך כמעט בכל הדפדפנים, לקבלת מידע מפורט יותר, יש להסתכל על המסמכים CaniUse. לפני הכניסה לקוד, נראה כמה תרחישים שבהם תרצה להשתמש בממשק API זה כדי שתוכל לקבל מושג על מה התכוונתי רקע סקריפטים esque.

השתמש במקרים

נניח שיש תסריט זה מאחזר ומעבד קובץ. אם הקובץ הוא במידה ניכרת גדול זה ייקח הרבה זמן כדי להיות מעובד! אשר עשוי דוכן סקריפטים אחרים אשר הופעלו מאוחר יותר מקבל להורג.

עם זאת, אם עיבוד הקובץ מועבר לחוט רקע, ידוע כ חוט העובד, אירועים אחרים לא יחסמו עד שהראשון יסתיים.

התסריט להורג בחוט רקע עובד ידוע בשם סקריפט עובד או רק את העובד.

לדוגמה, דמיינו שיש טופס גדול, מסודרים כרטיסיות. זה סקריפט בצורה לעדכון פקדים בכרטיסייה אחת משפיע על חלק מהבקרות באחרים.

אם העדכון של כרטיסיות אחרות לוקח קצת זמן את המשתמש לא יכול להמשיך להשתמש בכרטיסייה הנוכחית מבלי שהאירועים שלה יעוכבו. פעולה זו עלולה להקפיא את ממשק המשתמש, למורת רוחו של המשתמש.

מאחר שמשתמש לא יראה את הכרטיסיות האחרות בעת מילוי אחת מהן, תוכל עדכן את הפקדים של הכרטיסיות האחרות בחוט רקע. בדרך זו, המשתמש יכול להמשיך להשתמש בכרטיסייה הנוכחית שהוא ממלא, מבלי שאף אחד מהסקריפטים שלו ייחסם על ידי תהליך העדכון של פקדים בכרטיסיות אחרות.

כמו כן, אם אתה מוצא תרחיש שבו סקריפט עשוי לחסום משתמש מלהשתמש בממשק המשתמש עד לביצועו, ייתכן שתשקול להעביר אותו לחוט הפועל, כך שניתן יהיה לבצע אותו ברקע.

תחומים וסוגי עובדים

Web Workers API הוא כנראה אחד ממשקי ה- API הפשוטים ביותר לעבוד איתו. יש שיטות פשוט למדי ליצור חוטי עובדים ו לתקשר איתם מתוך התסריט הראשי.

ההיקף הגלובלי של פתיל עובדים נמצא בהקשר שונה מהחוט המרכזי. אתה לא ניתן לגשת לשיטות ולמאפיינים של חלון אובייקט כמו התראה () בתוך חוט עבודה. גם אתה לא ניתן לשנות את DOM ישירות מחוט עובד.

עם זאת, אתה פחית להשתמש בממשקי API רבים שמתחת חלון, לדוגמה הבטחה ו אחזור, בחוט העובד שלך (ראה רשימה מלאה).

אתה יכול גם חוטי עובדים מקוננים: חוטי עובדים שנוצרו מחוט עובדים אחר. עובד שנוצר על ידי אחד אחר נקרא a תת.

יש גם רב סוגים של עובדים. שני העיקריים הם עובדים מסורים ומשותפים.

עובדים מסורים שייכים לאותו הקשר גלישה כי פתיל העיקרי שלהם שייך. עובדים משותפים, לעומת זאת, הם נוכחים בהקשר גלישה אחר (לדוגמה, ב- iframe) מהסקריפט הראשי. בשני המקרים, את התסריט הראשי ואת העובדים חייב להיות באותו דומיין.

הדוגמה במדריך זה תהיה על עובד מסור, שהוא הסוג הנפוץ ביותר.

שיטות API

ראה דיאגרמה להלן עבור סקירה מהירה של כל השיטות העיקריות המהווים את ה- API של Web Workers.

ה Worker () בנאי יוצר חוט עובדים ייעודי ו מחזירה את אובייקט הייחוס שלה. לאחר מכן, אנו משתמשים באובייקט זה כדי לתקשר עם אותו עובד ספציפי.

ה הודעה () השיטה משמשת הן סקריפטים הראשי עובד לשלוח נתונים זה לזה. הנתונים שנשלחו לאחר מכן מתקבלים בצד השני על ידי בהודעה מנהל אירועים.

ה לבטל, לסיים() שיטה מסיים חוט עובד מהסקריפט הראשי. סיום זה הוא מיידי: כל ביצוע סקריפט הנוכחי סקריפטים בהמתנה יבוטל. ה סגור () השיטה עושה את אותו הדבר, אבל זה שנקרא על ידי פתיל עובד סגירת עצמו.

קוד לדוגמה

עכשיו, בוא נראה כמה קוד לדוגמה. ה index.html הדף מחזיקה את התסריט הראשי בתוך א

אנחנו מתחילים עם יצירת חוט העובד מהתסריט הראשי.

 w = עובד חדש ('worker.js'); 

 w = עובד חדש ('worker.js'); w.onmessage = (e) => console.log ('התקבל מעובד: $ eddata');  

 document.querySelector ('button') onclick = () => w.postMessage ('john');  

 console.info ('עובד נוצר'); onmessage = (e) => postMessage ('$ $ e.data');