راهنمای جامع افزایش سرعت سایت در سال 2026

افزایش سرعت سایت مهم‌ترین معیاری است که در سال 2026 مستقیماً روی سئو، میزان فروش و رتبه شما در گوگل تاثیر می‌گذارد. طبق گزارش رسمی گوگل، 34% کاربران بیش از 3 ثانیه برای لود شدن سایت صبر نمیکنند و سراغ سایت دیگری میروند بنابراین اگر سرعت سایت شما کند است بخش زیادی از ورودی های گوگل را از دست میدهید و عملا 34 درصد از مشتریان و مخاطبان را به رقبا واگذار میکنید.

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

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

 

مهم‌ترین ابزار سنجش سرعت سایت چیست؟

قبل از اینکه درباره افزایش سرعت سایت صحبت کنیم، اول باید بدانیم از کجا بفهمیم سرعت سایت ما خوب است یا بد؟

خیلی از مدیران سایت فقط بر اساس حس خودشان قضاوت می‌کنند. می‌گویند «سایت من سریع باز می‌شود، پس مشکلی ندارد.» اما سرعت سایت با احساس شخصی سنجیده نمی‌شود؛ سرعت سایت باید با ابزار دقیق اندازه‌گیری شود. ابزارهای مختلفی برای تست سرعت سایت وجود دارد، مثل:

1 – Google PageSpeed Insights

2 – GTmetrix

3 – WebPageTest

4 – Lighthouse

5 – و …

اینها از معروف ترین ابزارهای تست سرعت سایت هستند و البته ابزارهای دیگری هم وجود دارند که گزارهای فنی خوبی ارائه میدهند و برای بررسی جزئیان مفید هستد اما ابزار اصلی و معیار رسمی گوگل برای سنجش سرعت سایت، Google PageSpeed Insights است. و ما هم سرعت و پرفورمنس سایت را بر اساس معیارهای همین ابزار اندازه میگیریم.

چرا پیج اسپید گوگل مهم ترین ابزار تست سرعت سایت است؟

چون:

• متعلق به خود گوگل است
• دقیقاً بر اساس الگوریتم‌های رتبه‌بندی گوگل طراحی شده
• معیارهای تأثیرگذار در سئو را اندازه‌گیری می‌کند
• همان داده‌هایی را بررسی می‌کند که روی رتبه شما اثر دارند

اگر بخواهیم خیلی ساده بگوییم: وقتی صحبت از افزایش سرعت سایت می‌کنیم، در تست ابزار پیج اسپید گوگل مهم‌ترین عددی که باید به آن توجه کنید، امتیاز Performance و همچنین پاس شدن core web vitals است.

چطور با PageSpeed سرعت سایت را تست کنیم؟

ویدیو زیر تست سرعت سایت وبسافت3 در ابزار پیج اسپید گوگل را بصورت خلاصه نشان میدهد که core web vitals آن سبز و پاس شده است و همچنین عدد پرفورمنس آن 99 است که این یک نتیجه ایده آل از نظر گوگل است. در ادامه مراحل انجام تست را با جزئیات بیشتری را توضیح میدهیم :

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

1. با فیلترشکن وارد سایت pagespeed.web.dev شوید.
2. آدرس کامل سایت خود را وارد کنید.
3. روی دکمه Analyze کلیک کنید.
4. حدود 30 تا 60 ثانیه صبر کنید تا گزارش آماده شود.

بعد از تحلیل، به دوتا مورد اصلی باید توجه کنید، 1 – سبز بودن core web vitals و 2 – عدد Performance

مهم : آموزش ویدیویی کار با ابزار پیج اسپید گوگل را در صفحه آموزش ابزار PageSpeed Insight مشاهده کنید

Core Web Vitals

معیار مهمی است که نشان می‌دهد تجربه واقعی کاربران هنگام استفاده از سایت شما چگونه است. در این بخش معمولاً سه معیار اصلی بررسی می‌شود:

1- سرعت نمایش محتوای اصلی صفحه

2- سرعت واکنش سایت بعد از اولین کلیک کاربر

