אתה פותח אתר ביטריקס בביקור חוזר — זמן טעינה 4 שניות. Waterfall: 80 בקשות לקבצים סטטיים, כל אחת מחזירה 304 Not Modified. TTFB הוא 200 אלפיות השנייה, אבל הדפדפן עדיין בודק כל קובץ. שורש הבעיה הוא כותרות מטמון שגויות. הצוות שלנו עם ניסיון של למעלה מ-5 שנים בביטריקס מטפל בזה במפתח מוכן.
תצורה נכונה מבטלת בקשות מיותרות: דפדפנים מאחסנים קבצים מקומית ולא פונים לשרת עד שתוקף המטמון יפוג. לקוחות מקבלים זמני טעינה מהירים יותר; שרתים חווים עומס מופחת. לדוגמה, לאחר תצורה בפרויקט אחד, מספר הבקשות הסטטיות ירד מ-80 ל-12, וזמן הטעינה מ-4 שניות ל-1.2 שניות. החיסכון באחסון הגיע להפחתה חודשית משמעותית בשל עומס שרת נמוך יותר.
מה הם Cache-Control ו-Expires?
Cache-Control הוא כותרת HTTP שאומרת לדפדפן כמה זמן לשמור במטמון משאב. הפרמטר max-age מציין את הזמן בשניות. Expires הוא כותרת ישנה יותר שעדיין בשימוש במקרים מסוימים. לפי RFC 7234, Cache-Control מקבל עדיפות על פני Expires. עבור קבצים סטטיים עם hashes, אנו משתמשים ב-max-age=31536000 (שנה אחת) עם הדגל immutable.
רעננות לעומת אימות
| פרמטר | רעננות | אימות |
|---|---|---|
| בקשה לשרת | לא | כן (304) |
| חיסכון בזמן | מלא | חלקי |
| דוגמת כותרת | Cache-Control: max-age=31536000 |
ETag: "abc123" |
| מתי להשתמש | קבצים סטטיים עם גרסה | HTML, משאבים ללא hash |
רעננות נותנת זמן טעינה אפסי מהמטמון. אימות חוסך רוחב פס אבל לא RTT. לביצועים מקסימליים, אנו מגדירים את שני המנגנונים.
איך להגדיר nginx למטמון דפדפן בביטריקס?
server { # HTML — короткий кэш с revalidation location ~* \.html?$ { add_header Cache-Control "no-cache, must-revalidate"; etag on; } # CSS, JS с хэшами в именах (Vite/Webpack) — долгий кэш location ~* /build/assets/.*\.[a-f0-9]{8,}\.(css|js)$ { add_header Cache-Control "public, max-age=31536000, immutable"; access_log off; } # Статика без хэшей — умеренный кэш location ~* \.(css|js)$ { add_header Cache-Control "public, max-age=604800"; etag on; } # Изображения location ~* \.(jpg|jpeg|png|gif|webp|avif|ico|svg)$ { add_header Cache-Control "public, max-age=2592000"; access_log off; } # Шрифты location ~* \.(woff|woff2|ttf|otf|eot)$ { add_header Cache-Control "public, max-age=31536000, immutable"; add_header Access-Control-Allow-Origin "*"; access_log off; } # Ресурсы Битрикс (без хэшей) location ~* ^/bitrix/(js|css|fonts)/ { add_header Cache-Control "public, max-age=604800"; etag on; } } ההוראה server { # HTML — короткий кэш с revalidation location ~* \.html?$ { add_header Cache-Control "no-cache, must-revalidate"; etag on; } # CSS, JS с хэшами в именах (Vite/Webpack) — долгий кэш location ~* /build/assets/.*\.[a-f0-9]{8,}\.(css|js)$ { add_header Cache-Control "public, max-age=31536000, immutable"; access_log off; } # Статика без хэшей — умеренный кэш location ~* \.(css|js)$ { add_header Cache-Control "public, max-age=604800"; etag on; } # Изображения location ~* \.(jpg|jpeg|png|gif|webp|avif|ico|svg)$ { add_header Cache-Control "public, max-age=2592000"; access_log off; } # Шрифты location ~* \.(woff|woff2|ttf|otf|eot)$ { add_header Cache-Control "public, max-age=31536000, immutable"; add_header Access-Control-Allow-Origin "*"; access_log off; } # Ресурсы Битрикс (без хэшей) location ~* ^/bitrix/(js|css|fonts)/ { add_header Cache-Control "public, max-age=604800"; etag on; } } מונעת מהדפדפן לבדוק מחדש את הקובץ אפילו ברענון כפוי (Ctrl+F5). יש להחיל אותה רק על קבצים עם hashes גרסה בשם — זה בטוח.
למה גרסת משאבים חשובה?
ללא גרסה, מטמון ארוך הוא סיכון: עדכן את ה-CSS שלך ומשתמשים יראו את העיצוב הישן במשך שבוע. הפתרון הוא hash בשם הקובץ.
המנגנון המובנה של ביטריקס משתמש בפרמטר immutable בכתובת ה-URL. הוא משתנה בכל סשן, ושובר את המטמון יותר מהנדרש. עדיף להשתמש ב-Vite/Webpack: app-B3vCf7Tf.js. עבור קבצים כאלה, הגדר max-age=31536000, immutable.
אם אינך משתמש ב-bundler, הוסף גרסה ידנית:
// В header.php шаблона $version = trim(file_get_contents($_SERVER['DOCUMENT_ROOT'] . '/version.txt')); echo '<link rel="stylesheet" href="/css/custom.css?v=' . $version . '">'; הקובץ // В header.php шаблона $version = trim(file_get_contents($_SERVER['DOCUMENT_ROOT'] . '/version.txt')); echo '<link rel="stylesheet" href="/css/custom.css?v=' . $version . '">'; מתעדכן ב-CI/CD בכל פריסה.
איך להגדיר Apache .htaccess?
<IfModule mod_expires.c> ExpiresActive On ExpiresByType text/html "access plus 0 seconds" ExpiresByType text/css "access plus 1 week" ExpiresByType application/javascript "access plus 1 week" ExpiresByType image/jpeg "access plus 1 month" ExpiresByType image/png "access plus 1 month" ExpiresByType image/webp "access plus 1 month" ExpiresByType font/woff2 "access plus 1 year" </IfModule> <IfModule mod_headers.c> <FilesMatch "\.(css|js)$"> Header set Cache-Control "public, max-age=604800" </FilesMatch> </IfModule> מה כלול בהגדרת המטמון?
| שלב | תיאור | זמן |
|---|---|---|
| ביקורת | ניתוח כותרות קיימות ומבנה | 2–4 שעות |
| תצורה | הגדרת nginx/Apache | 1–2 שעות |
| גרסה | יישום hashes או פרמטר גרסה | 2–6 שעות |
| בדיקות | אימות באמצעות curl ו-DevTools | שעה אחת |
| תיעוד | תיאור השינויים | שעה אחת |
סה"כ 7–14 שעות. עלות ההגדרה תלויה בהיקף העבודה ובתצורת השרת — צור קשר לקבלת הצעת מחיר. התוצאה היא זמני טעינה מהירים יותר ועומס שרת מופחת.
איך לאמת את התצורה?
curl -sI https://site.ru/css/styles.css | grep -i "cache-control\|expires\|etag" Chrome DevTools → Network → בחר משאב → Headers: בדוק <IfModule mod_expires.c> ExpiresActive On ExpiresByType text/html "access plus 0 seconds" ExpiresByType text/css "access plus 1 week" ExpiresByType application/javascript "access plus 1 week" ExpiresByType image/jpeg "access plus 1 month" ExpiresByType image/png "access plus 1 month" ExpiresByType image/webp "access plus 1 month" ExpiresByType font/woff2 "access plus 1 year" </IfModule> <IfModule mod_headers.c> <FilesMatch "\.(css|js)$"> Header set Cache-Control "public, max-age=604800" </FilesMatch> </IfModule> ב-Response Headers, וראה curl -sI https://site.ru/css/styles.css | grep -i "cache-control\|expires\|etag" / Cache-Control בעמודת Size בטעינות חוזרות.
למה לא לשמור HTML במטמון עם משך זמן ארוך?
דפי HTML מכילים תוכן דינמי (עגלה, נתונים אישיים). אם תגדיר `max-age` > 0, משתמשים יראו נתונים מיושנים. השתמש ב-`no-cache, must-revalidate` עבור HTML ובמטמון מתויג בצד השרת.מקרה בוחן
באתר מסחר אלקטרוני עם קטלוג של 50,000 מוצרים, לאחר הגדרת מטמון דפדפן:
- זמן טעינת הדף ירד מ-4.2 שניות ל-1.8 שניות (הפחתה של 57%).
- בקשות השרת ירדו מ-95 ל-22.
- עומס ה-CPU ירד ב-40%, מה שהוביל לחיסכון חודשי משמעותי באחסון.
לאחר יישום גרסת משאבים, בעיית העיצוב המיושן נעלמה לחלוטין. הלקוח מרוצה.
טעויות נפוצות בהגדרת מטמון דפדפן
בעיות נפוצות שאנו פותרים בביקורות פרויקטים של ביטריקס:
from cacheארוך מדי עבור דפי HTML — משתמשים רואים תוכן מיושן לאחר עדכונים. עבור HTML, השתמש ב-from disk cache.- חוסר גרסה עבור CSS/JS — לאחר פריסה, הדפדפן ממשיך להשתמש במטמון הישן. פתרון: hash בשם הקובץ או פרמטר
max-age. - ערבוב כותרות
no-cache, must-revalidateו-?v=— הן מתנגשות;Expiresמקבל עדיפות, אז הסר אתCache-Control. - חוסר
Cache-Controlעל משאבים דחוסים — CDN עשוי לשרת גרסה דחוסה לדפדפנים ללא תמיכת gzip. -
Expiresהוראה לקבצים ללא hashes — הדפדפן לא יביא עדכונים אפילו ברענון כפוי.
אסטרטגיית מטמון נכונה מתחשבת בסוג המשאב, סכמת הגרסה והמאפיינים הספציפיים של פלטפורמת ביטריקס.
הערך את הפרויקט שלך — צור קשר לייעוץ חינם. אנו מבטיחים תוצאות. קישורים קשורים: ויקיפדיה: HTTP cache, ויקיפדיה: ETag.







