ابزارهای تست سرعت سایت کدامند؟

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

طبق گزارش Google، هر ۱۰۰ میلی‌ثانیه تأخیر اضافی، ۱ درصد کاهش نرخ تبدیل به همراه دارد. طبق گزارش Akamai، ۵۳ درصد از کاربران موبایل، سایتی که بیش از ۳ ثانیه طول می‌کشد را رها می‌کنند. طبق گزارش HTTP Archive، میانگین LCP در ۲۰۲۶، حدود ۲.۵ ثانیه در دسکتاپ و ۳.۱ ثانیه در موبایل است. در این چشم‌انداز، انتخاب ابزار مناسب تست سرعت، پایه هر تصمیم بهینه‌سازی است. اگر با مفاهیم پایه‌ای سرعت آشنا نیستید، ابتدا بهینه‌سازی سرعت سایت چیست و Core Web Vitals چیست را مطالعه کنید.

چرا تست سرعت ضروری است؟

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

در پروژه‌ای که سال گذشته روی آن کار کردم، تیم سه هفته روی بهینه‌سازی تصاویر کار کرد و LCP را از ۴.۲ به ۳.۸ ثانیه رساند. اما بعد از پروفایل دقیق با WebPageTest، فهمیدیم گلوگاه واقعی، TTFB سرور است، نه تصاویر. با یک مهاجرت هاست، LCP به ۲.۱ ثانیه رسید. این تجربه نشان می‌دهد که اندازه‌گیری قبل از بهینه‌سازی، تفاوت بین ۳ هفته و ۳ روز است.

اگر با ابزارهای کلی وب آشنا نیستید، ابزارهای توسعه وب چیست و ابزارهای بهینه‌سازی عملکرد وب را مطالعه کنید.

سرعت، یک Feature است، نه یک Luxury. اگر کاربر تجربه کند داشته باشد، همه Featureها بی‌ارزش می‌شوند. اندازه‌گیری، پایه هر تصمیم سرعت است.

Lab Data در برابر Field Data

قبل از معرفی ابزارها، باید تفاوت Lab Data و Field Data را بشناسیم. این تفاوت، در تصمیم‌گیری صحیح حیاتی است.

Lab Data (داده آزمایشگاهی): در محیط کنترل‌شده و با شرایط مشخص (CPU، شبکه، Cache) جمع‌آوری می‌شود. این داده‌ها قابل تکرار هستند اما همیشه نماینده تجربه واقعی کاربران نیستند.

Field Data (داده میدانی): از کاربران واقعی و در شرایط واقعی جمع‌آوری می‌شود. این داده‌ها نماینده تجربه واقعی هستند اما حجم داده و زمان بیشتری نیاز دارند. Google برای رتبه‌بندی، از Field Data استفاده می‌کند.

PageSpeed Insights

PageSpeed Insights (PSI) ابزار رسمی Google برای سنجش سرعت است. PSI از دو منبع داده استفاده می‌کند: Lighthouse برای Lab Data و CrUX برای Field Data. این ترکیب، PSI را به یک ابزار جامع تبدیل می‌کند.

امکانات PSI: اول، Performance Score در بازه ۰-۱۰۰. دوم، Core Web Vitals Assessment. سوم، Opportunities برای شناسایی گلوگاه. چهارم، Diagnostics برای بررسی عمیق. پنجم، Field Data از CrUX. ششم، API برای Automation.

# استفاده از PageSpeed Insights API
curl "https://www.googleapis.com/pagespeedonline/v5/runPagespeed?url=https://example.com&strategy=mobile"

نکات مهم در استفاده از PSI: اول، از داده‌های میدانی به عنوان معیار اصلی استفاده کنید. دوم، از داده‌های آزمایشگاهی برای Debugging. سوم، در سایت‌های کم‌ترافیک، ممکن است داده‌های میدانی نداشته باشید. چهارم، از API برای Automation استفاده کنید. پنجم، در تیم‌های بزرگ، از Search Console برای داده‌های بیشتر استفاده کنید.

Lighthouse و Lighthouse CI

Lighthouse ابزار اصلی Google برای اندازه‌گیری Performance است که به صورت Built-in در Chrome DevTools موجود است. این ابزار پنج دسته را می‌سنجد: Performance، Accessibility، Best Practices، SEO و PWA.

امکانات Lighthouse: اول، Performance Score با پنج معیار (FCP، LCP، TBT، CLS، SI). دوم، Opportunities برای شناسایی گلوگاه‌ها. سوم، Diagnostics برای بررسی عمیق. چهارم، Mobile و Desktop Mode. پنجم، Throttling قابل تنظیم. ششم، JSON Output.