3- میزان جابه‌جایی ناگهانی عناصر صفحه

اگر این بخش سبز باشد یعنی از نظر تجربه کاربری وضعیت خوبی دارید. اگر زرد یا قرمز باشد یعنی کاربران هنگام کار با سایت شما دچار مشکل می‌شوند و این موضوع مستقیماً روی رتبه گوگل تأثیر می‌گذارد.

به زبان ساده: Core Web Vitals یعنی اینکه سایت شما برای کاربر واقعاً راحت و سریع هست یا نه.

Performance

یک عدد بین 0 تا 100 به شما نمایش داده می‌شود. این عدد نشان می‌دهد وضعیت کلی سرعت سایت شما چگونه است. به طور کلی:

🟢 امتیاز بالای 90 → وضعیت عالی
🟡 امتیاز بین 80 تا 90 → قابل قبول اما نیازمند بهبود
🟠 امتیاز کمتر از 80 → سایت شما مشکل جدی سرعت دارد

نکته مهم دیگر این است که PageSpeed دو گزارش جداگانه به شما می‌دهد:

1 – گزارش موبایل 2 – گزارش دسکتاپ

از نظر گوگل، امتیاز موبایل مهم‌تر است. چون بیشتر کاربران با موبایل وارد سایت می‌شوند و گوگل نیز نسخه موبایل سایت را مبنای ایندکس و رتبه‌بندی قرار می‌دهد بنابراین شما هم باید توجه ویژه ای روی افزایش سرعت سایت در موبایل داشته باشید در ادامه به این موضوع میپردازیم که چرا امتیاز پرفورمنس شما در pagespeed پایین است و دلایل اصلی کند بودن سایت را بررسی میکنیم.

8 دلیل اصلی کند بودن سایت و کاهش پرفورمنس + راهکار افزایش سرعت سایت

---

 

1️⃣ هاست ضعیف یا سرور کند (مهم‌ترین دلیل کند بودن سایت)

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

چرا؟

چون قبل از اینکه اصلاً صفحه برای کاربر باز شود، مرورگر باید به سرور شما درخواست بفرستد و اولین پاسخ را دریافت کند. اگر سرور دیر پاسخ بدهد، همه چیز با تأخیر شروع می‌شود. به این تأخیر اولیه می‌گویند زمان پاسخ اولیه سرور یا همان TTFB. اگر این عدد بالا باشد، امتیاز PageSpeed شما به شدت افت می‌کند.

مهم : ویدیو آموزش این بخش را در صفحه تاثیر هاست بر سرعت سایت مشاهده کنید

یک مثال ساده و واقعی

فرض کنید دو سایت کاملاً مشابه داریم:

• هر دو یک قالب دارند
• هر دو تصاویر یکسان دارند
• هر دو افزونه‌های مشابه دارند

اما سایت اول روی یک هاست اشتراکی ارزان است و سایت دوم روی یک سرور LiteSpeed بهینه قرار دارد. نتیجه؟ سایت دوم معمولاً بین 15 تا 30 نمره امتیاز بالاتری در PageSpeed می‌گیرد. فقط به خاطر کیفیت سرور.

چرا سرور LiteSpeed مهم است؟

یکی از مهم‌ترین فاکتورهایی که در افزایش سرعت سایت وردپرس تأثیر دارد، استفاده از سرور LiteSpeed است. لایت اسپید یک وب‌سرور سریع‌تر از Apache است و چند مزیت مهم دارد:

1. 1 – مدیریت بهتر منابع سرور
2. 2 – پاسخ‌دهی سریع‌تر به درخواست‌ها
3. 3 – کش داخلی قدرتمند
4. 4 – سازگاری عالی با وردپرس

اگر از هاست‌های قدیمی با Apache استفاده می‌کنید، معمولاً TTFB بالاتری خواهید داشت. اما در سرورهای LiteSpeed، زمان پاسخ اولیه معمولاً پایین‌تر است و این موضوع مستقیماً روی Core Web Vitals تأثیر می‌گذارد. برای سایت‌های وردپرسی، ترکیب «هاست LiteSpeed + کش صحیح» یکی از سریع‌ترین راه‌ها برای بالا بردن سرعت سایت است.

