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

سرفصل‌ها

  • ۱ آموزش افزایش سرعت سایت با GTmetrix
  • ۲ خلاصه‌ی از خطا Enable gzip compression
  • ۳ فشرده سازی Gzip در افزایش سرعت سایت
  • ۴ Gzip چیست؟
  • ۵ نحوه کار فشرده سازی Gzip در عمل
  • ۶ چگونه GZIP Compression را چک کنیم فعال است؟
  • ۷ نحوه فعال سازی GZIP Compression
    • ۷٫۱ فعال سازی gzip در وردپرس
    • ۷٫۲ فعال سازی gzip در جوملا
    • ۷٫۳ فعال کردن فشرده سازی gzip در cPanel
    • ۷٫۴ فعال سازی gzip در سرور آپاچی
    • ۷٫۵ فعال سازی gzip در وب سرور NGINX
    • ۷٫۶ فعال سازی gzip در IIS ویندوز سرور

آموزش افزایش سرعت سایت با GTmetrix

سلام، از سری دوره‌های آموزش کار با GTmetrix در خدمت شما هستیم. قصد داریم در این دوره، سایتی بهینه توسط ابزارهای آنلاین مثل جی تی متریکس ایجاد کنیم. در جلسه قبل درباره رفع ارور Defer parsing of JavaScript صحبت کردیم. در این جلسه قصد داریم درباره مشکل Enable gzip compression در PageSpeed گوگل و همینطور ارور Compress components with gzip در YSlow یاهو صحبت کنیم و اول gzip را تعریف خواهیم کرد و اینکه gzip چیست و چه تاثیری در سرعت سایت دارد، می‌پردازیم و بعد طبق سرفصل‌های بالا جلو میریم.

فقط توجه داشته باشید هر دو خطای Enable gzip compression و Compress components with gzip یک منظور را می‌رساند فقط خطای اولی مربوط به گوگل است و دومی مربوط به یاهو می‌باشد، حل یکی از این خطاها باعث حل دیگر خطا هم می‌شود.

خلاصه‌ی از خطا Enable gzip compression

نام: Enable gzip compression
نوع: مربوط به سرور
اولویت: بالا
میزان سختی: راحت
میانگین امتیاز: ۸۲%

فشرده سازی Gzip در افزایش سرعت سایت

اگر صاحب سایتی باشید قطعا افزایش سرعت لود سایت برای شما اهمیت فراوانی خواهد داشت و اینکه چه مدت زمانی بارگذاری صفحات سایت شما به طول می‌انجامد جزو فاکتورهای مهم یک مدیر سایت برای بهبود صفحاتش است. پس حتماً اطلاع دارید که بالا بودن سرعت سایت چه میزان در نرخ دفع کاربری (Bounce rate چیست)، تجربه کاربری (User Experience) و همین‌طور در رتبه دهی موتورهای جستجو که یکی از عوامل مهم است، تاثیر دارد.

افزایش سرعت سایت با فعال سازی GZIP

از انجایی که از ملاک‌های اساسی گوگل برای رتبه بندی سرعت لودینگ صفحات می‌باشد بالا بردن سرعت سایت‌ها، از دغدغه‌های اصلی وبستران بوده و هست. همچنین تجربه نشان می‌دهد که کاربران صفحاتی را که بالای ۱۰ ثانیه برای باز شدنشان به طول می‌انجامد را بسته و به سراغ سایت دیگری می‌روند و این یعنی بالا رفتن Bounce rate. حال یکی از اقداماتی که می‌توان در راستای افزایش سرعت سایت تاثیر فراوانی دارد فعال سازی Gzip در سمت سرور می‌باشد و باعث رفع ارور Enable gzip compression و همچنین بهبود TTFB نیز می‌شود. حتما مقاله جالب درباره بهینه سازی زمان TTFB را بخوانید.

