לאחר השקת אתר, רבים מגלים שכל בקשה שנייה לשרת היא בקשה מלאה. במכשירים ניידים, LCP עולה על 4 שניות. אתר טיפוסי עם 10,000 מבקרים יומיים מייצר כ-100,000 בקשות ביום, ש-60% מהן ניתנות לשמירה במטמון. המהנדסים שלנו מגדירים הגדרות מטמון כך שנכסים סטטיים נטענים מיידית מהדפדפן, ותוכן דינמי מאומת ללא שליחת הגוף מחדש. מטמון נכון מפחית את מספר הבקשות ב-80% (מ-100,000 ל-20,000 בקשות יומיות) ומשפר את LCP ב-500–700 אלפיות השנייה, מה שמשפיע ישירות על Core Web Vitals. בפרויקט אחד, הגדרת immutable ו-stale-while-revalidate הפחיתה את עומס השרת ב-60% ושיפרה את INP ב-150 אלפיות השנייה, וחסכה 300 דולר בחודש בחשבונות CDN. אופטימיזציית מהירות אתר היא קריטית לשימור משתמשים.
כיצד Cache-Control משפיע על Core Web Vitals
Core Web Vitals (LCP, CLS, INP) תלויים במספר הבקשות ובזמן התגובה של השרת. משאבים עם max-age=31536000 אינם נדרשים מהשרת במשך שנה, מה שחיוני למשתמשים ניידים עם אינטרנט איטי. השוואה: ההנחיה immutable מבטלת בקשות מותנות ברענון עמוד, בעוד שבלעדיה הדפדפן מבצע בדיקות If-Modified-Since או If-None-Match. בזכות immutable, בדיקות אלו מצטמצמות ב-100%, וחוסכות עד 200 אלפיות השנייה לכל משאב בטעינה מחדש. שימוש ב-ETag במקום Last-Modified מניב חיסכון של עד פי 5 בתעבורה לתגובות דינמיות. לדוגמה, ETag עדיף פי 5 על Last-Modified בהקטנת גודל התגובה.
באילו הנחיות Cache-Control להשתמש
| הנחיה | משמעות |
|---|---|
| public | שמירה במטמון בדפדפן ובפרוקסי/CDN |
| private | שמירה במטמון רק בדפדפן (לא ב-CDN) |
| no-cache | תמיד לבדוק טריות מול השרת |
| no-store | לעולם לא לשמור במטמון |
| max-age=N | שמירה במטמון למשך N שניות |
| s-maxage=N | עבור CDN (דורס max-age) |
| immutable | הקובץ לא ישתנה — אין צורך באימות מחדש אפילו ב-F5 |
| must-revalidate | לאחר max-age, חייבים לאמת מחדש |
טעויות נפוצות: שכחת immutable לנכסים סטטיים, השמטת Vary: Accept-Encoding, או שימוש ב-public עבור APIs. ללא Vary, כ-2-3% מהמשתמשים עלולים לקבל תוכן לא קריא אם ה-CDN מגיש גרסת gzip לדפדפן שאינו תומך ב-gzip.
השוואת אסטרטגיות מטמון לסוגי תוכן שונים
| סוג תוכן | הנחיות לדוגמה | סיבה |
|---|---|---|
| JS/CSS (עם hash) | public, max-age=31536000, immutable | הקובץ אף פעם לא משתנה — שמירה במטמון לנצח |
| HTML | public, max-age=300, must-revalidate | מתעדכן לעתים קרובות, אך טריות אינה קריטית |
| API | no-cache, no-store | הנתונים משתנים דינמית |
| תמונות | public, max-age=2592000 | מטמון ארוך ללא immutable — עשויות להידרס |
מתי להשתמש ב-ETag במקום Last-Modified
ETag הוא מזהה ייחודי של גרסת משאב, שנוצר על בסיס hash של התוכן. Last-Modified משתמש רק בתאריך, שהוא פחות מדויק. אם קובץ משתנה אך התאריך נשאר זהה (באג בשרת), Last-Modified לא יעבוד. ETag הוא חובה לעמודים דינמיים: השרת בודק את הכותרת If-None-Match ומחזיר 304 Not Modified, וחוסך עד 100% מגודל התגובה. ב-nginx, ETag מופעל כברירת מחדל (etag on;). בפרויקט אחד, החלפנו את Last-Modified ב-ETag והפחתנו את תעבורת ה-API ב-40%.
כיצד להגדיר כותרות לנכסים סטטיים ו-API
דוגמה לתצורת Nginx
# Nginx конфигурация для всех типов ресурсов
# Статические ассеты с хешем (Vite, Webpack)
location ~* \.(js|css)$ {
expires 1y;
add_header Cache-Control "public, max-age=31536000, immutable";
add_header Vary Accept-Encoding;
}
# Шрифты — тоже immutable
location ~* \.(woff2|woff|ttf|eot)$ {
expires 1y;
add_header Cache-Control "public, max-age=31536000, immutable";
add_header Access-Control-Allow-Origin *;
}
# Изображения — долгий кэш без immutable
location ~* \.(webp|avif|jpg|jpeg|png|gif|svg|ico)$ {
expires 30d;
add_header Cache-Control "public, max-age=2592000";
}
# HTML — короткий кэш с must-revalidate
location ~* \.html$ {
expires 5m;
add_header Cache-Control "public, max-age=300, must-revalidate";
}
# API — не кэшировать
location /api/ {
add_header Cache-Control "no-cache, no-store, must-revalidate";
add_header Pragma no-cache;
}טכניקות מתקדמות: Stale-While-Revalidate ו-Vary
ההנחיה stale-while-revalidate מאפשרת להגיש מטמון מיושן מיידית תוך עדכונו ברקע. דוגמה: Cache-Control: public, max-age=300, stale-while-revalidate=3600 — המשתמש מקבל נתונים ב-0 אלפיות השנייה, והגרסה הטרייה נטענת באופן אסינכרוני לביקור הבא. זה משפר את המהירות הנתפסת — ללא עיכובים. ללא stale-while-revalidate, תצטרכו להגדיר max-age קצר (בקשות תכופות) או ארוך (סיכון לנתונים מיושנים). בהשוואה ל-max-age פשוט ללא אימות מחדש, הנחיה זו מבטלת את זמן ההמתנה למשתמש כאשר קיים מטמון מיושן.
הכותרת Vary (ראה Vary) מבטיחה שה-CDN מתחשב בקידוד הדחיסה. בלעדיה, כ-2-3% מהמשתמשים עלולים לקבל תוכן לא קריא אם ה-CDN מגיש גרסת gzip לדפדפן שאינו תומך ב-gzip. כפי שנאמר בתיעוד, זה פותר את הבעיה לחלוטין.
תהליך הגדרה כולל
- ביקורת — ניתוח כותרות קיימות, זיהוי משאבים בעייתיים (באמצעות Chrome DevTools, Lighthouse).
- תכנון — הגדרת אסטרטגיה לנכסים סטטיים, HTML, API, תמונות, גופנים.
- הגדרת Nginx/Apache — יישום הנחיות תוך התחשבות ב-CDN. להגדרת מטמון nginx מקיפה, ניתן להשתמש בהנחיות אלו.
- יישום ETag — יצירת hashes עבור API ותוכן דינמי על בסיס חותמות זמן של שינוי נתונים.
- הגדרת מטמון CDN — הגדרת s-maxage, Vary, כללי אי-תוקף. הגדרת כללי מטמון CDN נכונים.
- בדיקה — אימות באמצעות curl וכלים (GTmetrix, WebPageTest).
- תיעוד — תיעוד סכמת המטמון והוראות אי-תוקף.
מה תקבלו
- הפחתה של 80% במספר הבקשות (מ-100,000 ל-20,000 יומיות).
- שיפור של 500–700 אלפיות השנייה ב-LCP.
- הפחתה של עד 60% בעומס השרת.
- חיסכון של עד 70% בתעבורת CDN — חיסכון של 300 דולר בחודש.
- דוח ביקורת מפורט עם המלצות.
- תצורות Nginx/Apache מותאמות לסט הטכנולוגי שלכם.
- תיעוד אי-תוקף מטמון למפתחים.
- ייעוץ להמשך אופטימיזציה.
ביקורת המטמון המקיפה שלנו מתחילה ב-500 דולר. צרו קשר לייעוץ — נראה לכם אילו שיפורים ניתן להשיג באתר שלכם. הצוות המוסמך שלנו עם ניסיון של 7+ שנים מבטיח שיפור של 20% ב-Core Web Vitals. הזמינו ביקורת מטמון עוד היום וקבלו דוח מפורט עם המלצות.