خطای Minify css و Minify Html و Minify JS در جی تی متریکس چه میگوید؟

جی تی متریکس دوست داشتنی میگه Minify کن. اون دسته از عزیزانی که با جی تی متریکس آشنایی کامل ندارند در این مقاله توضیح کامل دادیم. GTmetrix چیست؟ هر سه خطای Minify css و Minify Html و Minify JS یه هدف دارن. قبل از هر چیز بگم من از این کلمه Minify خیلی خوشم میاد، آوای زیبایی داره 🙂 عبارت Minify در روند بهینه‌سازی‌سایت به معنای طراحی سایت با فایل‌های حجم پایین است.

منظور جی تی متریکس از خطای Minify css و Minify Html و Minify JS چیه؟

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

یک مثال از کدهای CSS:

کد بالا رو نگاه کنین برای زیبانویسی و درک بهتر کدنویسی از فضاهای خالی استفاده شده، اما این فضاها تاثیر مثبتی برای موتورهای جستجو و مرورگرها ندارن. Minify شده این فایل CSS بصورت زیره:

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

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

تشخیص خطاهای Minify css و Minify Html و Minify JS :

پیدا کردن ارور  JS و HTML و  Minify CSS نیز به سادگی هر چه تمامتره، شما کافیه به یکی از ابزارهای تست سرعت سایت همانند Gtmetrix مراجعه کنین و اگه خطای Minify CSS همانند شکل بالا رو مشاهده کردین ادامه مطلب ما رو بخونین.

ابزارهای Minify :

ابزارهایی برای Minify کردن کدها وجود دارن که با اینکار ما فقط کدها رو در خروجی Minify میکنیم و فاصله ها و کامنتها رو برمیداریم. اما در Source  به همون شکل باقی میمونه. همچنین یکسری پلاگینها برای این کار موجوده. ما تمام ابزارها و پلاگینها رو تست کردیم و در دوره ۸ ساعت افزایش سرعت سایت با استفاده از GTmetrix براتون توضیح دادیم.

امیدوارم که این مطلب براتون مفید بوده منتظر نظرات و پیشنهاداتتون هستیم.