تمام مرورگرهای مدرن و مرسوم امروزی از تابع gzip پشتیبانی می‌کنند و هم به شکل اتوماتیک درخواست HTTP به سمت سرور برای GZIP compression ارسال می‌کنند. در ادامه به همراه عکس بیشتر به این موضوع تمرکز می‌کنیم. لیست مرورگرهای معروف که از این تابع پشتیبانی می‌کنند:

  • Internet Explorer 5.5 در + July 2000 از فشرده سازی gzip پشتیبانی می‌کرد
  • Opera 5+ در  June 2000 از فشرده سازی gzip پشتیبانی می‌کرد
  • Firefox 0.9.5+ در  October 2001 از فشرده سازی gzip پشتیبانی می‌کرد
  • Chrome به محض انتشار در سال ۲۰۰۸ از فشرده سازی gzip پشتیبانی می‌کرد
  • Safari به محض انتشار در سال ۲۰۰۳ از فشرده سازی gzip پشتیبانی می‌کرد

Gzip چیست؟

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

فایل‌های با حجم کمتر به بازدیدکنندگان شما اجازه می‌دهد تا فایل‌های سایت را سریع‌تر دریافت کنند و در نتیجه سایت شما را سریع‌تر مشاهده کنند. البته باید اشاره کنیم که تابع Gzip هر فایلی در سمت سرور را فشرده سازی نمی‌کند، فشرده سازی صرفا منوط به فایل‌های HTML ، فایل‌های استایل‌دهی (stylesheets) و جاوااسکریپت (JavaScript) می‌باشد و شامل تصاویر و بقیه فایل‌های موجود دیگر نیست.

Gzip باعث کاهش حجم سایت و افزایش سرعت لود سایت می‌شود، در واقع این تابع می‌تواند حجم فایل‌های ذکر شده را بیش از ۷۰ درصد کاهش بدهد. این تابع دو مولفه اصلی را در سایت GTmetrix کاهش می‌دهد یکی Page Load Time و دیگری Total Page Size می‌باشد.

Ilya Grigorik در گوگل می‌گوید:

فشرده سازی یک فرایند رمزگذاری اطلاعات با استفاده از بیت‌های (bits) کمتر است.

نحوه کار فشرده سازی Gzip در عمل

بعد از آنکه متوجه شدید gzip چیست به نحوه کارکرد این تابع میپردازیم،‌وقتی کاربری توسط مرورگر خود قصد دارد وارد یک سایتی شود، مرورگر اول یک درخواست از سمت header یعنی “content-encoding: gzip” ارسال می‌کند تا ببیند آیا جواب این درخواست مثبت است یا منفی. اگر درخواست از سمت سرور شناسایی شد و مثبت بود، سرور فایل‌های فشرده شده را به مرورگر ارسال می‌کند، درغیر این صورت سرور فایل‌های غیر فشرده و سنگین را به مرورگر ارسال می‌کند که در بیشتر وقت‌ها همراه با ارورهای مختلف همراه خواهد بود.

فرق سایت فشرده شده با فشرده نشده

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

ولی موتورهای جستجو همانند گوگل و مرورگرها همانند کروم و فایرفاکس، نیازی به کدنویسی زیبا و فضای خالی بین کدها ندارند، و به راحتی می‌توانند آنها را تجزیه و همه آنها در یک بلوک یا خط بخوانند، برای همین در بهینه سازی سایت فایل‌ها پیشنهاد می‌شود که آنها را minify  و combine کنید. و جدا از رفع خیلی از خطاها باعث برطرف شدن مشکل Enable gzip compression می‌شود.

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

در برنامه نویسی و طراحی وب تعداد زیادی الگو و عناصر تکرار می‌شود مثلا یک قطعه کد شبیه زیر است:

SSS pppp eeeee eeeeee ddddddd

کدهای بالا ۲۵ کاراکتر است

با سیستم  Gzip به راحتی کدهای بالا به کد زیر تبدیل می‌شود:

۳S 4p 5e 6e 7d

کدهای فشرده شده ۱۰ کاراکتر است

۱۵ کاراکتر در همین مثال کمتر شده است حال اگر هزاران کد فشرده شوند قطعا تاثیر بسیاری در کاهش حجم فایل‌های سایت خواهد داشت. هر چند ما برای درک بهتر مثال ساده‌ای از فشرده سازی زدیم اما فعالیت فشرده سازی gzip در پشت پرده بسیار پیچیده‌ و عمق‌تر است.

چگونه GZIP Compression را چک کنیم فعال است؟

جهت تست فشرده سازی gzip می‌توانید از ابزارهای آنلاین زیر استفاده نمایید:

  • استفاده از Google PageSpeed Insights گوگل
    می‌توانید سایت خود را در Page Speed گوگل تست کنید و اگر gzip فعال نباشد پیغامی همانند زیر دریافت می‌کنید.

خطای فعال نبودن تابع gzip

  • استفاده از سایت GTmetrix
    می‌توانید در سایت جی تی متریکس نیز تست کنید و اگر با ارور Enable gzip compression مواجه شدید مبنی بر این است که تابع Gzip نیز در سمت سرور شما فعال نیست.

ارور enable gzip compression

  • استفاده از سایت Check GZIP compression tool
    سایت ذکر شده هم می‌تواند بسیار مفید باشید و دقیقا به شما می‌گوید چه میزان از حجم سایت شما بعد از فعال سازی تابع gzip فشرده شده است.

چک کردن gzip compression

  • استفاده از مرورگر خود
    شما به راحتی تمام می‌توانید با استفاده از مرورگر خود از فعال بوندن Gzip در سرور مطمئن شوید و حتی به مقایسه تک تک فایل‌ها قبل و بعد از فشرده سازی پردازید، ما در اینجا از کروم گوگل استفاده می‌کنیم ولی شما می‌توانید از بقیه مرورگرها هم استفاده کنید چون نحوه کار اکثر آنها یکسان است. ابتدا سایت را باز کنید و بعد از کلیک راست  کردن گزینه Inspect را انتخاب کنید و وارد سربرگ Network شده و دوباره سایت را رفرش کنید تا این اطلاعات این سربرگ نمایان شود.

وجود content-encoding: gzip نشان دهنده فعال بودن این تابع است

برای مقایسه فایل قبل و بعد از فشرده سازی طبق عکس زیر روی ایکون اشاره شده کلیک کنید و در ستون size میتوانید به مقایسه فایل‌ها بپردازید.

مقایسه حجم فایل فشرده شده با فشرده نشده

AddOutputFilterByType DEFLATE image/svg+xml

AddOutputFilterByType DEFLATE image/x-icon

AddOutputFilterByType DEFLATE text/html

AddOutputFilterByType DEFLATE text/css

AddOutputFilterByType DEFLATE text/plain

AddOutputFilterByType DEFLATE text/javascript

AddOutputFilterByType DEFLATE text/xml

BrowserMatch ^Mozilla/4 gzip-only-text/html

# Removing browser bugs for older browsers

BrowserMatch ^Mozilla/4\.0[678] no-gzip

</IfModule>

BrowserMatch \bMSIE !no-gzip !gzip-only-text/html

Header append Vary User-Agent

  • فعال سازی gzip در وب سرور NGINX

    اگر وب سرور شما NGINX یا به عبارتی انجین ایکس باشد می‌توانید از دستورات این مقاله برای فعال سازی تابع gzip استفاده کنید، باید وارد دایرکتوری /etc/nginx/nginx.conf شده و یک سری تغییرات ساده و جزئی را ایجاد نمایید.

  • فعال سازی gzip در IIS ویندوز سرور

ممکن است سایت شما در ویندوز سرور های شرکت مایکروسافت میزبانی شود که روند فعال سازی تابع gzip کمی متفاوت خواهد بود، ابتدا باید بدانید که جهت فشرده سازی یا compression داخل ویندوز سرور باید ۴ مرحله را طی کنید، که ۳ مرحله اول همانند هم هستند، باید در ابتدا مطمئن باشید که ادمین سرور در زمان نصب ویندوز سرور در server manager و تب Role Services بخش Web Server رفته و در ادامه وارد Performance شده و گزینه‌های Static Content Compression و Dynamic Content Compression را تیک زده باشد.

