Jon Fletcher 2021-04-07

Will my CMP affect my Core Web Vitals score?

Consent management platforms are not a feature that publishers really choose to have. They are a regulatory necessity that fulfills a purpose and, frequently, are run from a third-party service. Because of this, it's easy to think of CMPs as 'outside' the regular website and not subject to the same expectations for performance and experience as actual content. 

But, because CMPs can have a significant impact on page performance, they can also have a significant effect on your Core Web Vitals score. In fact, CMPs can impact every metric - some more severely than others. 

In this post, we’re going to explain the ways your CMP can harm your Core Web Vitals scoring and best practices to make sure you still score high while complying with data and regulations.

How CMPs impact Core Web Vitals: 

CMPs are not exempt from core web vital scoring because they are a fundamental part of the page loading experience. They are one of the first elements users see, they are shown to all users, and they affect how ads and other page content is loaded as the experience continues. 
Even if your CMP is managed by a third-party it is still considered part of your page loading experience. Because third-party scripts are often built for a singular function in mind, they often affect web performance more than in-house solutions, so you may need to check your scores when running your CMP.

Test your Core Web Vitals with your CMP 

Test your Core Web Vitals with your CMP Tools such as Webpagetest enable the option to test as a visitor viewing the page for the first time so it will consider the CMP.

Here you can see that CMP is registered as a visual change in the frame, but it is not the LCP which is the title text, occurring long before the CMP is loaded. 

Once tested, you can start to see how your CMP is affecting your scores, and then begin to optimize it.

First Input Delay 

Fortunately, when it comes to first input delay consent management platforms require minimal JavaScript execution. This means they don't contribute a significant burden to first input delay. 

But, the consent managed by the CMP can impact other elements that may have a significant impact on page interactivity - namely advertising and tracking scripts.

Delay these scripts 

The best practice is to delay advertising and tracking scripts until cookie acceptance has been given. Starting the process before consent is given can lead to a 'pause' in which the main thread is occupied. Until the wrapper knows the user consent level it is unable to complete the task. This prevents user inputs being handled by the main thread, causing a long delay.

Delaying these scripts until user consent has been given can serve as a technique to decrease First Input Delay (FID).

Custom styling can bring delays 

Custom styling can bring delays Although there are not infinite styling options, most CMPs tend to load styling at the end of long request chains.

For a fast FID, long tasks need to be broken up, so adding more work to long chains can lead to poor performance.

To prevent blocks caused by long tasks, don't ship all the JavaScript to your user as soon as the first page loads. Split your bundle to prevent your styling from causing a long task that will delay the load.

Long tasks are defined as anything over 150ms as this is the point at which humans can perceive this delay as a pause. Splitting and bundling using tools like Webpack can break these up and help you prioritize the order.

Largest Contentful Paint 

Largest Contentful Paint Although consent pop-ups are singular and contained units, elements within the CMP can still be classed as the largest contentful paint. Often, this happens when there is a large block of text in the first screen of the CMP, like in this example:

To prevent this from slowing down your LCP, CMP scripts should be loaded asynchronously, by adding the async attribute to the script tag. Synchronous scripts block the browser parser which delays the page load and, in turn, the LCP score. 

It's also recommended to load the platform directly, with a script in the head tag, rather than using a tool like a tag manager. 

If the CMP is loaded from within Tag manager, it effectively hides it from the browser's lookahead function and will load it after the Javascript has executed. 

As we’ve seen from many posts on optimizing page performance, Javascript is often the enemy of speed. If your CMP features an element that can be classed as the LCP, preventing the CMP from firing until the Javascript was executed will harm your score.

Cumulative Layout Shift 

Cumulative Layout Shift Consent management platforms frequently move. This is a concern when it comes to CLS. There are some practices to do, and some to avoid, to ensure your CMP doesn’t cause too much CLS.

Top of screen consent pop-ups 

Although consent pop-ups are traditionally served from the bottom of the screen, it is possible for them to flow from the top of the screen. If this element is inserted into the DOM after the page has rendered, it will push all of the page elements below down the page, rather than flowing over them. 

This shift can be prevented by reserving space in the DOM for the consent management platform. If the pop-up is dynamic depending on factors like the locations, it’s more advisable to use a sticky footer or modal. Both of these solutions overlay the notice on top of the content rather than shifting it down or up to make space. 

Web fonts

If your CMP uses a font that has to be downloaded, it can block render and or cause layout shifts as the default font loads, the switches to the custom font. 

Add a performant CMP with Marfeel 

Your CMP should be a seamless and clear experience for your users. But, it should also not affect the performance of your site when it comes to ranking signals like Core Web Vitals. 

If you would like to find out how you can add the Marfeel CMP to your website and score high in Core Web Vitals, click here to get a demo.

Latest Articles

‹ Back to Blog Home

Get the headlines

Sign up to get the best headlines direct to your inbox

Your name
Your email