به زود وب خوش آمدید

رفع خطای leverage browser caching در GTmetrix

مدیر سایت مدیر سایت
۱ آبان ۱۳۹۹
۰
728
رفع خطای leverage browser caching در GTmetrix

رفع خطای leverage browser caching در GTmetrix : اگر از بازدیدکنندگان بخواهند صفحه وب شما را ذخیره و استفاده مجدد کنند ، می توان زمان لود صفحه را بسیار بهبود ببخشید.

  • زمان لود صفحه برای بازدیدکنندگان تکراری را کاهش می دهد.
  • به ویژه در وب سایت هایی که کاربران به طور منظم از همان مناطق وب سایت بازدید می کنند ، موثر است.
  • نسبت سود و هزینه: زیاد است
  • دسترسی لازم است.

کش مرورگر (browser caching) چیست؟

هر بار که یک مرورگر یک صفحه وب را لود می کند ، باید تمام فایلهای وب را دانلود کند تا صفحه به درستی نمایش داده شود. این شامل تمام HTML ، CSS ، JavaScript و تصاویر است.

بعضی از صفحات ممکن است فقط از چند فایل تشکیل شده و سایز کمی داشته باشند – شاید دو کیلو بایت. با این وجود ممکن است فایل های زیادی برای دیگران وجود داشته باشد و ممکن است به چندین مگابایت حجم اضافه شوند. به عنوان مثال Twitter.com 3 مگابایت است.این مورد دو عیب دارد:

۱. فایل های حجیم لود طولانی تری خواهند داشت و اگر کاربری اینترنت کندی داشته باشد (یا دستگاه تلفن همراه) باشد ، بسیار عذاب آور و ناراحت کننده خواهد بود.

۲. هر فایل درخواست جداگانه ای از سرور می کند. هرچه درخواست های سرور به طور همزمان بیشتر شود ، کار بیشتری نیز باید انجام دهد که این امر فقط سرعت صفحه شما را بیشتر کاهش می دهد.

کش مرورگر به شما کمک می کند برخی از این فایل ها را در مرورگر لوکال خود ذخیره کنید. لود اولین بازدید آنها در سایت شما مدتی طول خواهد کشید ، با این حال وقتی این کاربر وب سایت شما را مرور می کند ، صفحه را refresh می کند یا حتی به صفحه دیگری از سایت شما منتقل می شود ، در حال حاضر چند فایل مورد نیاز در لوکال خود دارند.این بدان معناست که میزان داده ای که مرورگر کاربر لود می کند کمتر است و درخواست کمتری به سرور شما می رود. نتیجه؟ زمان لود صفحه را کاهش دهید.

چگونه کار می کند؟

کش مرورگر با علامت گذاری صفحات خاص ، یا بخشهایی از صفحات ، به عنوان مورد نیاز برای به روزرسانی در فواصل زمانی مختلف ، کار می کند. بعنوان مثال ، لوگو شما در وب سایت بعید است که روز به روز تغییر کند. با ذخیره این تصویر لوگو، می توانیم به مرورگر کاربر بگوییم که فقط هفته ای یک بار این تصویر را لود کند. هر بازدیدی که کاربر طی یک هفته انجام می دهد نیازی به لود مجدد تصویر لوگو ندارد.

با گفتن اینکه سرور وب به مرورگر می گوید این فایل ها را ذخیره کند و هنگام بازگشت آنها را لود نکند ، باعث صرفه جویی در وقت کاربران و پهنای باند وب سرور شما می شود.

چرا مهم است؟

دلیل اصلی مهم بودن کش مرورگر این است که باعث کاهش بار در وب سرور شما می شود و در نتیجه زمان لود برای کاربران کاهش می یابد.

چگونه از کش مرورگر استفاده کنیم.

برای فعال کردن کش مرورگر ، باید هدر های HTTP خود را ویرایش کنید تا زمان انقضا برای انواع خاصی از فایل ها تعیین شود.

رفع خطای leverage browser caching در GTmetrix

رفع خطای leverage browser caching با متد Expires در htaccess.

فایل htaccess خود را در روت دامنه خود پیدا کنید. این فایل یک فایل مخفی است اما باید در سرویس گیرنده های FTP مانند FileZilla یا CORE نشان داده شود. می توانید فایل .htaccess را با notepad یا هر شکلی از ویرایشگر متن اصلی ویرایش کنید.

در این فایل ما پارامترهای caching خود را تنظیم می کنیم تا به مرورگر بگوییم چه نوع فایل هایی را cache می کند.

  ExpiresActive On

  # Images
  ExpiresByType image/jpeg "access plus 1 year"
  ExpiresByType image/gif "access plus 1 year"
  ExpiresByType image/png "access plus 1 year"
  ExpiresByType image/webp "access plus 1 year"
  ExpiresByType image/svg+xml "access plus 1 year"
  ExpiresByType image/x-icon "access plus 1 year"

  # Video
  ExpiresByType video/webm "access plus 1 year"
  ExpiresByType video/mp4 "access plus 1 year"
  ExpiresByType video/mpeg "access plus 1 year"

  # Fonts
  ExpiresByType font/ttf "access plus 1 year"
  ExpiresByType font/otf "access plus 1 year"
  ExpiresByType font/woff "access plus 1 year"
  ExpiresByType font/woff2 "access plus 1 year"
  ExpiresByType application/font-woff "access plus 1 year"

  # CSS, JavaScript
  ExpiresByType text/css "access plus 1 month"
  ExpiresByType text/javascript "access plus 1 month"
  ExpiresByType application/javascript "access plus 1 month"

  # Others
  ExpiresByType application/pdf "access plus 1 month"
  ExpiresByType image/vnd.microsoft.icon "access plus 1 year"

بسته به پرونده های وب سایت خود می توانید زمان های مختلف انقضا را تنظیم کنید. اگر انواع خاصی از فایل ها به طور مرتب به روز شوند ، شما زمان انقضا زودتر را روی آنها تنظیم می کنید (به عنوان مثال پرونده های css)

پس از اتمام کار ، فایل را همانطور که هست ذخیره کنید و نه به عنوان یک فایل .txt.

رفع خطا leverage browser caching با متد Cache-Control در htaccess.

این خط کد را در فایل htaccess قرار دهید.

<filesMatch ".(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">
Header set Cache-Control "max-age=84600, public"
</filesMatch>

رفع خطا leverage browser caching با متد Expires در NGINX

می بایست کدهای ذیل را در سرور قرار دهید.

location ~* \.(jpg|jpeg|gif|png)$ {
expires 365d;
}
location ~* \.(pdf|css|html|js|swf)$ {
expires 2d;
}

رفع خطا leverage browser caching با متد Cache-Control در NGINX
می بایست کدهای زیر را در سرور قرار دهید.

location ~* \.(js|css|png|jpg|jpeg|gif|ico)$ {
expires 2d;
add_header Cache-Control "public, no-transform";
}

اگر از هر شکلی از CMS استفاده می کنید ، ممکن است پلاگین ها یا افزونه های کش در دسترس باشد.

توصیه ها

  • انقضا حداقل یک ماه (توصیه می شود: دسترسی به علاوه ۱ سال)
  •  کش خود را بیش از یک سال تنظیم نکنید!
  • هنگام فعال کردن حافظه browser caching مراقب باشید زیرا اگر پارامترها را روی برخی از فایل ها خیلی طولانی تنظیم کنید ، ممکن است کاربران پس از به روزرسانی نسخه جدید وب سایت شما را دریافت نکنند.
برچسب‌ها

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *