معرفی مفهوم Cache Control و روش کار با آن
یکی از مواردی که می تواند در بهبود سرعت سایت و بارگزاری سریع آن تاثیرگذار باشد، استفاده از تکنیک Cache Control می باشد. در این مقاله قصد داریم تا با این مفهوم آشنا شده و نحوه بکارگیری آن را بررسی کنیم.
اما پیش از پرداختن در مورد آموزش کار با Cache Control یا همان کنترل کش، لازم است تا با مفهوم Cache آشنا شویم و همچنین تعریف کنیم Cache Browser به چه معناست و لازمه استفاده از آن در مرورگرها چیست؟
حافظه Cache چیست؟
Cache یک روش است که با استفاده از آن می توان سرعت بارگذاری صفحات وب را افزایش داد. Cache وب سایت به معنای ذخیره سازی موقت بخش هایی از صفحات وب است که معمولا تغییر نمی کنند، مانند تصاویر، فونت ها، فایل های CSS و JavaScript. با این کار، هر بار که کاربر یک صفحه وب را باز می کند، نیازی نیست که تمام این بخش ها را دوباره از سرور دریافت کند، بلکه می تواند از نسخه ای که در حافظه موقت مرورگر یا سرور پروکسی ذخیره شده است، استفاده کند. این کار باعث می شود که صفحات وب سریع تر بارگذاری شوند و ترافیک شبکه کاهش یابد.
Cache وب سایت دارای دو نوع اصلی است:
- Cache سمت کاربر (client-side caching)
- Cache سمت سرور (server-side caching)
Cache سمت کاربر به معنای ذخیره سازی بخش های صفحات وب در حافظه موقت مرورگر کاربر است. این نوع کش با استفاده از HTTP headers مانند Cache-Control، Expires و ETag تنظیم می شود. با این روش، مرورگر می تواند بفهمد که چه بخش هایی از صفحات وب را باید در حافظه موقت خود ذخیره کند و چگونه با سرور هماهنگ شود تا بفهمد که آیا نسخه ذخیره شده هنوز به روز است یا خیر.
Cache سمت سرور به معنای ذخیره سازی بخش های صفحات وب در حافظه موقت یک سرور پروکسی است. این نوع کش با استفاده از HTTP headers مانند Vary، Age و Last-Modified تنظیم می شود. با این روش، سرور پروکسی می تواند بفهمد که چگونه به درخواست های کاربران پاسخ دهد.
اگر درخواست یک کاربر با یک درخواست قبلی همخوانی داشته باشد، سرور پروکسی می تواند پاسخ را از حافظه موقت خود بدهد، در غیر این صورت، می تواند پاسخ را از سرور اصلی درخواست کند. این کار باعث می شود که فشار بر روی سرور اصلی کم شود و زمان پاسخگویی به درخواست ها کاهش یابد.
حافظه مرورگر (Cache Browser) چیست؟
یکی از فاکتورهای مهم از نظر کاربر و هم از نظر گوگل سرعت بارگزاری سایت است. افزایش سرعت بارگزاری صفحات سایت به وسیله ذخیره فایل های پر استفاده روی مرورگری که کاربران برای جستجو از آن استفاده می کنند، را حافظه کش مرور یا (Cache Browser) گفته می شود. این تعریف به این معنی است که هر بار مرورگر کروم یا فایرفاکس شما وقتی صفحه ای را لود می کند، تمام فایل های HTML ،CSS ،Javascript موجود در آن صفحه را هم دانلود می کند.
برخی از سایت ها که مقدار این فایل هایشان زیاد است باعث می شوند که سایت دیرتر و با سرعت کمتری بارگزاری شود، استفاده از حافظه مرورگر کش نیز به همین دلیل است. سوال مهم این است که این فایل ها چرا موجب کاهش سرعت سایت می شوند؟ دو جواب کلی برای این مورد وجود دارد:
- برخی از فایل های موجود در سایت برای دانلود شدن نیاز به زمان زیادی دارند و به همین دلیل سرعت اینترنت های کم می تواند روند سرعت کار را کاهش دهد و کاربر زمان زیادی را معطل بماند.
- فایل های موجود در صفحات سایت برای هر دانلود یک درخواست جدا به سرور ارسال می کند که باعث می شود به سرور اصلی فشار وارد شده و سرعت لود شدن سایت کاهش یابد.
زمانی حافظه مرورگر داشته باشید، این فایل ها روی مرورگر کاربر ذخیره می شود و پس از اولین بازدید کاربر از سایت، برخی از موارد فایل های صفحه سایت را در مرورگرشان دارند و همین امر باعث افزایش لود شدن سایت می شود. یکی از دلایل مهم اهمیت حافظه مرورگر کش افزایش رضایت کاربر از سایت است تا برای دفعات بعدی هم به سایت مراجعه کند.
دلیل دوم افزایش امتیاز سایت در سایت های Google Page Speed و GTMetrix است. فعال کردن قابلیت کش در مرورگرها زمانی اتفاق می افتد که یک وب مستر به صورت شخصی شده به مرورگرها اعلام کند که چه فایل هایی و تا چه زمانی باز شوند؟
مراحل فعال کردن Cache Browser
1- تغییر header در کدهای HTTP و تعریف تاریخ انقضا: قدم اول برای تغییر هدر در کدنویسی ها باید از فایل Htaccess که در تمام سرورها موجود و در دسترس است، استفاده کنید. (این فایل در ریشه اصلی هاست وجود دارد و با یک جستجوی ساده در کدهای صفحه می توانید آن را پیدا کنید.) برای تعریف مرورگر کش از یک نرم افزار ویرایشگر متن مثل نوت پد استفاده کنید.
2- سپس برای سایت در فایل Htaccess پارامترهای مختلف سایت را به گونه ای تعریف کنید که مرورگر فایر فاکس یا کروم تشخیص دهد که هر فایل را تا چه مدت در حافظه خودش نگه داری کند. کدهای زیر به شما کمک می کند تا زمان نگه داری و انقضای فایل های عکس با فرمت های مختلف، فایل های PDF، فایل های مربوط به اپلیکیشن و … را چگونه در حافظه کش مرورگر ذخیره کنید.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 |
## EXPIRES CACHING ## Expires Active On ExpiresByType image/jpg “access 1 year” ExpiresByType image/jpeg “access 1 year” ExpiresByType image/gif “access 1 year” ExpiresByType image/png “access 1 year” ExpiresByType text/css “access 1 month” ExpiresByType application/pdf “access 1 month” ExpiresByType text/x-javascript “access 1 month” ExpiresByType application/x-shockwave-flash “access 1 month” ExpiresByType image/x-icon “access 1 year” ExpiresDefault “access 2 days” ##EXPIRES CACHING ## |
3- پس از وارد کردن این کدها آن را در فایل Htaccess ذخیره کنید و سپس از هر مرورگری که استفاده می کنید، refresh کنید.
نکته قابل توجه در اضافه کردن کدها این است که، برای این که مطمئن شوید این کدها را به درستی اضافه و ذخیره کرده اید، وارد سایت Gtmetrix.com شوید و گزینه Leverage Browser را بررسی کنید. در صورتی که این گزینه نمره بالایی گرفته، یعنی کدها به درستی عمل می کند.
Cache-Control چیست؟
Cache Control (کش کنترل) یکی از Header های مختص پروتکل های HTTP است که زمان و نحوه کش شدن را برای یک مرورگر تعیین می کند.
برای مثال سایت شما، یک لوگو یا تصویر منحصر به فرد دارد که زمان لود شدن سایت با کاربر نمایش داده می شود. این لوگو وقتی کاربر برای اولین بار وارد سایت می شود در مقایسه با دفعات بعدی ورود به سایت با سرعت کمتری آپلود می شود. یعنی وقتی مرورگر هدر مختص کش را همراه با فایل می بیند و برای باز شدن لوگو یا تصویر ابتدا باید آن را دانلود کند.
وقتی که این لوگو به Header به حافظه کش مرورگر با یک زمان مشخص اضافه شود، طبق زمانی که در کش مشخص کرده اید (مثلا 10 دقیقه) تا 10 دقیقه دیگر این لوگو در حافظه کش مرورگر ذخیره می شود و تا 10 دقیقه دیگر وقتی کاربر وارد سایت شود، لوگو دوباره نیازی به دانلود شدن ندارد و از حافظه کش نمایش داده می شود. این مسئله باعث افزایش سرعت لود سایت می شود و در بهبود سئوی سایت بسیار موثر است.
مدت زمان ذخیره شدن فایل در کش با قابلیت Max Age
قابلیت Max Age یک خصوصیت در ساختار Cache Control است که با استفاده از آن می توانید زمان کش شدن یک فایل در مرورگر را با واحد ثانیه ذخیره و مشخص کنید. یعنی 2592000 ثانیه معادل یک ماه است. برای مثال مقادیر زیر برای خصوصیت Max Age برای مدت زمان ذخیره شدن قابلیت کش نوشته و تعیین می شود:
- Max age= 60 یک دقیقه
- Max age= 3600 یک ساعت
- Max age= 86400 یک روز
- Max age= 604800 یک هفته
- Max age= 2628000 یک ماه
- Max age= 31536000 یک سال
3 خصوصیت عمده دامنه کش
- Public: از دستور Public زمانی استفاده می شود که فایل ها امنیتی و حساس نیستند و برای بالا بردن سرعت سایت باید از کش استفاده کنید.
- Private: از این خصوصیت زمانی استفاده می شود که می خواهید محتوای بارگزاری شده به شخص کاربر وابسته است و زمانی که کاربر جدید می خواهد وارد شود باید تغییر کاربری بدهد. در این مورد هم خصوصیات و فایل ها امنیتی و حساس نیستند اما فقط مختص یک نفر هستند.
- No store: خصوصیت NO store به نام خصوصیت رسمی نیز شناخته و نامیده می شود. زمانی که از این خصوصیت برای فایل ها استفاده می شود، یعنی فیل های مشخص شده کش نمی شوند. استفاده از این خصوصیت برای فایل ها به این معنی نیست که فایل ها در وضعیت ایمن هستند بلکه به این معنی است که فایل ها فقط کش نمی شوند.
چه فایل هایی را کش کنیم؟
بحث اصلی در Cache Control در اصل از این جا شروع می شود که هر سئوکار باید آن ها را بداند.
- برای مثال فایل تصاویر که دارای فرمت های مختلف png، jpg، gif است. فایل تصاویر معمولا تغییر نمی کند و برای کش شدن بهترین زمان تعیین شده زمان یک سال یا معادل Max Age= 31536000 است.
- مدت زمان کش فایل های CSS: فایل های CSS مربوط به استایل کلی سایت است. در صورتی که مرتبا فایل های CSS سایت را تغییر می دهید بهتر است که مدت زمان یک هفته و حداکثر یک ماه را برای فایل های CSS را تعیین کنید.
- مدت زمان کش فایل های ICO یا فایل Favicon که معمولا تغییری نمی کند، بهتر است که مدت زمان یک سال برای کش انتخاب شود.
خطرات انتخاب اشتباه Browser caching
آن چه در سطر بالا گفته شد مدت زمان تقریبی و منطقی برای تعیین مدت زمان کش فایل های مختلف است. برای مثال در صورتی که برای فایل های Javascript مدت زمان یک سال یا 6 ماه را تعیین کرده باشید و در ماه اول بخواهید فایل ها را تغییر دهید و ویرایش کنید، این تغییرات در حافظه مرورگر کش ذخیره و ثبت نشده و مرورگر باز هم از حافظه مرورگر کش قبلی استفاده می شود.
همچنین فایل های جدیدی که در آن تغییر ایجاد کرده اید روی سرور آپلود نمی شود و تمام فرمت های مربوط به فایل های Javascript بهم می ریزد. خلاصه کلام این است که برای فایل های تعیین شده برای کش زمان زیاد و طولانی انتخاب نکنید.
استفاده از Cache Control در وب سرورهای مختلف
در این جا صحبت از این است که برای هر نوع فایل از کش منحصر به فرد استفاده کنیم. برای مثال اگر وب سرور شما apache (آپاچی) است، بهتر است که از طریق http.cont برای انتخاب و ویرایش کش استفاده کنید، چون سرعت بهتری دارد. برای این کار لازم است که فایل http.cont را جستجو کنید و کدهای زیر را درون آن قرار دهید:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
# One year for image files # <filesMatch ".(jpg|jpeg|png|gif|ico)$"> Public 31536000 Header set Cache-Control "max-age= </filesMatch> # One month for css and js <filesMatch ".(css|js)$"> , public 2628000 " Header set Cache-Control "max-age= </filesMatch> |
در صورتی که سرور شما NGINX است، باید از نوع ساختار زیر استفاده کنید:
|
1 2 3 4 5 |
location ~* \.(jpg|jpeg|png|gif|ico|css|js)$ { expires 365d; { |
در خط دوم Expires به معنی این است که کش تا 365 روز دیگر منقضی می شود و اعتبار ندارد.
سخن پایانی
به عنوان سخن پایانی، مقاله حاضر به بررسی مفهوم Cache Control و اهمیت آن در بهبود عملکرد وب سایت ها پرداخته است. کنترل کش یک روش است که با استفاده از آن می توان محتوای وب را در حافظه موقت مرورگر یا سرور ذخیره کرد تا در دفعات بعدی درخواست، سرعت بارگذاری صفحات افزایش یابد و منابع شبکه صرفه جویی شود. کنترل کش با استفاده از سرآیندهای HTTP مانند Cache-Control، Expires، ETag و Last-Modified انجام می شود.
در این مقاله، نحوه تنظیم این سرآیندها و تاثیر آن ها بر روی نحوه کش شدن محتوا توضیح داده شده است. همچنین، برخی از روش های پیشرفته تر برای کنترل کش مانند Service Worker و Cache API معرفی شده اند. این روش ها به توسعه دهندگان امکان می دهند تا با استفاده از جاوااسکریپت، رفتار کش را به صورت دقیق تعیین کنند و حتی در شرایط آفلاین نیز صفحات وب را نمایش دهند.
Cache Control یکی از مولفه های مهم برای بهینه سازی عملکرد وب سایت ها است. با استفاده از روش های مناسب برای کش شدن محتوا، می توان زمان پاسخگویی، تعداد درخواست ها و حجم داده های منتقل شده را کاهش داد و تجربه کاربر را بهبود بخشید. لذا، توصیه می شود که توسعه دهندگان وب با اصول و روش های کنترل کش آشنا شوند و آن را به درستی در پروژه های خود پیاده سازی کنند.
