Broken Resources Detected by Real Users
Broken resources, in the context of Real User Monitoring (RUM), are assets (images, JavaScript, CSS, fonts) that fail to load correctly for your real website visitors. These errors can significantly degrade user experience and negatively impact your website's performance.
Types of Broken Resources
PerfBee's RUM feature monitors for several types of broken resources:
- Images: Missing or incorrectly linked image files.
- Scripts: JavaScript files that fail to load, potentially breaking functionality.
- Stylesheets: CSS files that fail to load, leading to incorrect styling.
- Fonts: Font files that fail to load, causing fallback fonts and impacting design consistency.
How PerfBee Detects Broken Resources
PerfBee's RUM implementation uses a lightweight JavaScript snippet installed on your website. This snippet captures resource load failures via the browser's PerformanceObserver and error events. This allows PerfBee to identify resources that are failing to load for your real users.
Broken Resources List
Within the RUM dashboard, you'll find a list of broken resources, including:
- URL: The exact URL of the broken resource.
- Type: The type of resource (image, script, stylesheet, font).
- Count of Affected Sessions: The number of user sessions where the resource failed to load.
Why Broken Resources Matter
Broken resources cause a poor user experience. Missing images, broken layouts, and non-functional features frustrate users and can lead to higher bounce rates and lower conversion rates. Broken resources also impact performance by preventing the browser from rendering the page correctly, leading to slower page load times and lower Core Web Vitals scores like Largest Contentful Paint (LCP).
How to Fix Broken Resources
Addressing broken resources is crucial for improving user experience and performance. Here's how to fix them:
- Identify the Broken Resource: Use the PerfBee RUM dashboard to identify the specific URLs of broken resources.
- Verify the URL: Double-check the URL for typos or incorrect file paths.
- Update the URL: If the resource has moved or the URL is incorrect, update the link in your website's code.
- Remove the Resource: If the resource is no longer needed, remove the link from your website.
- Test the Fix: After making changes, revisit the RUM dashboard to confirm the issue is resolved.
Difference from Site Crawler Broken Link Detection
While the PerfBee Site Crawler also detects broken links, RUM provides a different perspective. The Site Crawler crawls your site and identifies broken links by simulating user behavior. RUM, however, detects broken resources encountered by *real* users. This is crucial for catching issues that might only appear under specific conditions (e.g., after a CDN change or asset deletion) or for specific user segments. The RUM data can complement the Site Crawler data to give a full picture of your website’s resource health.
For more information, see the PerfBee Documentation.