הכלל הזה מופעל כשמערכת PageSpeed Insights מזהה שנדרשות פעולות הלוך ושוב ברשת כדי לעבד את התוכן בחלק העליון והקבוע של הדף.
סקירה כללית
אם כמות הנתונים הנדרשת חורגת מחלון העומס הראשוני (בדרך כלל 14.6kB דחוסה), יידרשו פעולות הלוך ושוב נוספות בין השרת לדפדפן של המשתמש. אצל משתמשים ברשתות עם זמן אחזור ארוך, כמו רשתות סלולריות, הדבר עלול לגרום לעיכובים משמעותיים בטעינת הדף.
המלצות
כדי שהדפים ייטענו מהר יותר, צריך להגביל את גודל הנתונים (תגי עיצוב של HTML, תמונות, CSS, JavaScript) הדרושים לעיבוד התוכן שבחלק העליון והקבוע של הדף. אפשר לעשות את זה בכמה דרכים:- צריך לבנות את קוד ה-HTML כדי לטעון קודם את התוכן הקריטי שבחלק העליון והקבוע
- הפחתת כמות הנתונים שבהם המשאבים משתמשים
צריך לבנות את ה-HTML כדי לטעון קודם את התוכן הקריטי שבחלק העליון והקבוע
צריך לטעון קודם את התוכן הראשי של הדף. בנו את הדף כך שהתגובה הראשונית מהשרת שלכם תשלח את הנתונים הנחוצים כדי לעבד באופן מיידי את החלק הקריטי של הדף, ולדחות את השאר. כלומר, צריך לפצל את ה-CSS לשני חלקים: חלק בתוך השורה שאחראי על עיצוב החלק העליון של התוכן, והחלק שניתן לדחות.
ריכזנו כאן כמה דוגמאות לדרכים שבהן אפשר לארגן מחדש את האתר כדי שייטען מהר יותר:
- אם קוד ה-HTML טוען ווידג'טים של צד שלישי לפני שהתוכן הראשי נטען, קודם צריך לשנות את הסדר כדי לטעון את התוכן הראשי.
- אם האתר שלכם כולל עיצוב של שתי עמודות עם סרגל צד לניווט ומאמר, אבל קוד ה-HTML טוען את סרגל הצד לפני הכתבה, מומלץ לטעון את המאמר תחילה.
הפחתת כמות הנתונים שבהם המשאבים משתמשים
אחרי עיצוב האתר מחדש כך שיפעל היטב במכשירים שונים ויטענו קודם את התוכן הקריטי, משתמשים בשיטות הבאות כדי לצמצם את כמות הנתונים הנדרשים לעיבוד הדף:- הקטנת משאבים: אפשר להקטין HTML, CSS ו-JavaScript על ידי הסרת רווחים לבנים והערות. ניתן לבצע אופטימיזציות נוספות באמצעות כלים שמשנים את השמות של שמות המשתנים במשאבים שלכם.
- מומלץ להשתמש ב-CSS במקום בתמונות במידת האפשר.
- הפעלת דחיסה
משוב
האם הדף הזה הועיל לך?