יום שלישי, 16 באפריל 2013

כיצד לשפר ביצועים של האתר- Leverage browser caching

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

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

לצורך זה קיים הפיצ'ר של- Leverage browser caching.


בצעדים הבאים אנחנו נבדוק האם האתר שלך עובד בצורה אופטימלית ובמידה ולא אסביר כיצד לסדר את העניין:

1. כנס ללינק הבא, של גוגל ובדוק האם האתר שלך קיבל הערה לגביי Leverage browser caching

2. רק במידה וכן, המשך לסעיף הבא. במידה ואין לך הערה הרי שאצלך הכל בסדר.

3. שמור את קובץ .htaccess המקורי של האתר שלך בצד וזאת מכיוון שאנחנו הולכים לערוך אותו.

4. ערוך את קובץ .htaccess של האתר. 

5. הוסף את השורות הבאות לקובץ:
<IfModule mod_expires.c>

# Enable expirations
ExpiresActive On

Files Match "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">
ExpiresDefault "access plus 1 month"
</FilesMatch>
</IfModule>


6. בוא נבין מה הכנסנו פה:
קודם בדקנו האם השרת שמאכסן את האתר שלכם יכול בכלל לטפל בבעיית Leverage browser caching
<IfModule mod_expires.c>

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

ExpiresActive On
<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">

ופה חלק מאד חשוב- תקופת השמירה של הקבצים אצל המחשב של המשתמש.
ExpiresDefault "access plus 1 month"
ניתן להגדיר כל תקופה שתחפצו, בתור המלצה תתחילו משבוע, תעלו לחודש ואז לשנה, הכל תלוי בסטטיות של האתר.
week, month, year.

7. אחריי שעדכנתם את השרת עם הקובץ המעודכן הריצו את הטסט בסעיף 1 שוב עד שהסעיף לא יהיה קיים יותר.


הערות:
1. מתאים רק לשרתים מסוג לינוקס.

2. שים לב- במידה ושינית את אחד הקבצים שמאוחסנים אצל המשתמש, המשתמש לא יידע על כך עד שייגמר זמן ההמתנה. כיצד ניתן לעקוף זאת? ע"י כך שתיתן שם שונה לקובץ המעודכן.

3. ניתן לערוך את הקובץ בצורה יותר מפורטת לפי קבצים שונים.
למשל-
<IfModule mod_expires.c>

# Enable expirations
ExpiresActive On

# Default directive
ExpiresDefault "access plus 1 month"

# My favicon
ExpiresByType image/x-icon "access plus 1 year”

# Images
ExpiresByType image/gif "access plus 1 week"
ExpiresByType image/png "access plus 1 month"
ExpiresByType image/jpg "access plus 1 year"

# CSS
ExpiresByType text/css "access 1 month”

# Javascript
ExpiresByType application/javascript "access plus 1 year"

</IfModule>

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

2 comments:

שלום, ביצעתי מה שאמרת (חוץ מהערה 3)
וכשבדקתי הסעיף באמת ירד והאתר איתו והוצגה לי שגיאה 500 באתר
אשמח לדעת מה הפתרון,
kesefmahir@gmail.com

שגיאה 500 אומרת שההקלדה שלך בוצעה עם שגיאה כלשהי ברמת התחביר.

הוסף רשומת תגובה

Twitter Delicious Facebook Digg Stumbleupon Favorites More