از کجا بفهمیم مشکل از هاست است؟

چند نشانه مهم وجود دارد:

1️⃣ در گزارش PageSpeed این پیام را می‌بینید:

🔴 Reduce initial server response time
🔴 TTFB بالا (بیش از 800 میلی‌ثانیه)

2️⃣ سایت شما بعضی وقت‌ها سریع و بعضی وقت‌ها کند است این معمولاً به خاطر شلوغ بودن هاست اشتراکی است.

3️⃣ در ساعات پرترافیک (مثلاً عصرها) سرعت سایت افت می‌کند

4️⃣ با وجود اینکه تصاویر را بهینه کرده‌اید، امتیاز تغییری نکرده است

اگر این موارد را دارید، احتمال زیاد مشکل از سرور است، نه از قالب یا افزونه‌ها.

چه زمانی باید هاست را ارتقاء دهیم؟

نکته مهم این است: همه سایت‌ها نیاز به سرور اختصاصی ندارند. ارتقاء باید منطقی و بر اساس نیاز انجام شود. اگر این شرایط را دارید، بهتر است پلن خود را ارتقاء دهید:
سایت شما روزانه بازدید قابل توجهی دارد
فروشگاه اینترنتی دارید
هنگام کمپین تبلیغاتی سایت کند می‌شود
TTFB شما بالاست و با بهینه‌سازی‌های دیگر درست نمی‌شود

چه زمانی هاست اشتراکی کافی است؟

• سایت تازه راه‌اندازی شده
• بازدید روزانه پایین دارید
• فروشگاه سنگین ندارید

یک هاست اشتراکی با کیفیت و LiteSpeed می‌تواند کاملاً کافی باشد.

مشکل اصلی معمولاً «ارزان‌ترین پلن ممکن» است، نه خود اشتراکی بودن.

راهکار عملی برای افزایش سرعت سایت از سمت سرور

اگر فکر می‌کنید مشکل از هاست است، این مراحل را انجام دهید:

1. ابتدا TTFB را در PageSpeed بررسی کنید.
2. از پشتیبانی هاست درباره نوع وب‌سرور (LiteSpeed یا Apache) سؤال بپرسید.
3. اگر Apache است و امکان تغییر ندارید، به هاست LiteSpeed مهاجرت کنید.
4. اگر LiteSpeed دارید، کش سرور را فعال کنید.
5. در صورت داشتن ترافیک بالا، پلن را ارتقاء دهید.

در بسیاری از پروژه‌ها، فقط با مهاجرت به یک هاست LiteSpeed مناسب، امتیاز PageSpeed بین 10 تا 25 نمره افزایش پیدا کرده است.

2️⃣ بهینه سازی تصاویر از 4 جهت

اگر بخواهیم یکی از شایع‌ترین دلایل کند بودن سایت را نام ببریم، بدون شک «تصاویر و عکس ها» در صدر لیست قرار می‌گیرند. خیلی از مدیران سایت‌ها وقتی عکس را داخل سایت آپلود می‌کنند، همان فایلی را قرار می‌دهند که مستقیماً از دوربین یا فتوشاپ خروجی گرفته‌اند که این بدترین حالت نمایش تصویر در سایت است عکس ها قبل از نمایش در سایت باید از 4 جهت بهینه شوند : 1 – سایز تصویر  2 – فرمت تصویر  3 – حجم تصویر  4 – فعالسازی لیزی لود (درصورتی که تصویر در بالای سایت نباشد)

یک مثال واقعی

فرض کنید در بخشی از سایت لیست محصولات را نمایش دهید و هر محصول یک تصویر شاخص دارد

• سایز جایگاهی که قرار است تصویر محصول نمایش داده شود : 200px
• سایز تصویر آپلود شده: 2000px
• حجم فایل: 1MB

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

از کجا بفهمیم مشکل از تصاویر است؟

در گزارش PageSpeed معمولاً این پیام‌ها را می‌بینید:

• Properly size images
• Serve images in next-gen formats
• Efficiently encode images

