کیوان صفری
کیوان صفری
خواندن ۴ دقیقه·۲ سال پیش

بهینه سازی فایل css JS در افزونه Wp Rocket

افزونه wp rocketیکی از افزونه های بهینه سازی است که با بهبود کدها در بخش فرانت قالب های وردپرسی باعث بهبود سرعت سایت شما می شود. با انجام تنظیمات این افزونه می توانید سرعت سایت تان را به میزان قابل توجهی افزایش دهید. امکانات این افزونه برای بهینه سازی سایت وردپرس را در ادامه آورده ایم و به طور خاص می خواهیم به بهینه سازی فایل css JS در افزونه راکت (https://wp-rocket.me/) بپردازیم.

امکان فعالسازی کش

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

  • کش فایل های CSS
  • کش فایل های JS
  • تعیین زمان عمر کش
  • کش صفحات برای کاربران لاگین شده

بهینه سازی تصاویر

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

از دیگر ویژگی ها و امکانات این افزونه می توان به موارد زیر اشاره کرد:

  • انجام تنظیمات lazy load
  • بهینه سازی پایگاه داده و حذف داده های زائد و بی اهمیت مانند پیش نویس پست ها و دیدگاه های اسپم
  • بهینه سازی Heartbeat در وردپرس
  • رابط آسان
  • امکان فشرده سازی gzip
  • سازگاری با افزونه های edd و ووکامرس
  • تنظیمات پیش بارگذاری مانند پیش بارگذاری لینک ها

بهینه سازی فایل های css و JS

راکت با بهینه سازی فایل های CSS و JS، فشرده سازی آنها و ادغام و ترکیب شان تاثیر بسیاری در افزایش سرعت سایت دارد. افزونه راکت با اقدامات زیر فایل های شما را بهینه می کند.

  • حذف کامنت ها و فضای خالی فایل های css و JS که به آن فشرده سازی یا minify (مینیفای کردن) می گویند.
  • ترکیب فایل های css و جاوا اسکریپت درون یک فایل که به آن ادغام یا combine می گویند.
  • بهینه سازی فایل های CSS
  • تاخیر بارگذاری فایل های جاوا اسکریپت که کمک می کند مشکل render blocking در سایت شما حل شود.
  • تاخیر در اجرای فایل های JS

بعد از نصب افزونه راکت از پیشخوان وردپرس > تنظیمات > Wp rocket می توانید به تظنیمات افزونه دسترسی داشته باشید. با کلیک روی آن تنظیمات افزونه راکت برای شما باز شود در این مطلب می خواهیم به بخش بهینه سازی فایل بپردازیم. برای بهینه سازی فایل ها سربرگ بهینه سازی فایل را زده تا تنظیمات آن مطابق تصویر به شما نمایش داده شود. بخش ابتدایی برای تنظیمات فایل های css است و تنظیمات بخش بعدی فایل های جاوا اسکریپت را بهینه سازی می کند.

1- فشرده سازی فایل های css در افزونه راکت

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



ادغام فایل های css

این بخش فایل های css را درون یک فایل با هم ترکیب می کند که باعث می شود درخواست های سمت سرور کاهش پیدا کند و به آن ادغام یا combine می گویند. ترکیب فایل های css باعث افزایش سرعت سایت می شود.

با فعال کردن این گزینه بخشی برای شما فعال می شود که مانع از ادغام بعضی از فایل ها توسط شما می شود. بهتر است آدرس فایل های موردنظر را اینجا وارد کنید چون ادغام بعضی از فایل ها باعث به هم ریختگی سایت شما می می شود.

بهینه سازی تحویل css

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

2- بهینه سازی فایل های جاوا اسکریپت

بخش بعدی بهینه سازی فایل js یا جاوا اسکریپت است که همه آنها مشابه با بهینه سازی فایل های css هستند بخش هایی مثل:

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


در این مقاله به بهینه سازی فایل های css و JS در راکت و چگونگی تاثیر آنها بر افزایش سرعت پرداختیم. با تهیه افزونه wp rocket امتیاز سرعت خود را در سایت جی تی متریکس بهبود بدهید.


افزونه راکتوردپرسافزونه وردپرسبهینه سازی سایتافزایش سرعت سایت
شاید از این پست‌ها خوشتان بیاید