Lighthouse scoring calculator: how the performance score is made

What does this calculator do?

The Performance score in PageSpeed and Lighthouse is made from five lab metrics. Each metric first gets its own score from 0 to 100, then the five scores are averaged with fixed weights. This calculator does the same sum in front of you: move a metric's value slider and watch its score and the total change. The smaller slider sets a metric's score directly and shows the value needed for it.

When you click "See calculator" in a report, that report's numbers and device (mobile or desktop) come here, so you can see which metric would move your score the most.

What does the gauge show?

The gauge on the right is the one from the report. Its outer ring is cut into five pieces, and each piece is as long as one metric's weight. The strong part of each piece is what that metric added to the total. Hover a piece to see the metric and its share as "+number". The empty part of a piece is the score that metric can still give.

The five metrics and their weights

FCP: First Contentful Paint (10%)

When the first text or image appears on screen. A slow server, render-blocking CSS and JavaScript, and late fonts make it longer. Green needs about 1.8 s or less on mobile and about 0.9 s or less on desktop.

SI: Speed Index (10%)

How quickly the content of the page fills in while it loads. A page that shows something early but finishes late has a worse Speed Index. Green is about 3.4 s on mobile and 1.3 s on desktop.

LCP: Largest Contentful Paint (25%)

When the largest image or text block near the top (usually the hero image or banner) is fully shown. It is one of the Core Web Vitals. A heavy image, lazy loading on the hero image and a late start of its download are the usual causes. Green is 2.5 s on mobile and 1.2 s on desktop.

TBT: Total Blocking Time (30%)

The total time between FCP and the page being ready when long JavaScript tasks keep the browser from answering clicks and typing. It has the largest weight and usually improves with fewer scripts, delaying scripts that are not needed at first, and lighter plugins. Green is 200 ms on mobile and 150 ms on desktop.

CLS: Cumulative Layout Shift (25%)

How much the elements of the page move unexpectedly while it loads. Images without size, ads or banners added late, and swapping fonts are the usual causes. It has no time unit; green is 0.1 on both devices.

INP (Interaction to Next Paint) has no weight in the lab test, because nobody clicks during it. See it in the real-user part of the report; TBT is the closest lab metric to it.

Sensitivity: why the score sometimes moves a lot and sometimes barely

The curve is not linear. Each score comes from a log-normal curve. Near the green and orange borders a few tens of milliseconds can move several points; when a metric is very good or very bad, even a big change does little.
TBT and LCP matter most. Together they are 55% of the score. If you can improve only one metric, it is usually one of these two.
Mobile is stricter. The mobile test runs on an emulated mid-range phone over slow 4G, so its limits are higher but harder to reach.
Every run differs a little. Network, server and ad scripts behave a bit differently each time. A few points of difference between two runs is normal; test several times before comparing.
100 is not needed. 90 and above is green. For SEO and visitors, passing the Core Web Vitals of real users matters more than the lab score.

Lab score versus real users

This calculator only makes the Lighthouse lab score: one page load in fixed conditions. The "Discover what your real users are experiencing" part of a report comes from the last 28 days of real Chrome visitors, and that is what Google uses for ranking. A low lab score can come with passing real users, and the other way round.

این ماشین‌حساب چه کار می‌کند؟

نمره Performance که PageSpeed و Lighthouse نشان می‌دهند، از پنج شاخص آزمایشگاهی ساخته می‌شود. هر شاخص اول جداگانه یک نمره بین 0 تا 100 می‌گیرد و بعد این پنج نمره با وزن‌های مشخص میانگین گرفته می‌شوند. این ماشین‌حساب همین محاسبه را جلوی چشم شما انجام می‌دهد: مقدار هر شاخص را با اسلایدر تغییر دهید و ببینید نمره همان شاخص و نمره کل چقدر عوض می‌شود. اسلایدر کوچک‌تر نمره هر شاخص را مستقیم تغییر می‌دهد و مقدار لازم برای رسیدن به آن نمره را نشان می‌دهد.

وقتی از گزارش روی «See calculator» بزنید، عددهای همان گزارش و نوع دستگاه (موبایل یا دسکتاپ) به این صفحه می‌آیند، پس می‌توانید ببینید بهتر کردن کدام شاخص بیشترین اثر را روی نمره شما دارد.

