Performance Insights
The Performance Insights section focuses on your site’s speed and user experience performance. Fast-loading, responsive pages are crucial for good user experience and even SEO rankings. Evergreen’s performance analysis helps you identify pages that need improvement and guides you on what to fix.
Metrics and Data Covered: Evergreen primarily uses Google’s Core Web Vitals and related performance metrics to evaluate your pages. Key metrics you’ll encounter include:
- Largest Contentful Paint (LCP): Measures loading speed – specifically, how long it takes for the largest content element (like a big image or headline text) to appear on the screen. A good LCP is under 2.5 seconds, anything above 4 seconds is considered poor . If a page’s LCP is high, users might be waiting too long to see meaningful content.
- First Input Delay (FID): Measures interactivity – the delay from when a user first tries to interact (click a button, etc.) to when the browser actually responds. Aim for FID below 100 milliseconds; above 300 ms is poor. A low FID means the page isn’t bogged down by heavy scripts that delay interaction. (Note: In some contexts, you might see Interaction to Next Paint (INP) which is a newer, related metric replacing FID for more complete responsiveness tracking. Evergreen may use FID or INP – conceptually they indicate how responsive your page is to user actions.)
- Cumulative Layout Shift (CLS): Measures visual stability – how much the page layout shifts unexpectedly during load. This helps identify pages where content jumps around (which is frustrating to users). A good CLS score is under 0.1; above 0.25 is poor. High CLS often comes from images or ads loading without dimensions or late-loading fonts pushing content.
- Overall Performance Score: Some tools (like Lighthouse) provide a composite performance score (0-100). Evergreen might show such a score for each page or an average for the site. This usually encapsulates several metrics (including the above) into one grade.
In the Performance Insights section, you will likely see a list of pages with their key metrics or scores:
- Each page scanned is listed in a table or cards, showing LCP, FID (or INP), CLS, and perhaps an overall score or grade (like “Good”, “Needs Improvement”, “Poor”).
- Pages might be sorted by worst performance by default (so the slowest ones are at top needing attention).
- You might filter by template or type (e.g., see all blog pages vs all product pages) if you have many pages.
Identifying Issues and Recommendations: For each page (or for your site overall), Evergreen will highlight what factors are contributing to performance issues. Often, it will point out things like:
- Render-blocking resources (like large CSS or JS files that delay content rendering).
- Large image files that could be optimized.
- Unused JavaScript or CSS (bloating the load).
- Server response time issues (if TTFB is high).
- Lack of caching or CDN usage for assets.
- For mobile, if certain pages are especially slow on mobile devices.
Evergreen’s interface may show an expandable detail or a “View Recommendations” link next to each page’s metrics. Clicking that could list specific suggestions. For example, under a page with high LCP you might see:
- “Image X is 1.2MB, consider compressing or using next-gen formats (JPEG2000, WebP).”
- “Eliminate render-blocking resources: CSS file Y.css takes 800ms.”
- “Enable text compression (gzip) on some resources.”
Each recommendation often comes with a description of why it matters and sometimes a link to learn more (like an article on how to implement that fix).
Taking Action on Performance Insights:
- Quick Wins: Look for issues that are relatively easy to fix: oversized images, missing caching headers, etc. For many content teams, optimizing images is a straightforward task – use Evergreen’s list to find which pages have heavy images and compress or resize them.
- Collaborate with Developers: Some fixes (like eliminating render-blocking JS/CSS or server-side improvements) may require a developer’s help. The insights report is a great starting point for a conversation with your dev team. You can export or screenshot the recommendations and ask if they can implement those improvements. Because Evergreen pinpoints the files or elements causing issues, developers won’t have to guess where to look.
- Monitor Core Web Vitals: If you’ve connected Google Search Console, note that Google also tracks field versions of these metrics (real user data). Improvements you make can take time to reflect in Google’s eyes. However, Evergreen’s lab tests (which these insights likely are) give you immediate feedback. Aim to get all pages into the “Good” threshold for LCP, FID/INP, and CLS. This will likely translate to a better experience for users and better Core Web Vitals scores in the long run.
- Prioritize by Impact: Not every millisecond is equally important. Focus on pages that matter most (perhaps your homepage, high-traffic content pages, landing pages for campaigns) especially if their scores are poor. A slight delay on a low-traffic page is less urgent than a major delay on your main sales page.
- Re-test After Changes: Once you or your team have made performance optimizations, use Evergreen to re-run the performance analysis on those pages. Verify the metrics improved. It’s satisfying to see a previously red “Poor” LCP drop into the green range after fixes! It also ensures that the changes actually worked as intended.
Remember, performance optimization can be an ongoing effort. Web technology and content changes can affect speeds (e.g., adding a new analytic script might slow things a bit, publishing a blog post with many large images might hurt that page’s speed). Use Performance Insights regularly to catch regressions and maintain a fast site.
By paying attention to Evergreen’s Performance Insights, you’ll create a faster, smoother experience for your users – which often leads to better engagement and SEO benefits.
