Hiệu suất trang cung cấp tổng quan hiệu suất tức thì của bất kỳ trang web nào.
Hiệu suất trang cung cấp tổng quan hiệu suất tức thì của bất kỳ trang web nào.
Shows First Contentful Paint (FCP), DOMContentLoaded, Full Page Load, and Time to Interactive (TTI) — the four most important performance metrics. Each is color-coded: green (fast), yellow (moderate), red (slow) based on established Web Vitals thresholds.
Visual bar chart showing the count and total size of each resource type: JavaScript files, CSS stylesheets, images, fonts, and other assets. Instantly see which resource type contributes the most to page weight.
Shows total DOM element count, maximum nesting depth, and total event listener count. Large DOM sizes (2000+ elements) and deep nesting (15+ levels) are flagged as potential performance bottlenecks.
A single 0-100 score summarizes the page's performance health, color-coded green (85+), yellow (50-84), or red (0-49). Based on a weighted combination of timing metrics and resource efficiency.
Shows the combined size of all downloaded resources in MB. Broken down by category so you can see that 842 KB is JavaScript, 245 KB is images, and 128 KB is CSS — identifying the heaviest contributors.
Reads performance data from the browser's Performance API — data that's already collected during the normal page load. No synthetic re-testing, no additional network requests, and no performance impact from running the tool.
Open any page and get an instant performance overview. Is it fast (green score), moderate (yellow), or slow (red)? The dashboard answers this in under a second — no waiting for Lighthouse to run.
If the page is slow, the resource breakdown shows why. 1.2 MB of JavaScript? That's the bottleneck. 800 KB of unoptimized images? That's the fix. The visual breakdown makes the heaviest contributors obvious.
Run Page Performance before making optimizations, note the metrics. Make your changes, reload, and run it again. Compare FCP, load time, and total page weight to verify your optimizations had the expected impact.
Run Page Performance on your site and your competitors' sites. Compare load times, page weights, and resource distributions. Are competitors shipping less JavaScript? Are their images better optimized?
Run the tool on key pages regularly during development. If the performance score drops or page weight suddenly increases, you've introduced a regression — catch it before it reaches production.
Open the DevSuite Pro floating dock and click the Page Performance icon. The dashboard appears instantly with performance data for the current page load.
Check the four key timing metrics at the top: FCP, DOMContentLoaded, Full Load, and TTI. Green values are fast, yellow is moderate, red needs improvement.
Look at the resource bar chart to see which asset type is heaviest. JavaScript is often the biggest contributor — if JS is over 500 KB, it may be worth code-splitting or lazy-loading.
Review the DOM statistics. If element count exceeds 1500 or nesting depth exceeds 15, consider simplifying the markup to improve rendering performance.
The overall score gives a quick benchmark. Run the tool before and after optimizations to measure improvement.
Cài đặt DevSuite Pro miễn phí và mở khóa hơn 39 công cụ dành cho nhà phát triển cho trình duyệt của bạn.
