הצגת משאבים המבוססים על טקסט צריכה להתבצע בעזרת דחיסת נתונים כדי לצמצם את כמות הבייטים שמועברים ברשת. בקטע 'הזדמנויות' בדוח Lighthouse מפורטים כל המשאבים מבוססי-הטקסט שלא נדחסו:
איך Lighthouse מטפל בדחיסת טקסט
Lighthouse אוסף את כל התשובות ש:
- יש לכם סוגי משאבים שמבוססים על טקסט.
- אל תכללו כותרת
content-encodingעם הערכיםbr,gzipאוdeflate.
לאחר מכן, Lighthouse דוחס כל אחד מהקבצים האלה באמצעות GZIP כדי לחשב את החיסכון הפוטנציאלי.
אם הגודל המקורי של תגובה הוא פחות מ-1.4KiB, או אם החיסכון הפוטנציאלי בדחיסה הוא פחות מ-10% מהגודל המקורי, Lighthouse לא מסמן את התגובה הזו בתוצאות.
הפעלת דחיסת טקסט בשרת
כדי לעבור את הביקורת הזו, צריך להפעיל דחיסת טקסט בשרתים שמהם נשלחו התגובות האלה.
כשדפדפן מבקש משאב, הוא משתמש בכותרת בקשת ה-HTTP Accept-Encoding כדי לציין אילו אלגוריתמי דחיסה הוא תומך בהם.
Accept-Encoding: gzip, compress, br
אם הדפדפן תומך ב-Brotli
(br), כדאי להשתמש ב-Brotli כי הוא יכול לצמצם את גודל הקובץ של המשאבים יותר מאלגוריתמי הדחיסה האחרים. מחפשים את how to enable Brotli compression in <X>, כאשר <X> הוא שם השרת. נכון לדצמבר 2022, יש תמיכה ב-Brotli בכל הדפדפנים המובילים, למעט Safari ב-iOS. אפשר לעיין בתאימות לדפדפנים כדי לראות עדכונים.
משתמשים ב-GZIP כגיבוי ל-Brotli. GZIP נתמך בכל הדפדפנים המובילים, אבל הוא פחות יעיל מ-Brotli. דוגמאות מופיעות במאמר הגדרות שרת.
השרת צריך להחזיר את כותרת התגובה של HTTP Content-Encoding כדי לציין באיזה אלגוריתם דחיסה הוא השתמש.
Content-Encoding: br
בדיקה אם התשובה דחוסה
כדי לבדוק אם השרת דחס תשובה:
מקישים על Control+Shift+J (או על Command+Option+J ב-Mac) כדי לפתוח את כלי הפיתוח.
לוחצים על הכרטיסייה 'רשת'.
- מקישים על Control+Shift+J (או על Command+Option+J ב-Mac) כדי לפתוח את כלי הפיתוח.
- לוחצים על הכרטיסייה רשת.
- לוחצים על הבקשה שגרמה לתגובה שרוצים לראות.
- לוחצים על הכרטיסייה Headers (כותרות).
- בודקים את הכותרת
content-encodingבקטע Response Headers.
content-encoding.
כדי להשוות בין הגודל הדחוס והגודל הלא דחוס של תשובה:
- מקישים על Control+Shift+J (או על Command+Option+J ב-Mac) כדי לפתוח את כלי הפיתוח.
- לוחצים על הכרטיסייה רשת.
- מפעילים את האפשרות 'שורות בקשה גדולות'. איך משתמשים בשורות בקשה גדולות
- בודקים את העמודה גודל בשורה של התגובה שמעניינת אתכם. הערך העליון הוא הגודל הדחוס. הערך התחתון הוא הגודל אחרי הפתיחה.
אפשר גם לעיין במאמר בנושא הקטנה ודחיסה של מטען ייעודי (payload) ברשת.
הנחיות ספציפיות לטכנולוגיה
- Drupal: הצגת משאבים שמבוססים על טקסט צריכה להתבצע בעזרת דחיסת נתונים (gzip, deflate או brotli) כדי לצמצם את כמות הבייטים שמועברים ברשת. כדאי להשתמש ב-CDN שתומך בכך במקור, או להגדיר את שרת האינטרנט לבצע את הפעולה הזו. מידע נוסף
- Joomla: מפעילים את ההגדרה Gzip Page Compression (דחיסת נתונים בדף בשיטת Gzip) (מערכת > הגדרה גלובלית > שרת).
- WordPress: מפעילים דחיסת טקסט בהגדרות של שרת האינטרנט.