# اجرای Lighthouse در CLI
npm install -g lighthouse
lighthouse https://example.com --output=html --output-path=report.html

# با Throttling مشخص
lighthouse https://example.com --preset=desktop

# فقط Performance
lighthouse https://example.com --only-categories=performance

Lighthouse CI یکی از قدرتمندترین ابزارهای Lighthouse است که در CI/CD قابل استفاده است. با Lighthouse CI، می‌توانید در هر PR Performance را بسنجید و از رگرسیون جلوگیری کنید.

# نمونه GitHub Action
name: Lighthouse CI
on: [pull_request]
jobs:
  lighthouse:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3
      - uses: treosh/lighthouse-ci-action@v9
        with:
          urls: |
            https://example.com
            https://example.com/products

نکات مهم در Lighthouse: اول، از Throttling برای شبیه‌سازی موبایل میان‌رده استفاده کنید. دوم، در سه اجرا، میانه را ملاک بگیرید. سوم، از Lighthouse CI برای Automation استفاده کنید. چهارم، Score را با داده‌های دیگر ترکیب کنید. پنجم، به همه Categoryها توجه کنید، نه فقط Performance. اگر با ابزارهای تست سرعت آشنا نیستید، ابزارهای سنجش Core Web Vitals را مطالعه کنید.

WebPageTest

WebPageTest یکی از قدرتمندترین ابزارهای Performance Testing است که امکانات پیشرفته‌ای نسبت به Lighthouse دارد. این ابزار، توسط Catchpoint پشتیبانی می‌شود و در وب و به صورت Open-Source قابل نصب است.

امکانات WebPageTest: اول، تست از موقعیت‌های جغرافیایی مختلف. دوم، تست در دستگاه‌های واقعی. سوم، Waterfall View تفصیلی. چهارم، Filmstrip View. پنجم، Comparison View برای مقایسه دو نسخه. ششم، Custom Scripts برای سناریوهای پیچیده. هفتم، API برای Automation.

# نمونه Custom Script
navigate https://example.com
waitForComplete
execAndWait document.querySelector(".buy-button").click()
waitForComplete
execAndWait window.scrollTo(0, document.body.scrollHeight)

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

نکات مهم در WebPageTest: اول، از Connection Profile برای شبیه‌سازی اینترنت کند استفاده کنید. دوم، از Location برای شبیه‌سازی کاربران جغرافیایی مختلف. سوم، از Repeat View برای مشاهده رفتار Cache. چهارم، از API برای Automation در CI/CD. پنجم، از Filmstrip View برای مشاهده تجربه بصری کاربر استفاده کنید.

GTmetrix

GTmetrix یکی از محبوب‌ترین ابزارهای تست سرعت است که ترکیبی از Lighthouse و WebPageTest را ارائه می‌دهد. این ابزار، در نسخه رایگان و پولی موجود است و رابط کاربری ساده‌ای دارد.

امکانات GTmetrix: اول، Performance Score. دوم، Structure Score. سوم، Waterfall View. چهارم، Page Load Video. پنجم، Report History. ششم، Monitoring. هفتم، API.

نکات مهم در GTmetrix: اول، از نسخه رایگان برای تست سریع استفاده کنید. دوم، از نسخه پولی برای پایش مداوم و Monitoring. سوم، از Waterfall View برای شناسایی گلوگاه استفاده کنید. چهارم، از Comparison برای مقایسه با رقبا. پنجم، از API برای Automation.

CrUX و Search Console

CrUX (Chrome User Experience Report) یک Dataset عمومی از تجربه کاربران واقعی Chrome است. این Dataset، اطلاعات Core Web Vitals (LCP، INP، CLS) را برای میلیون‌ها دامنه در سطح جهان ارائه می‌دهد. CrUX در ۲۸ روز گذشته Aggregate می‌شود.

# استفاده از CrUX API
curl "https://chromeuxreport.googleapis.com/v1/records:queryRecord?key=YOUR_API_KEY" 
  -H "Content-Type: application/json" 
  -d "{
    "origin": "https://example.com",
    "metrics": ["largest_contentful_paint", "cumulative_layout_shift", "interaction_to_next_paint"]
  }"

