In this article, we'll explore website redirects and their impact on performance. Redirects add steps that can delay page loading, affecting user experience and Core Web Vitals. Optimizing redirects ensures faster browsing for your visitors.
What are website redirects?
Website redirects are instructions that automatically send users and search engines from one URL to another. Redirects are commonly used when web pages are moved, URLs are updated, or domains change. Redirects ensure that visitors reach the intended page, even if they access an outdated or incorrect URL.
Redirects are typically associated with HTTP 3xx status codes, such as 301 (Permanent Redirect) or 302 (Temporary Redirect), indicating that the requested resource is available at a different URL.
While redirects are useful for maintaining user experience and SEO, excessive or poorly configured redirects can slow down page loading and create redirect chains.
In this example we have created several redirects to show the potential impact of redirects for a visitor.
When a redirect occurs, the browser receives a response with a 3xx status code, including a Location header indicating the new URL. The browser then makes a second request to fetch the content from this new address. Here we can see there are three redirects before arriving at the HTML request.
Because of these redirects, the HTML request starts at 1.89 seconds after the initial navigation. Adding a significant delay to the user, as the browser resolves the redirects to send the visitor to the intended page.
Clicking into the request provides more information about the redirect including the 3xx status code and location.
Do redirects impact Core Web Vitals?
Redirects have a direct impact on the page load. As redirects have to occur before the HTML document can be loaded, this will delay First Contentful Paint (FCP) and Largest Contentful Paint (LCP) milestones. We can see an overview of the impact as redirects are included in the LCP image discovery.
This website has permanently changed their URL, visiting the old URL https://lohika.com means an instant redirect to: www.capgemini.com/software-engineering/.
There is then a second redirect to: https://www.capgemini.com/solutions/software-engineering/
Once this redirect has completed the visitor is then finally redirected to the intended page: https://www.capgemini.com/services/intelligent-industry/intelligent-products-services/software-product-engineering/
When adding up the duration for these redirects, there is a total duration of 872 ms before the HTML request can begin. The LCP has a request start time of 1.03 seconds due to the combined redirects. With a good LCP score needing to be under 2.5 seconds, these redirects are taking up a significant portion of the LCP budget.
If we test the final URL directly, there is an improvement in the page load. The LCP image has a request start time of 854 ms.
Both the FCP and LCP scores have improved as the wait time caused by the redirects is now no longer there. With the LCP score improving by over 1 second.
Detect redirects with the Avoid Multiple Page Redirects Lighthouse audit
As we know, website redirects can have an impact on performance. Any website redirects are detected by Lighthouse as part of the page test audit.
When entering a URL to test on PageSpeed Insights, Google will usually run the test to the final URL to test the page directly. In this case a notification will appear at the top of the page. With an option to run the test as originally intended by clicking Run with original URL.
Running the test shows which redirects occur when visiting the URL. We can see this information in the performance diagnostics section of the Lighthouse report.
The report also highlights the potential savings of removing these redirects. Here we can see an estimated saving of 1,990 ms.
How to fix multiple page redirects
Once a redirect has been identified you can begin to resolve the issue. Update the redirect so users are sent immediately to the final destination URL.
In the previous example we saw https://luhika.com redirecting three times to the final URL of https://www.capgemini.com/services/intelligent-industry/intelligent-products-services/software-product-engineering/. Instead the initial HTTP response should send visitors straight to the final page. Once replaced, you can monitor the page to ensure that the redirects are no longer persisting and that each visit is direct and final.
You can also update your own content to link to the new URL directly. That way not even a single redirect is required. Unfortunately this won't work for content on other website, so there'll still be one URL redirect involved.
Measuring the impact of redirects on real user Core Web Vitals
Adding the Full Time To First Byte (TTFB) metric to the DebugBear dashboard can help with finding regressions potentially caused by redirects. Performance Budgets can be set up to catch any TTFB regressions automatically.
Redirect are also included in the Google Chrome User Experience Report data that impacts SEO. You can track this data in the CrUX trends dashboard.
Real User Monitoring
Using a Real User Monitoring (RUM) tool can highlight the impact of redirects for real visitors to your website. These can be found in the More Metrics tab and the TTFB components section.
Some notable metrics to look out for are TTFB Wait and TTFB Redirect.
There are different types of redirects which have different browser security measures: same origin redirects and cross origin redirects.
- Same origin redirects: Both URLs share the same https protocol. These redirects maintain the context of the request, such as cookies and authentication headers. These are straight forward and are reported as Redirect time.
- Cross origin redirects: This category represents redirects from one website domain to another, meaning the protocol, hostname, or port changes. Cross-origin redirects trigger stricter security measures, so they can only be attributed to generic "Wait" time.
Conclusion
Monitoring TTFB and reviewing request waterfalls helps evaluate the effect of redirects on user experience and identify areas for optimization.
By addressing excessive redirects, developers can improve page load times. Enhancing Core Web Vitals scores to ensure a smoother experience for users.
Monitor Page Speed & Core Web Vitals
DebugBear monitoring includes:
- In-depth Page Speed Reports
- Automated Recommendations
- Real User Analytics Data