بهینه سازی و افزایش سرعت لود سایت توسط Gzip

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

بهینه سازی و افزایش سرعت لود سایت

یکی از اصول مهم در سئو سایت همین مسئله افزایش سرعت لود سایت هستش و گوگل روی این مسئله بسیار اهمیت میده.پس بهتر هستش در مرحله اول سایت خودتون رو در مسئله سرعت لود بهینه سازی کنید.

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

شیوه کار GZIP

شاید خیلی‌ها هنوز ندانند که شیوه عمل ترفند GZIP و نحوه فشرده کردن صفحه به چه صورت انجام می‌شود. قبل از آنکه به سراغ معرفی این روش بپردازیم اجازه دهید تا با بیان یک مثال تصویری، نحوه انجام این کار را عنوان کنیم. هنگامی که فایل صفحه ای مانند http://www.7learn.com/index.php را از مرورگر درخواست می کنید، اطلاعاتی بین مرورگر و سایت مورد نظر رد و بدل می‌شود که به طور مختصر شبیه به تصویر بالا است:

۱. مرورگر: سلام! لطفا فایل index.php را به من بده
۲. سرور: خوب! اجازه بده تا فایل مورد نظر را پیدا کنم
۳. سرور: پیدا کردم! این کد پاسخ شماست (۱۰۰کیلوبایت ها!!!! OK). من فایل را برایتان می‌فرستم
۴. مرورگر: ۱۰۰ کیلوبایت؟!!! اوه چقدر زیاد! انتظار… انتظار… بسیار خوب، بارگزاری شد

این یک مکالمه بسیار ساده (و نه کامل) از آن چیزی است که هنگام درخواست مشاهده صفحه از سوی مرورگر شما با سرور سایت انجام می‌گیرد.

کجای کار مشکل دارد؟

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

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

۱٫ مرورگر: سلام! می‌توانم index.php را دریافت کنم؟ اگر نسخه فشرده دارید لطفا آن‌را به من بدهید.
۲. سرور: اجازه بدهید فایل را پیدا کنم. بله، همین‌جاست! نسخه فشرده می‌خواهید؟ عالی است.
۳. سرور: من index.php را پیدا کردم (۱۰۰کیلوبایت ها!!!! OK).اما نگران نباش  فایل را فشرده و برای‌تان ارسال می‌کنم.
۴. مرورگر: فوق‌العاده است. فقط ۱۰ کیلوبایت! آن‌را از حالت فشرده خارج و به کاربر نمایش خواهم داد.

در واقع هنگامی که مرورگر به سرور سایت مراجعه می‌کند، با ارسال پیامی، از سرور درخواست ارسال فایل فشرده را می‌کند. اگر این پیام از سوی سرور پاسخ داده شد (به عبارتی دیگر، اگر سایت مورد نظر از قابلیت gzip یا deflate استفاده کند)، فایل مورد نظر برای مرورگر ارسال خواهد شد. در غیر این‌صورت، همان روال عادی بارگزاری صفحه طی می‌شود.

به‌طور ساده برای فشرده کردن فایل‌های متنی خود می‌توانید از ماژول deflate آپاچی استفاده کنید. برای این کار کافی است کدهای زیر را در فایل .htaccess سایت خود کپی نمایید

<ifModule mod_deflate.c="mod_deflate.c">
 <filesMatch "\.(css|js|html|php)$"=""\.(css|js|html|php)$"">
 SetOutputFilter DEFLATE
 </filesMatch>
 </ifModule>

این کد، فایل‌های CSS، JS، HTML، XHTML و PHP سایت شما را gzip می‌کند.

کد زیر نیز یک نمونه بسیار خوب برای فشرده سازی فایل‌های مورد اشاره روی سایت شما و نیز Cache کردن دیگر فایل‌های استاتیک است.

