	Good	Needs improvement	Poor
Score	<=0.1	<=0.25	>0.25

More can be found in google the Google support document.

How to measure

The easiest way to measure the score of a page is by using the Web Vitals extension for Chrome Web Vitals.
It's also possible to get this information using the reports function in the Google Search Console. More can be found in Core Web Vitals or Google Pagespeed Insights.
AdEngine ignores all the calls from bots, so the ads are not triggered by Google Pagespeed Insights this means that the measure of CLS created by Snigel ads using this tool is impossible. You, as Publisher can confirm this by validating one of your pages and then adding the Snigel script and validating again, the scores will remain the same.

...

While this is the most extreme example, it shows how important it is to reserve this space. In the previous example, we can see the exact same ad on the same page having very different results before and after this small optimization.

What height should I reserve?

For ads with a fixed height, it's easy we need to reserve the exact height of the ads.

But when there are multiple sizes in competition, we need to adopt a different strategy; either reserve min-height to limit CLS or reserve the biggest size available.

In both situations, it's important to make sure the ads are centered, and adding a background in line with the page on these situations can also make these ads more appealing.

For the CSS it's also recommended to use media queries to mimic the size mapping and always have the best solution for each viewport and situation.

e.g.: for the placement adngin-sidebar_1-0 which will have the sizes 300x250 and 336x280 until the max-width 820px, and then additionally also have the 300x600 and 160x600 onward, we can use the following example of CSS to minimize the CLS. Any changes should be checked on staging pages first, as different values might be needed to work correctly with iei.e. parallax units.

Code Block

#adngin-sidebar_1-0 {
  position: relative;
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  height: 280px;
}
@media screen and (min-width: 821px) {
  #adngin-sidebar_1-0 {
    height: 600px;
  }
}
#adngin-sidebar_1-0 > div {
  display: inline-block;
}

...

If you don’t know the height of ads used please consult with your account manager.

What about the width? Should we also limit allocate it?

With the exception of very particular cases, it's very rare to have horizontal expansion derived from the ads, so usually, there is no need to allocate any space based on the width.

How does asynchronous and lazy loading affect CLS?

Loading the ads while the user scrolls down and reads the contents on the page, increases the ads viewability, but it also increases the chance of having page elements being pushed while visible, which will increase the CLS. For that reason, it's almost mandatory to apply the previous techniques in all the ads that can push any content in the page, to assure the best possible optimization.

How does setting a height of a placement affects parallax?

If we try to set a fixed height for an ad that will be "parallaxing", we may prevent the solution to work as intended if the wrong height is set. The solution is to only reserve the min-height, it's still recommended to review this with your account manager.