[✨] option to disable CLS warn

[genox]

Is your feature request related to a problem?

Not related to an issue.

Describe the solution you'd like

I would much prefer the display of borders around objects to be opt-in, rather than a default.

flag in the Vite config?

Describe alternatives you've considered

there are no alternatives.

Additional context

When working on a design, having random red borders pop up doesn't help much and is distracting.

I get why it is there and I am sure it is a great way to diagnose slow speeds or layout jiggling, but it should be up to me wether I am in debug mode or wether I just want to focus on design.

At least in my case, they are not consistent either, sometimes a block is affected, sometimes not. This is visually very annoying.

[jessezhang91]

We just ran into this as well and I just put up a PR with this flag.

[Hades32]

This is the first and ONLY match on Google when searching for "quick cls". These even appear when just playing with the sample code and it's really not obvious what's going on...

[wmertens]

Is this still problematic?

[genox]

Generally speaking, I wholeheartedly support the nudge to think about optimization and CLS is ugly and preventable, no doubt about that. Still, I like to have some level of control over this, as I prefer to decide myself when in the process I will take care of an optimisation issues.

Like with the useVisibleTask$ discouragement: Yes, I know it can be bad and it is a last resort but there is also the fact that I might not have the time to tackle each case right now and for that, I can disable the eslint warning on case by case basis. It is up to me, it is my responsibility in the end.

Real world example: I wrote a 24k loc qwik frontend for ecommerce and it gets complicated.. I resorted to useVisibleTask in 2-3 places because it was the only way to get a feature working for now. I am perfectly aware that it is discouraged, but I also have a deadline and need to move on and decide to come back later and a solution might very well cause a medium sized refactoring that simply isn't possible right now.

There are also some complicated grid views and a few generated responsive pages for which I currently do not have a solution on how to handle some limited cls issues. Same thing: I just dont have the time right now and there are other priorities.

The thing is, in the end, the functionality and the resulting app still works perfectly fine but Qwik makes the assumption that everybody is chasing metrics at all times.

The only thing I am asking is to have an option to decide myself. On the other hand, as humans do, I also became quite efficient at simply accepting the fact that there are some exclamation marks and I have more important things to solve for the time being, so I just move on. :-)

[wmertens]

I suppose we can have an option to disable it in the qwik vite plugin. PRs welcome

[gioboa]

Closed by #6450

[shairez]

@gioboa are you sure it's handling the CLS issue and not just the images?

[gioboa]

I linked the wrong PR. Here you are #6427

[shairez]

thanks!