Search Console داده‌های CWV را در بخش Core Web Vitals ارائه می‌دهد. این بخش، بر اساس گروه URL سازمان‌دهی شده و مشکلات را اولویت‌بندی می‌کند. نکات مهم: اول، CrUX برای تصمیم‌گیری رتبه‌بندی. دوم، Search Console برای شناسایی گروه URL مشکل‌دار. سوم، CrUX History API برای Trend بلندمدت. چهارم، در سایت‌های کم‌ترافیک، CrUX ممکن است داده نداشته باشد. پنجم، Google از Field Data برای رتبه‌بندی استفاده می‌کند، نه Lab Data. اگر با Search Console آشنا نیستید، بهبود رتبه در گوگل را مطالعه کنید.

SpeedCurve و Calibre

SpeedCurve و Calibre دو ابزار تجاری برای پایش سرعت هستند که امکاناتی فراتر از PSI و Lighthouse دارند. این ابزارها، مخصوص تیم‌هایی است که به پایش مداوم و تحلیل عمیق نیاز دارند.

SpeedCurve مزایای اصلی: اول، پایش مداوم Performance. دوم، Visualization عالی. سوم، Synthetic و RUM. چهارم، Competitive Benchmarking. پنجم، Design Review با Screenshot. ششم، یکپارچگی با CI/CD.

Calibre مزایای اصلی: اول، پایش Performance برای هر PR. دوم، Alert برای رگرسیون. سوم، Distribution Analysis. چهارم، یکپارچگی با GitHub. پنجم، API خوب.

نکات مهم در استفاده از این ابزارها: اول، ابزارهای تجاری برای تیم‌های متوسط و بزرگ مناسب هستند. دوم، ROI این ابزارها از طریق جلوگیری از رگرسیون برمی‌گردد. سوم، در ترکیب با Lighthouse CI و PSI، پوشش جامعی فراهم می‌کنند. چهارم، هزینه ماهانه بین ۱۰ تا ۵۰۰ دلار متغیر است. پنجم، برای پروژه‌های کوچک، ابزارهای رایگان کافی است.

Chrome DevTools Performance

Chrome DevTools Performance Panel یکی از قدرتمندترین ابزارهای Debugging دقیق سرعت است. این ابزار، به شما امکان می‌دهد که فعالیت‌های CPU، Memory و Network را در زمان واقعی ببینید.

امکانات Performance Panel: اول، Record Timeline. دوم، Frames View برای شناسایی Long Tasks. سوم، Main Thread View برای دیدن JavaScript Execution. چهارم، Network View. پنجم، Memory Allocation. ششم، Screenshots در طول اجرا.

# شناسایی Long Tasks
1. Performance Panel را باز کنید
2. Record را کلیک کنید
3. صفحه را اسکرول یا کلیک کنید
4. Stop را کلیک کنید
5. به دنبال بلوک‌های نارنجی (Long Tasks) بگردید

نکات مهم در Performance Panel: اول، از CPU Throttling (4x یا 6x) برای شبیه‌سازی موبایل میان‌رده استفاده کنید. دوم، از Record و Reload برای پروفایل Load. سوم، از Record و Interact برای پروفایل Interaction. چهارم، از Coverage برای شناسایی CSS/JS استفاده‌نشده. پنجم، از Layers برای شناسایی Layout Shifts. ششم، از Memory برای شناسایی Memory Leak. اگر با این حوزه علاقه‌مندید، افزونه‌های ضروری مرورگر را مطالعه کنید.

انتخاب ابزار مناسب

انتخاب ابزار مناسب، بستگی به سه معیار دارد: اول، هدف تست (Debugging، Monitoring، Comparison). دوم، اندازه تیم. سوم، بودجه.

پنج سناریو رایج: اول، Debugging سایت شخصی — PSI و Chrome DevTools کافی است. دوم، بهینه‌سازی سایت تجاری — Lighthouse + WebPageTest + PSI. سوم، پایش مداوم سایت سازمانی — SpeedCurve یا Calibre. چهارم، تست در CI/CD — Lighthouse CI. پنجم، تحلیل رقبا — GTmetrix یا WebPageTest با Comparison.

اگر با زیرساخت سرعت آشنا نیستید، تأثیر هاست بر سرعت و تأثیر TTFB بر سرعت را مطالعه کنید.

جدول مقایسه جامع

جریان کاری حرفه‌ای

جریان کاری سرعت که در پروژه‌های خودم استفاده می‌کنم، چهار مرحله دارد:

مرحله اول، Baseline: قبل از هر بهینه‌سازی، وضعیت موجود را با Lighthouse، PSI و WebPageTest سنجید. این Baseline، معیار مقایسه بعدی است.