اگر کنار این بخش‌ها حجم بالایی نمایش داده شود (مثلاً 2MB یا 5MB صرفه‌جویی)، یعنی تصاویر شما نیاز به بهینه‌سازی دارند.

همچنین اگر:

• صفحه محصول دیر باز می‌شود
• اسکرول اولیه کند است
• نمره LCP پایین است

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

راهکار عملی برای بهینه سازی تصاویر

خبر خوب این است که این مشکل کاملاً قابل حل است و معمولاً سریع هم نتیجه می‌دهد.

1️⃣ سایز تصاویر (قبل از آپلود، اندازه تصویر را اصلاح کنید)

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

2️⃣فرمت تصاویر (تصاویر را به فرمت webp تبدیل کنید)

فرمت‌هایی مثل WebP حجم کمتری نسبت به JPG و PNG دارند و در افزایش سرعت سایت تأثیر قابل توجهی می‌گذارند. بهینه سازی فرمت تصاویر را میتوانید از طریق ابزارهای آنلاین انجام دهید فقط کافیست عبارت convert to webp را در گوگل جستجو کنید

3️⃣ حجم تصاویر

با ابزارهای فشرده‌سازی می‌توانید بدون افت محسوس کیفیت، حجم تصویر را تا 60٪ کاهش دهید. برای بهینه سازی حجم تصاویر هم میتوانید از سایت هایی مثل tinypng یا compressjpeg استفاده کنید. ناگفته نماند در بسیار از مواقع با تبدیل فرمت تصاویر به webp، حجم تصاویر هم تا حد زیادی کاهش پیدا میکند و بهینه میشود

4️⃣ Lazy Load را فعال کنید (درصورتی که تصویر در بالای سایت نباشد)

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

یک نکته مهم برای سایت‌های فروشگاهی

در فروشگاه‌های اینترنتی، هر صفحه محصول ممکن است چندین تصویر داشته باشد. اگر این تصاویر بهینه نباشند، هم تجربه کاربر خراب می‌شود و هم نرخ تبدیل کاهش پیدا می‌کند. در پروژه‌های فروشگاهی، بهینه‌سازی تصاویر معمولاً بین 10 تا 20 نمره امتیاز PageSpeed را بهبود می‌دهد.

جمع‌بندی این بخش

اگر به دنبال بالا بردن سرعت سایت هستید و هنوز تصاویر را بهینه نکرده‌اید، احتمالاً سریع‌ترین و کم‌هزینه‌ترین راه همین است. بنابراین قبل از اینکه سراغ تنظیمات پیچیده بروید، اول تصاویر را اصلاح کنید. در بسیاری از سایت‌ها، همین یک کار بخش بزرگی از مشکل سرعت را حل می‌کند.

3️⃣ استفاده بیش از حد از افزونه‌ها و قالب‌های سنگین

یکی دیگر از مهم‌ترین دلایل پایین بودن امتیاز PageSpeed، استفاده بیش از حد از افزونه‌ ها و قالب‌ سنگین است مخصوصاً در سایت‌های وردپرسی بعضی سایت‌ها بیش از 40 یا 50 افزونه فعال دارند و هر افزونه:

1. فایل CSS جداگانه لود می‌کند
2. فایل JavaScript اضافه وارد سایت می‌کند
3. درخواست‌های جدید به سرور می‌فرستد

و در بعضی موارد حتی کوئری‌های سنگین به دیتابیس اجرا می‌کند نتیجه این اتفاقات چیست؟ افزایش زمان لود صفحه، افت امتیاز Performance، بالا رفتن INP و TBT، و در نهایت کند شدن کلی سایت.

آیا تعداد افزونه‌ ها در بهینه سازی سرعت سایت مهم است؟

هم بله، هم نه. مشکل اصلی فقط «تعداد افزونه» نیست؛ مشکل اصلی کیفیت افزونه‌هاست. گاهی یک سایت با 10 افزونه بسیار کند است، اما سایت دیگری با 35 افزونه عملکرد خوبی دارد. چرا؟ چون بعضی افزونه‌ها بسیار سنگین و غیربهینه هستند و منابع زیادی مصرف می‌کنند.

