Cumulative Layout Shift (CLS) issues with sticky bar – findings and feedback

Support
#1

Hi everyone,

I wanted to share an issue I encountered with sticky bars in the Pro theme , in case it helps others — and I’d be happy to hear any feedback or recommendations from the community or Themeco team.

Context:

I’m currently working on optimizing Core Web Vitals , especially the Cumulative Layout Shift (CLS) score.
My site uses two top bars (a header and a secondary bar), both configured as sticky using Pro’s native tools.

What I observed:

  • With “Starts Fixed” enabled , I was getting very high CLS values (above 0.4).
  • After disabling this option on both bars , the CLS dropped to 0.001 :white_check_mark:
  • So the issue was not caused by having two sticky bars, but rather by the “Starts Fixed” behavior itself .

Current result:

With both bars set to sticky but without “Starts Fixed” , metrics are now stable.
The only remaining side effect is a small visual jump when scrolling starts , likely due to the bars switching from static to sticky without reserved height.

My questions:

  1. Has anyone else experienced similar behavior?
  2. Is there a recommended way to keep “Starts Fixed” without causing layout shifts ?
  3. Does Themeco have any best practices for preventing CLS in sticky headers (reserved height, preload strategies, etc.)?

Thanks in advance for any insights or suggestions!

Best,
Jean loup

#2

Hi Jean,

Thank you for sharing your findings — that’s very insightful.

We have tested similar configurations with Sticky bars and the Starts Fixed option enabled, but haven’t encountered the same level of CLS impact. It’s possible that specific layout or content factors are contributing to the shift in your case.

If you’re able to share a URL or staging link where the issue can be reviewed, we’d be happy to take a closer look and investigate further.

Thanks