ה-Service Workers מציעים תועלת מדהימה, אבל בהתחלה יכול להיות קשה לעבוד איתם. תיבת העבודה מקלה על השימוש ב-Service Workers. עם זאת, מכיוון ש-Service Workers פותרים בעיות קשות, גם כל הפשטה של הטכנולוגיה הזו תהיה מסובכת בלי להבין אותה. לכן, קטעי התיעוד הראשונים האלה יתייחסו לטכנולוגיה הבסיסית הזו, לפני שנכנסים לפרטים ספציפיים לגבי תיבת העבודה.
כדי להציג רשימה פעילה של קובצי שירות (service worker), יש להזין chrome://serviceworker-internals/ בסרגל הכתובות.
מה מספקים ה-Service Workers?
קובצי שירות (service worker) הם נכסי JavaScript מיוחדים שפועלים כשרתי proxy בין דפדפני אינטרנט לבין שרתי אינטרנט. הם נועדו לשפר את האמינות באמצעות גישה לא מקוונת, וכן לשפר את ביצועי הדף.
מחזור חיים שנראה כמו אפליקציה, שמשדרג את חוויית השימוש
קובצי שירות (service worker) הם שיפור לאתרים קיימים. כלומר, אם משתמשים בדפדפנים שלא תומכים ב-Service Workers יבקרו באתרים שמשתמשים בהם, לא תהיה תקלה בפונקציונליות הבסיסית. זה מהות האינטרנט.
עובדי השירות משפרים בהדרגה אתרים לאורך מחזור החיים שלהם, בדומה לאפליקציות ספציפיות לפלטפורמה. תחשבו על מה שקורה כשמתקינים אפליקציה מותאמת מחנות אפליקציות:
- תישלח בקשה להורדת האפליקציה.
- מתבצעת הורדה והתקנה של האפליקציה.
- האפליקציה מוכנה לשימוש ואפשר להפעיל אותה.
- האפליקציה מתעדכנת לגרסאות חדשות.
מחזור החיים של קובץ השירות (service worker) דומה, אבל הוא בגישה של שיפור הדרגתי. בביקור הראשון בדף אינטרנט שמתקינים בו קובץ שירות (service worker) חדש, הביקור הראשוני בדף מספק את הפונקציונליות הבסיסית שלו בזמן ההורדה של ה-Service Worker. אחרי שמתקינים ומפעילים את Service Worker, הוא שולט בדף כדי לשפר את האמינות והמהירות.
גישה ל-API לשמירה במטמון שמבוסס על JavaScript
היבט חיוני של טכנולוגיית Service Worker הוא הממשק Cache, שהוא מנגנון שמירה במטמון בנפרד לחלוטין ממטמון ה-HTTP.
אפשר לגשת לממשק Cache מתוך ההיקף של קובץ השירות (service worker) וההיקף של ה-thread הראשי.
הפעולה הזו פותחת בפניכם המון אפשרויות לאינטראקציות שמבוססות על משתמשים עם המופע של Cache.
מטמון ה-HTTP מושפע מהוראות השמירה במטמון שמפורטות בכותרות ה-HTTP, ואילו הממשק Cache ניתן לתכנות באמצעות JavaScript.
כלומר, שמירת תגובות במטמון של בקשות רשת יכולה להתבסס על הלוגיקה הטובה ביותר לאתר נתון.
לדוגמה:
- נכסים סטטיים מאוחסנים במטמון בבקשה הראשונה עבורם, ומגישים אותם רק מהמטמון בכל בקשה נוספת.
- ניתן לאחסן תגי עיצוב של דפים במטמון, אבל להציג תגי עיצוב מהמטמון רק בתרחישים לא מקוונים.
- הצגת תגובות לא עדכניות לנכסים מסוימים מהמטמון, אבל יש לעדכן אותן מהרשת ברקע.
- מעבירים תוכן חלקי בסטרימינג מהרשת ומרכיבים אותו עם מעטפת אפליקציה מהמטמון כדי לשפר את רמת הביצועים התפיסתית.
כל אחד מהם הוא דוגמה לאסטרטגיית שמירה במטמון. אסטרטגיות של שמירה במטמון מאפשרות ליהנות מחוויות אופליין, והן עשויות להניב ביצועים טובים יותר באמצעות שלבי אימות מחדש עם זמן אחזור גבוה שמתבצעת הפעלה של מטמון ה-HTTP. לפני שנכנסים לתיבת העבודה, ריכזנו כמה אסטרטגיות וקוד לשמירה במטמון שבזכותם הן פועלות.
API אסינכרוני ומבוסס-אירועים
העברת נתונים ברשת היא אסינכרונית מטבעה. לוקח זמן לבקש נכס, לשרת להגיב לבקשה ולהוריד את התגובה. משך הזמן שנדרש הוא שונה ולא קבוע. קובצי שירות (service worker) יכולים לספק את האסינכרוניות הזו באמצעות API מבוסס-אירועים ולהשתמש בקריאות חוזרות (callback) לאירועים כמו:
- בזמן התקנה של Service Worker.
- כשה-Service Worker מופעל.
- כש-Service Worker מזהה בקשת רשת.
אפשר לרשום אירועים באמצעות addEventListener API מוכר.
לכל האירועים האלה יכולה להיות אינטראקציה עם הממשק של Cache.
היכולת לבצע קריאה חוזרת (callback) כשבקשות רשת נשלחות היא חיונית במיוחד כדי לספק את האמינות והמהירות הנדרשות.
כדי לבצע עבודה אסינכרונית ב-JavaScript, צריך להשתמש בהבטחות.
מאחר שההבטחות עומדות גם בבסיס של async ו-await, אפשר להשתמש בתכונות ה-JavaScript האלה גם כדי לפשט את הקוד של Service Worker (וגם את תיבת העבודה!) וליהנות מחוויית פיתוח טובה יותר.
שמירה מראש במטמון ושמירה במטמון בזמן ריצה
באינטראקציה בין קובץ שירות (service worker) למכונה של Cache, יש שני מושגים שונים של שמירה במטמון: פתיחה מראש ושמירה במטמון בזמן הריצה.
כל אחד מההיבטים האלה הוא מרכזי ביתרונות של Service Worker.
Precaching הוא התהליך של שמירה מראש של נכסים במטמון, בדרך כלל במהלך ההתקנה של Service Worker.
כשמשתמשים בהגדרה מראש, אפשר להוריד ולאחסן במכונה של Cache נכסים סטטיים וחומרים סטטיים חשובים שדרושים לצורך גישה אופליין.
שמירה כזו במטמון גם משפרת את מהירות הדף בדפים נוספים שבהם יש צורך בנכסים שנשמרו מראש.
שמירה במטמון בזמן ריצה היא מצב שבו אסטרטגיית שמירה במטמון חלה על נכסים, בעקבות בקשה שלהם מהרשת במהלך זמן הריצה. שמירה במטמון היא שימושית כי היא מבטיחה גישה אופליין לדפים ולנכסים שהמשתמש כבר ביקר בהם.
בשילוב, הגישות האלה לשימוש בממשק Cache ב-Service Worker מספקות תועלת עצומה לחוויית המשתמש, והן מספקות דפוסי התנהגות דמויי-אפליקציה בדפי אינטרנט רגילים.
בידוד מה-thread הראשי
מצב הביצועים של JavaScript הוא אתגר מתפתח באינטרנט, ומנקודת המבט של המשתמשים, המצב תלוי ביכולות המכשיר ובגישה לאינטרנט במהירות גבוהה. ככל שמשתמשים יותר ב-JavaScript, כך קשה יותר לבנות אתרים מהירים שמעניקים חוויות משתמש מהנות.
עובדי שירות פועלים כמו עובדי אינטרנט, בכך שכל העבודה שלהם מתבצעת בשרשורים משלהם. כלומר, משימות של Service worker לא יתחרו על תשומת לב מול משימות אחרות ב-thread הראשי. המטרה של קובצי שירות (service worker) נמצאת בראש סדר העדיפויות של המשתמש!
מה צופן העתיד?
התיעוד הזה הוא רק סקירה כללית. יש עוד כמה נושאים שכדאי לדבר עליהם לפני שנעסוק ב-Workbox כמו שצריך, אבל אל דאגה: השימוש ב-Workbox יהיה קל ופרודוקטיבי יותר,