یک مثال واقعی

فرض کنید برای هر قابلیت کوچک یک افزونه جدا نصب کرده‌اید:

اسلایدر – پاپ‌آپ – چت آنلاین – آمارگیر – فرم ساز – جدول قیمت – شمارنده – انیمیشن – نوار اعلان و… هر کدام از این افزونه‌ها ممکن است چند فایل CSS و JS به سایت اضافه کنند. حالا وقتی همه آن‌ها هم‌زمان فعال باشند، مرورگر باید ده‌ها فایل مختلف را دانلود و پردازش کند. به همین دلیل است که بعضی سایت‌ها حتی قبل از نمایش محتوا، چند ثانیه درگیر لود فایل‌های اضافی هستند.

قالب سنگین چه تأثیری روی سرعت سایت دارد؟

بعضی قالب‌ها ظاهر بسیار جذابی دارند، اما در پشت صحنه حجم زیادی کدنویسی اضافه دارند. مثلاً:

1. چندین کتابخانه جاوااسکریپت
2. انیمیشن‌های سنگین
3. اسلایدرهای متعدد
4. فونت‌های زیاد
5. افکت‌های حرکتی

همه این موارد می‌توانند Core Web Vitals را خراب کنند. در بسیاری از پروژه های افزایش سرعت سایت وردپرس، فقط با تغییر قالب یا حذف امکانات غیرضروری، امتیاز PageSpeed به شکل محسوسی بهتر شده است.

از کجا بفهمیم مشکل از افزونه‌ها یا قالب است؟

چند نشانه مهم وجود دارد: اگر در گزارش PageSpeed این موارد را می‌بینید:

🔴 Reduce unused JavaScript

🔴 Reduce unused CSS

🔴 Minimize main-thread work

احتمال زیادی وجود دارد که افزونه‌ها یا قالب شما فایل‌های اضافی لود می‌کنند. همچنین اگر:

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

چگونه تعداد افزونه ها را کم کنیم

اولین اشتباه این است که فکر کنیم باید همه افزونه‌ها را حذف کنیم. این کار نه منطقی است و نه لازم. راه درست این است که افزونه‌های غیرضروری و سنگین را شناسایی کنیم. چگونه…؟

1️⃣ حذف افزونه های غیرفعال :

ابتدا افزونه‌هایی که واقعاً استفاده نمی‌کنید حذف کنید. بسیاری از سایت‌ها افزونه‌هایی دارند که ماه‌هاست غیرفعال یا بلااستفاده هستند. توجه داشته باشید که حتی افزونه های غیرفعال هم بخاطر داشتن اتولود روی سرعت لود سایت تاثیر میگذارند بنابراین افزونه های غیرفعال را حتما حذف کنید

2️⃣ حذف افزونه های غیرضروری :

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

یا مثلا برای داشتن یک اسلایدر معمولی که با ویجت های خوده قالب هم قابل پیاده سازی است از افزونه روولوشن اسلایدر استفاده میکنند این افزونه قاتل سرعت سایت است و به شدت روی پرفورمنس سایت تاثیر منفی میگذارد

مورد دیگر اینکه در بسیاری از مواقع دیده شده صرفا برای داشتن یک فرم تماس ساده، افزونه سنگینی مثل گرویتی فرم را نصب کرده اند درحالی که میشود با پلاگین contact form7 هم فرم تماس داشت و همچنین افزونه های دیگری مثل خبرنامه، عضویت ایمیلی و… دیگر مورد استفاده نیستند و بهتر است حذف شوند.

3️⃣ حذف افزونه های مشابه

گاهی افزونه هایی که نصب میکنیم که بصورت پیشفرض در امکانات خوده قالب یا افزونه های دیگر هست بعنوان مثال اگر از قالب وودمارت استفاده میکنید نیازی به افزونه هایی مثل مقایسه محصولات، علاقه مندی ها، پیش نمایش سریع، شمارنده و… نیست یا با وجود ووکامرس نیازی به افزونه های فارسی ساز نیست یا اینکه خیلی دیده شده برای افزایش سرعت سایت، چند افزونه کش و بهینه‌سازی را هم زمان نصب می‌کنند. مثلاً:

یک افزونه کش
یک افزونه Minify
یک افزونه Lazy Load
یک افزونه بهینه‌سازی دیتابیس

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

4️⃣ فایل‌های CSS و JavaScript بلاک کننده

یکی از رایج‌ ترین مشکلاتی که باعث افت شدید امتیاز PageSpeed می‌شود، فایل‌ های CSS و JavaScript بلاک‌ کننده هستند. این مشکل مخصوصاً در سایت‌های وردپرسی بسیار زیاد دیده می‌شود و معمولاً بخش بزرگی از افت امتیاز Performance به همین موضوع مربوط است.
وقتی کاربر وارد سایت می‌شود، مرورگر باید قبل از نمایش صفحه، فایل‌های مختلف سایت را دانلود و پردازش کند. اگر بعضی از فایل‌های CSS یا JavaScript بیش از حد سنگین باشند یا در جای اشتباه لود شوند، مرورگر مجبور می‌شود نمایش صفحه را متوقف کند تا این فایل‌ها کامل پردازش شوند. به همین دلیل کاربر چند ثانیه صفحه سفید یا ناقص می‌بیند و سایت احساس کندی پیدا می‌کند.
در گزارش PageSpeed معمولاً این مشکل با پیام‌هایی مثل موارد زیر نمایش داده می‌شود:

🔴 Eliminate render-blocking resources
🔴 Reduce unused CSS
🔴 Reduce unused JavaScript

اگر این خطاها را در گزارش خود می‌بینید، یعنی بخشی از فایل‌های سایت شما مانع نمایش سریع محتوا شده‌اند.

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

این مشکل معمولاً در سایت‌هایی بیشتر دیده می‌شود که:

• قالب سنگین دارند
• صفحه‌سازهای شلوغ استفاده می‌کنند
• افزونه‌های زیاد نصب کرده‌اند
• یا چندین فایل CSS و JS غیرضروری در صفحات مختلف لود می‌شود

یکی از مهم‌ترین تأثیرات این مشکل روی معیار LCP و INP است. چون تا زمانی که این فایل‌ها پردازش نشوند، محتوای اصلی صفحه کامل نمایش داده نمی‌شود و واکنش سایت هم کندتر خواهد شد.

از کجا بفهمیم مشکل سایت از CSS و JavaScript است؟

اگر این نشانه‌ها را دارید، احتمال زیادی وجود دارد که فایل‌های CSS و JS باعث کندی سایت شده باشند:

سایت در ابتدای ورود چند ثانیه صفحه سفید نشان می‌دهد، اما بعد ناگهان همه چیز ظاهر می‌شود. یا هنگام کلیک روی دکمه‌ها و منوها کمی تأخیر احساس می‌کنید. همچنین اگر امتیاز موبایل شما خیلی پایین‌تر از دسکتاپ باشد، معمولاً یکی از دلایل اصلی همین فایل‌های سنگین جاوااسکریپت است. در PageSpeed هم معمولاً حجم زیادی صرفه‌جویی پیشنهادی برای JavaScript و CSS نمایش داده می‌شود.

چگونه فایل های css و js را بهینه کنیم؟

خبر خوب این است که در بیشتر سایت‌ها این مشکل قابل حل است و معمولاً تأثیر زیادی روی افزایش سرعت سایت دارد. بهینه سازی فایل های css و js را میتوانیم از طریق افزونه های مختلف مثل راکت، لایت اسپید، پرفمترز و… انجام بدیم که پیشنهاد من بعنوان گزینه اول استفاده از افزونه پرفمترز است این کار چند مرحله دارد که در ادامه بررسی میکنیم

1️⃣ حذف فایل های CSS , JS غیرضروری