# BEGIN Compress text files
<ifModule mod_deflate.c="mod_deflate.c">
<filesMatch "\.(css|js|x?html?|php)$"=""\.(css|js|x?html?|php)$"">
SetOutputFilter DEFLATE
</filesMatch>
</ifModule>
 
# END Compress text files
# BEGIN Expire headers
<ifModule mod_expires.c="mod_expires.c">
ExpiresActive On
ExpiresDefault "access plus 1 seconds"
ExpiresByType image/x-icon "access plus 2592000 seconds"
ExpiresByType image/jpeg "access plus 2592000 seconds"
ExpiresByType image/png "access plus 2592000 seconds"
ExpiresByType image/gif "access plus 2592000 seconds"
ExpiresByType application/x-shockwave-flash "access plus 2592000 seconds"
ExpiresByType text/css "access plus 604800 seconds"
ExpiresByType text/javascript "access plus 216000 seconds"
ExpiresByType application/javascript "access plus 216000 seconds"
ExpiresByType application/x-javascript "access plus 216000 seconds"
ExpiresByType text/html "access plus 600 seconds"
ExpiresByType application/xhtml+xml "access plus 600 seconds"
</ifModule>
 
# END Expire headers
# BEGIN Cache-Control Headers
<ifModule mod_headers.c="mod_headers.c">
<filesMatch "\.(ico|jpe?g|png|gif|swf)$"=""\.(ico|jpe?g|png|gif|swf)$"">
Header set Cache-Control "max-age=2592000, public"
</filesMatch>
 
<filesMatch "\.(css)$"=""\.(css)$"">
Header set Cache-Control "max-age=604800, public"
</filesMatch>
 
<filesMatch "\.(js)$"=""\.(js)$"">
Header set Cache-Control "max-age=216000, private"
</filesMatch>
<filesMatch "\.(x?html?|php)$"=""\.(x?html?|php)$"">
Header set Cache-Control "max-age=600, private, must-revalidate"
</filesMatch>
</ifModule>
 
# END Cache-Control Headers
# BEGIN Turn ETags Off
<ifModule mod_headers.c="mod_headers.c">
Header unset ETag
</ifModule>
FileETag None
 
# END Turn ETags Off
<ifModule mod_headers.c="mod_headers.c">
Header set Connection keep-alive
</ifModule>
 
<IfModule mod_headers.c="mod_headers.c">
<FilesMatch "\.(js|css|xml|gz)$"=""\.(js|css|xml|gz)$"">
Header append Vary: Accept-Encoding
</FilesMatch>
</IfModule>
 
# BEGIN Remove Last-Modified Header
<ifModule mod_headers.c="mod_headers.c">
Header unset Last-Modified
</ifModule>
 
# END Remove Last-Modified Header

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

همانطور که در تصویر می بینید حجم واقعی صفحه ۹۴۳۲۸ بایت هستش که بعد از فشرده سازی به ۱۸۰۹۵ کاهش پیدا کرده یعنی چیزی حدود ۸۰ درصد کاهش حجم… خیلی جالبه نه؟ حالا با محاسبات زیر جالب تر هم میشه:

حالا من می خواهم سرعت لود شدن وب سایت ۷learn رو قبل و بعد از فشرده سازی براتون محاسبه کنم تا بیشتر فواید gzip رو درک کنید.

ابتدا فرض میکنیم که کاربر ما توسط سرویسی با سرعت (۵۶kbps) به اینترنت متصل است:

تبدیل حجم واقعی صفحه به کیلو بایت:

۹۴۳۲۸/۱۰۲۴=۹۲kbytes

تبدیل حجم بعد از فشرده سازی به کیلو بایت:

۱۸۰۹۵/۱۰۲۴=۱۷kbytes

حالا خودتون قضاوت کنید سرعت کدام حالت وب سایت برای لود شدن بیشتره؟ آیا تمام کاربرانتون از اینترنت پر سرعت استفاده می کنند؟ قطعا پاسخ شما منفی هستش  …

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

موفق باشید