نمودار دایره‌ای چه می‌گوید؟

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

پنج شاخص و وزن هر کدام

FCP: اولین محتوای صفحه (وزن 10 درصد)

زمانی که اولین متن یا تصویر صفحه روی صفحه‌نمایش ظاهر می‌شود. سرور کند، فایل‌های CSS و JS که جلوی نمایش را می‌گیرند و فونت‌هایی که دیر بار می‌شوند، این زمان را زیاد می‌کنند. برای نمره سبز، روی موبایل حدود 1.8 s یا کمتر و روی دسکتاپ حدود 0.9 s یا کمتر لازم است.

SI: شاخص سرعت (وزن 10 درصد)

نشان می‌دهد محتوای صفحه در طول بارگذاری با چه سرعتی پر می‌شود. صفحه‌ای که زود چیزی نشان می‌دهد ولی بقیه‌اش دیر کامل می‌شود، Speed Index بدتری دارد. مرز سبز روی موبایل حدود 3.4 s و روی دسکتاپ حدود 1.3 s است.

LCP: بزرگترین محتوای صفحه (وزن 25 درصد)

زمانی که بزرگ‌ترین تصویر یا متن بالای صفحه (معمولاً تصویر اصلی یا بنر) کامل نمایش داده می‌شود. این شاخص یکی از Core Web Vitals است. تصویر سنگین، بارگذاری تنبل روی تصویر اصلی و شروع دیر دانلود آن، رایج‌ترین دلیل LCP بالا است. مرز سبز روی موبایل 2.5 s و روی دسکتاپ 1.2 s است.

TBT: کل زمان مسدودی (وزن 30 درصد)

مجموع زمان‌هایی که مرورگر بین FCP و آماده شدن صفحه، به خاطر اجرای کارهای طولانی JavaScript قفل است و به کلیک و تایپ جواب نمی‌دهد. بیشترین وزن را دارد و معمولاً با کم کردن اسکریپت‌ها، تأخیر در اجرای اسکریپت‌های غیرضروری و سبک کردن افزونه‌ها بهتر می‌شود. مرز سبز روی موبایل 200 ms و روی دسکتاپ 150 ms است.

CLS: جابه‌جایی چیدمان صفحه (وزن 25 درصد)

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

INP (پاسخ به تعامل کاربر) در آزمایش PageSpeed وزن ندارد، چون آزمایش کسی را برای کلیک کردن ندارد. اثر آن را در بخش «کاربران واقعی» گزارش ببینید. TBT نزدیک‌ترین شاخص آزمایشگاهی به آن است.

حساسیت‌ها: چرا نمره گاهی زیاد و گاهی کم عوض می‌شود؟

منحنی خطی نیست. نمره هر شاخص از یک منحنی log-normal می‌آید. نزدیک مرز سبز و نارنجی، چند ده میلی‌ثانیه می‌تواند چند نمره جابه‌جا کند؛ ولی وقتی شاخص خیلی خوب یا خیلی بد است، حتی تغییر بزرگ هم اثر کمی دارد.
TBT و LCP بیشترین اثر را دارند. روی هم 55 درصد نمره هستند. اگر فقط وقت بهتر کردن یک شاخص را دارید، معمولاً یکی از این دو بهترین انتخاب است.
موبایل سخت‌گیرتر است. آزمایش موبایل روی گوشی متوسط با اینترنت 4G کند شبیه‌سازی می‌شود، برای همین مرزهای آن از دسکتاپ بالاتر است ولی رسیدن به آن‌ها سخت‌تر است.
نمره هر بار کمی فرق می‌کند. شبکه، سرور و افزونه‌های تبلیغاتی در هر اجرا رفتار کمی متفاوتی دارند. چند امتیاز بالا و پایین شدن بین دو اجرا عادی است؛ برای مقایسه، چند بار آزمایش کنید.
نمره 100 لازم نیست. بالای 90 سبز حساب می‌شود. برای سئو و تجربه کاربر، قبول شدن Core Web Vitals کاربران واقعی از نمره آزمایشگاهی مهم‌تر است.

فرق نمره آزمایشگاهی با کاربران واقعی

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

Lighthouse Scoring Calculator