اولین قدم این است که فایل‌های غیرضروری حذف شوند. خیلی از قالب‌ها و افزونه‌ها فایل‌هایی لود می‌کنند که اصلاً در آن صفحه استفاده نمی‌شوند. مثلا افزونه ای که کاربرد آن فقط در صفحه تماس باماست اما فایل هایش در همه صفحات لود میشود و متاسفانه اکثر افزونه ها به همین شکل کار میکنند و فایل هایشان را در همه صفحات غیرمرتبط لود میشود بنابراین اولین قدم حذف فایل های اضافه است اما چگونه…؟

بهترین افزونه برای حذف فایل های غیرضروری css و js افزونه پرفمترز است برای این منظور پلاگین پرفمترز را نصب کنید و در صفحه اصلی طبق تصویر زیر وارد بخش اسکریپت منیجیر شوید :

حالا وارد صفحه ای میشوید که میتوانید لیست تمام فایل های css و js که توسط قالب یا افزونه های مختلف در صفحه اصلی لود میشود را به صورت تفیکیک شده ببینید و مدیریت کنید،

بعنوان مثال در تصویر زیر میبینید که افزونه Contact Form 7 دو فایل از نوع js در صفحه اصلی لود میکند که میتوانیم آنها را حذف کنیم، یا پلاگین Awesome Support که مربوط به صفحه تیکت ها است فایل هایی را در صفحه اصلی لود میکند که میتوانیم حذف کنیم… بنابراین به این ترتیب میتوانیم تمام فایل هایی که مربوط به افزونه خاصی هستند که در صفحه غیر مرتبط لود میشوند را حذف کنیم و صرفا در صفحه مربوط به خودش لود کنیم. آموزش عملی و جزئیات این بخش را در دوره آموزش افزایش سرعت سایت میتوانید مشاهده کنید

این اولین گام برای بهینه سازی فایل های CSS , JS بود. حالا بریم سراغ ادامه اقداماتی که برای بهینه سازی و افزایش سرعت سایت لازم است انجام دهیم…

2️⃣ فشرده‌سازی (Minification)

در حالت عادی، برنامه‌نویسان برای خوانایی بیشتر کدها از فاصله (Space)، خطوط جدید و کامنت‌ها استفاده می‌کنند. فشرده‌سازی یعنی حذف تمام این فضاهای خالی اضافی بدون اینکه به کارکرد کد آسیبی برسد. این کار حجم فایل‌های css و js را تا حد زیادی کاهش می‌دهد. افزونه هایی مثل راکت و پرفمترز براحتی این کار را برای شما انجام میدهند.

3️⃣ اضافه کردن Defer به جاوااسکریپت

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

4️⃣ Delay (بارگذاری JS با تعامل کاربر)

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

5️⃣ حذف CSSهای اضافی

حذف CSSهای اضافی (Remove Unused CSS) یعنی پاک کردن کدهایی که در یک صفحه بارگذاری می‌شوند، اما هیچ نقشی در ظاهر آن صفحه ندارند. قالب‌ها و افزونه‌های وردپرس معمولاً تمام کدهای استایل خود را در قالب یک فایل بزرگ به مرورگر می‌فرستند؛ به عنوان مثال، کدهای مربوط به «سبد خرید» یا «فرم تماس» در «صفحه اصلی» سایت شما هم لود می‌شوند، در حالی که در آن صفحه هیچ کاربردی ندارند. ابزارهای بهینه‌سازی این کدهای اضافی را شناسایی و حذف می‌کنند تا مرورگر فقط کدهای ضروری همان صفحه را پردازش کند که این کار سرعت لود اولیه را به شدت بالا می‌برد. افزونه هایی مثل پرفمترز و راکت این گزینه را دارند.

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

5️⃣ فعال نبودن کش (Cache)

یکی دیگر از مهم‌ترین دلایل پایین بودن سرعت سایت، فعال نبودن کش است. کش (Cache) یکی از مهم‌ترین تکنیک‌های افزایش سرعت سایت است که باعث می‌شود بخشی از اطلاعات سایت به صورت موقت ذخیره شود تا در بازدیدهای بعدی سریع‌تر به کاربر نمایش داده شود. به زبان ساده، وقتی کش فعال باشد سایت لازم نیست هر بار همه اطلاعات را از ابتدا پردازش کند و همین موضوع باعث کاهش فشار روی سرور، کاهش زمان لود صفحات و بهبود امتیاز PageSpeed می‌شود.