مرحله دوم، Debugging: با Chrome DevTools Performance Panel، گلوگاه‌های واقعی را شناسایی کنید. از Coverage برای CSS/JS استفاده‌نشده، از Memory برای Memory Leak، و از Network برای Request Chain استفاده کنید.

مرحله سوم، Optimization: بر اساس داده‌ها، بهینه‌سازی‌ها را اولویت‌بندی کنید. ترتیب من: اول تصاویر، دوم CSS/JS، سوم فونت‌ها، چهارم TTFB، پنجم DOM.

مرحله چهارم، Monitoring: بعد از Release، Performance را با RUM و SpeedCurve پایش کنید. از Lighthouse CI برای جلوگیری از رگرسیون استفاده کنید.

پرسش‌های پرتکرار

کدام ابزار بهترین است؟ هیچ ابزار واحدی بهترین نیست. برای Debugging: Chrome DevTools. برای Baseline: Lighthouse. برای عمق: WebPageTest. برای Field Data: CrUX و PSI. برای پایش: SpeedCurve. ترکیب این ابزارها، پوشش جامعی فراهم می‌کند.

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

آیا Lighthouse Score کافی است؟ خیر. Lighthouse Score بر اساس Lab Data است و Google برای رتبه‌بندی از Field Data استفاده می‌کند. تفاوت بین Score و تجربه واقعی می‌تواند زیاد باشد. از CrUX برای داده‌های میدانی استفاده کنید.

چگونه از رگرسیون سرعت جلوگیری کنم؟ از Lighthouse CI در CI/CD استفاده کنید. با Budget Performance، محدودیت‌های مشخص تعریف کنید و در صورت تجاوز، Build را Fail کنید. از SpeedCurve یا Calibre برای پایش مداوم استفاده کنید.

آیا باید از RUM استفاده کنم؟ بله، اگر سایت شما ترافیک کافی دارد. RUM تجربه واقعی کاربران را نشان می‌دهد که Lab Data نمی‌تواند. از Web Vitals Library و GA4 برای شروع استفاده کنید. اگر با این حوزه آشنا نیستید، نقد و بررسی Google Analytics را مطالعه کنید.

آیا ابزارهای تجاری ارزش خرید دارند؟ برای تیم‌های متوسط و بزرگ، بله. ROI از طریق جلوگیری از رگرسیون، بهبود تجربه کاربری و افزایش نرخ تبدیل برمی‌گردد. برای پروژه‌های کوچک، ابزارهای رایگان کافی است.

چگونه Performance را در تیم نهادینه کنم؟ سه رویکرد: اول، Performance Budget تعریف کنید. دوم، از Lighthouse CI در PRها استفاده کنید. سوم، Performance را در Code Review جدی بگیرید. اگر با CI/CD آشنا نیستید، مقایسه ابزارهای CI/CD را مطالعه کنید.

آنچه باید با خود ببرید

ابزارهای تست سرعت، ضریب کیفیت توسعه‌دهنده هستند. انتخاب درست می‌تواند ساعت‌ها در روز صرفه‌جویی کند و از فاجعه در محیط تولید جلوگیری کند. پنج دسته اصلی ابزار: Lab، Field، RUM، Synthetic و CI/CD.

هفت اصل کلیدی که در این مقاله بررسی شد:

1. Lab Data برای Debugging و Field Data برای تصمیمات رتبه‌بندی.
2. PageSpeed Insights با ترکیب Lab و Field، ابزار جامعی است.
3. Lighthouse CI برای جلوگیری از رگرسیون در CI/CD.
4. WebPageTest برای Debugging عمیق با Waterfall Analysis.
5. CrUX برای تصمیم‌گیری رتبه‌بندی، ابزار اصلی است.
6. SpeedCurve و Calibre برای پایش مداوم تیم‌های بزرگ.
7. Chrome DevTools برای Debugging دقیق در سطح کد.

قدم عملی امروز: یک Baseline سرعت برای سایت خود بسازید. اول، از Lighthouse برای Performance Score. دوم، از CrUX یا PSI برای Field Data. سوم، از WebPageTest برای Waterfall Analysis. این سه گام، تصویر جامعی از وضعیت سرعت سایت شما ارائه می‌دهد. اگر می‌خواهید در حوزه‌های تخصصی عمیق‌تر شوید، بهینه‌سازی سرعت موبایل و افزایش سرعت وردپرس را مطالعه کنید.

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