חדש: שליפה מראש של NoState

Katie Hempenius

מבוא

NoState Prefetch הוא מנגנון חדש ב-Chrome, שמהווה אלטרנטיבה לתהליך העיבוד מראש שהוצא משימוש, שמשמש לתכונות כמו <link rel="prerender">. בדומה לעיבוד מראש, הוא מאחזר משאבים מראש, אבל בניגוד לעיבוד מראש, הוא לא מבצע JavaScript או מבצע עיבוד מראש של חלק כלשהו מהדף. המטרה של NoState Prefetch היא להשתמש בפחות זיכרון מאשר עיבוד מראש, ועדיין לצמצם את זמני הטעינה של הדפים.

NoState Prefetch הוא לא ממשק API, אלא מנגנון שמשמש את Chrome להטמעת תכונות וממשקי API שונים. Resource Hints API, וגם האחסון המקדים של דפים על ידי סרגל הכתובות של Chrome, מיושמים באמצעות אחסון מקדים ללא מצב (NoState Prefetch). אם אתם משתמשים ב-Chrome מגרסה 63 ואילך, הדפדפן שלכם כבר משתמש ב-NoState Prefetch בתכונות כמו <link rel="prerender">.

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

למה בחרנו לעשות זאת?

היו לנו שתי סיבות עיקריות להוספת 'אחזור מראש ללא מצב':

צמצום השימוש בזיכרון

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

לעומת זאת, בדרך כלל עיבוד מראש צורך 100MB של זיכרון, והשימוש בזיכרון מוגבל ל-150MB. צריכת הזיכרון הגבוהה הזו לא מתאימה למכשירים ברמה נמוכה (כלומר, עם זיכרון RAM בנפח של 512MB לכל היותר). כתוצאה מכך, Chrome לא מבצע עיבוד מראש במכשירים ברמה נמוכה, ובמקום זאת יבצע חיבור מראש.

הקלה על תמיכה בתכונות חדשות בפלטפורמת האינטרנט

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

הטמעה

בשלבים הבאים מוסבר איך פועלת האצת האחזור ללא שמירת מצב.

1. האירוע NoStatePrefetch מופעל.

   רמז למשאב של עיבוד מראש (כלומר <link rel="prerender">) ותכונות מסוימות של Chrome יפעילו את NoState Prefetch בתנאי ששני התנאים הבאים מתקיימים: א) המשתמש לא משתמש במכשיר ברמה נמוכה, ב) המשתמש לא מחובר לרשת סלולרית.

2. נוצר נגן ייעודי חדש ל-NoState Prefetch.

   ב-Chrome, מעבד גרפיקה הוא תהליך שמקבל מסמך HTML, מנתח אותו, יוצר את עץ העיבוד שלו ומצייר את התוצאה במסך. לכל כרטיסייה ב-Chrome, וגם לכל תהליך של אחזור מראש ללא מצב (NoState Prefetch), יש עיבוד גרפי משלו כדי לספק בידוד. כך אפשר לצמצם את ההשפעות של בעיות (למשל, כרטיסייה קורסת) ולמנוע מקוד זדוני לגשת לכרטיסיות אחרות או לחלקים אחרים במערכת.

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

   NoState Prefetch תומך רק בשיטת ה-HTTP GET. הוא לא יגרוף משאבי משנה שדורשים שימוש בשיטות HTTP אחרות. בנוסף, הוא לא יגרור משאבים שדורשים פעולות של משתמשים (למשל, חלונות קופצים לאימות, אישור לקוח SSL או שינויים ידניים).

4. מקורות משנה שאוחזרים יאוחזרו עם עדיפות נטו 'לא פעילה'.

   עדיפות הרשת 'לא פעיל' היא עדיפות הרשת הנמוכה ביותר האפשרית ב-Chrome.

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

   כשמשתמשים ב-NoState Prefetch, המערכת שומרת במטמון את כל המשאבים, מלבד אלה עם הכותרת no-store Cache-Control. המערכת תבצע אימות מחדש של המשאב לפני השימוש בו אם יש כותרת תגובה מסוג Vary, כותרת Cache-Control מסוג no-cache או אם המשאב נוצר לפני יותר מ-5 דקות.

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

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

7. הדפדפן לא מבצע שינויים במצב מלבד עדכון מאגר קובצי ה-cookie ואחסון ה-DNS המקומי. חשוב לציין זאת כי זהו ה-'NoState' ב-'NoState Prefetch'.

   בשלב הזה בתהליך הטעינה "הנורמלי" של הדף, סביר להניח שהדפדפן יבצע פעולות שמשנות את מצב הדפדפן: לדוגמה, הפעלת JavaScript, שינוי של sessionStorage או localStorage, הפעלת מוזיקה או סרטונים, שימוש ב-History API או הצגת הודעה למשתמש. השינויים היחידים במצב שמתרחשים ב-NoState Prefetch הם עדכון המטמון של ה-DNS כשמתקבלות תשובות ועדכון מאגר קובצי ה-cookie אם התשובה מכילה את הכותרת Set-Cookie.

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

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

   אם בדף יש קובץ שירות, טעינת הדף תעבור שוב דרך קובץ השירות.

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

ההשפעה על Web Analytics

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

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

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

אני רוצה לראות

NoStatePrefetch שוחרר בדצמבר 2017 ב-Chrome 63. אנחנו משתמשים בו כרגע כדי:

• הטמעת ההצעה למשאב prerender
• אחזור התוצאה הראשונה בתוצאות החיפוש ב-Google
• אחזור דפים שמערכת Chrome צופה שסביר להניח שתבקשו לבקר בהם בשלב הבא

אתם יכולים להשתמש בנתונים הפנימיים של Chrome כדי לראות איך השתמשתם ב-NoStatePrefetch.

כדי להציג את רשימת האתרים שנטענו באמצעות NoState Prefetch, עוברים לכתובת chrome://net-internals/#prerender.

כדי להציג נתונים סטטיסטיים על השימוש שלכם ב-NoState Prefetch, עוברים אל chrome://histograms ומחפשים את 'NoStatePrefetch'. יש שלושה תרשים התאמה לעקומת צפיפות שונים של NoState Prefetch – אחד לכל תרחיש לדוגמה של NoState Prefetch:

• 'NoStatePrefetch' (נתונים סטטיסטיים לגבי שימוש בהצעות לשימוש במשאבים מראש לצורך עיבוד מראש)
• 'gws_NoStatePrefetch' (נתונים סטטיסטיים לגבי השימוש בדף תוצאות החיפוש ב-Google)
• 'omnibox_NoStatePrefetch' (נתונים סטטיסטיים לגבי השימוש בסרגל הכתובות של Chrome)