بعد از اینکه مطمئن شدید این گزینه توسط ادمین سرور فعال است (جهت اطمینان می‌توانید تیکت ارسال کنید) باید وارد IIS سرور خود شده در قسمت Compression دوباره ۲ گزینه که در بالا اشاره شده است را فعال کنید.

بعد از آن سایت خود را در کنترل پنلی که دارید، مثلا همانند SolidCP انتخاب کرده و بسته به کنترل پنل باید دنبال گزینه های Enable Static Content Compression و همینطور Enable Dynamic Content Compression باشد و سپس فعال کنید.

و سپس کدهای زیر را در Web.Config اضافه کنید:

<system.webServer>

<httpCompression directory=”%SystemDrive%\inetpub\temp\IIS Temporary Compressed Files”>

<scheme name=”gzip” dll=”%Windir%\system32\inetsrv\gzip.dll” staticCompressionLevel=”9″ />

<dynamicTypes>

<add mimeType=”text/*” enabled=”true” />

<add mimeType=”application/x-javascript” enabled=”true” />

<add mimeType=”message/*” enabled=”true” />

<add mimeType=”application/json” enabled=”true” />

<add mimeType=”application/javascript” enabled=”true” />

<add mimeType=”application/atom+xml” enabled=”true” />

<add mimeType=”application/json; charset=utf-8″ enabled=”true” />

<add mimeType=”application/xaml+xml” enabled=”true” />

<add mimeType=”message/*” enabled=”true” />

<add mimeType=”*/*” enabled=”false” />

</dynamicTypes>

<staticTypes>

<add mimeType=”text/*” enabled=”true” />

<add mimeType=”application/json” enabled=”true” />

<add mimeType=”application/x-javascript” enabled=”true” />

<add mimeType=”application/javascript” enabled=”true” />

<add mimeType=”application/xaml+xml” enabled=”true” />

<add mimeType=”application/json; charset=utf-8″ enabled=”true” />

<add mimeType=”application/atom+xml” enabled=”true” />

</system.webServer>

<add mimeType=”*/*” enabled=”false” />

</staticTypes>

</httpCompression>

<urlCompression doStaticCompression=”true” doDynamicCompression=”true” />

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

اگر به دنبال مقاله‌های مناسب جهت بهینه سازی سرعت سایت خود در windows server هستید مقاله سایت tosinso هم می‌تواند برای شما مفید باشد و همینطور مستندات شرکت مایکروسافت نظیر HTTP Compression of Dynamic Content و HTTP Compression of Static Content  پیشنهاد می‌شود مطالعه شود.

اگر شما به دقت این مقاله را مطالعه کرده باشید باید بدانید جی زیپ چیست و چگونه یک فایل را فشرده سازی می‌کند و همینطور با نحوه فعال سازی آن آشنایی کامل پیدا کردید. فعال سازی gzip کمک زیادی به بهینه سازی داخلی خواهد کرد پس سعی کنید به بهترین شکل ممکن این مشکل را حل کنید تا باعث کاهش سرعت سایت شما نشود، اگر سوالی داشتید حتما در قسمت نظرات مطرح کنید. این جلسه از آموزش GTmetrix هم به پایان رسید در جلسه بعد به معرفی خطای Enable Keep-Alive در pagespeed  گوگل میپردازیم. با ما همراه باشید.

منبع: میزفا

جهت کسب اطلاعات و مشاهده مقالات بیشتر به بخش مقالات آموزشی مراجعه نمایید.

0 پاسخ

دیدگاه خود را ثبت کنید

تمایل دارید در گفتگوها شرکت کنید؟
در گفتگو ها شرکت کنید.

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

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