در بحث افزایش سرعت سایت انوع مختلفی از کش مطرح میشود اما دو نوع آن از همه مهم‌تر هستند:

• کش صفحه (Page Cache)
• کش مرورگر (Browser Cache)

 

کش صفحه (Page Cache) چیست؟

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

1 – اجرای کدهای PHP
2 – دریافت اطلاعات از دیتابیس
3 – پردازش افزونه‌ها
4 – ساخت کامل صفحه

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

بهترین راه فعال‌سازی کش صفحه

اگر از وردپرس استفاده می‌کنید، ساده‌ترین راه استفاده از افزونه‌های کش حرفه‌ای است. افزونه‌هایی مثل WP Rocket و  LiteSpeed Cache می‌توانند کش صفحه را به شکل خودکار فعال کنند. توجه داشته باشید اگر هاست شما LiteSpeed باشد، از افزونه LiteSpeed Cache استفاده کنید چراکه مستقیماً با سرور هماهنگ است و سرعت بالاتری ارائه می‌دهد.

کش مرورگر (Browser Cache) چیست؟

برخلاف کش صفحه که روی سرور انجام می‌شود، کش مرورگر مستقیماً روی دستگاهِ خودِ کاربر (کامپیوتر یا موبایل) اتفاق می‌افتد.

یک صفحه وب شامل المان‌های ثابتی است که در تمام صفحات تکرار می‌شوند؛ مانند لوگوی سایت، کدهای CSS اصلی، فایل‌های جاوااسکریپت پایه‌ای و فونت‌ها. وقتی کاربر برای اولین بار وارد سایت شما می‌شود، مرورگر او تمام این فایل‌ها را از سرور دانلود می‌کند. کش مرورگر با استفاده از دستوراتی که از سمت سایت صادر می‌شود، به مرورگر کاربر دستور می‌دهد: «این فایل‌های ثابت (مثل لوگو و فونت‌ها) را در حافظه محلی خودت ذخیره کن و تا ۳۰ روز آینده یا یک سال دیگر، دوباره آن‌ها را از سرور دانلود نکن!»

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

نوع کش	وظیفه اصلی	میزان اهمیت	تأثیر روی سرعت سایت	مناسب برای
Page Cache (کش صفحه)	ذخیره نسخه آماده صفحات سایت	بسیار زیاد	کاهش شدید زمان لود و فشار سرور	تمام سایت‌ها
Browser Cache (کش مرورگر)	ذخیره فایل‌ها در مرورگر کاربر	زیاد	افزایش سرعت بازدیدهای بعدی	تمام سایت‌ها
Object Cache	ذخیره کوئری‌ها و پردازش‌های تکراری	متوسط	کاهش فشار روی دیتابیس	سایت‌های پرترافیک
Database Cache	ذخیره نتایج درخواست‌های دیتابیس	متوسط	بهبود سرعت پردازش بک‌اند	فروشگاه‌ها و سایت‌های بزرگ
CDN Cache	ذخیره فایل‌ها روی سرورهای مختلف دنیا	متوسط	کاهش زمان دریافت فایل‌ها	سایت‌های پرترافیک
Opcode Cache	ذخیره کدهای PHP پردازش‌شده	متوسط	افزایش سرعت اجرای PHP	سرورهای حرفه‌ای

 

تأثیر کش مرورگر روی افزایش سرعت سایت

سرعت فوق‌العاده در صفحات دوم به بعد: کاربر بعد از لود صفحه اول، صفحات بعدی را با سرعتی شبیه به یک نرم‌افزار آفلاین تجربه می‌کند. صرفه‌جویی در پهنای باند: حجم داده‌های انتقالی بین سرور و کاربر به شدت کاهش می‌یابد. فعال‌سازی صحیح کش معمولاً یکی از سریع‌ترین راه‌ها برای افزایش سرعت سایت فروشگاهی است و در بسیاری از پروژه‌ها بدون نیاز به تغییرات پیچیده، باعث بهبود محسوس امتیاز PageSpeed می‌شود.