DEV Community

Discussion on: Two lines of CSS that boosts 7x rendering performance!

Collapse
 
mnathani profile image
Murtaza Nathani

hii @blackstar1991 , i saw your fiddle, and the css that you have applied is global

this would have no effect in the optimization:

 * {
  content-visibility: auto;
  contain-intrinsic-size: 1px 5000px;
}
Enter fullscreen mode Exit fullscreen mode

as in my understanding it would render the whole page will render after checking the layout without any optimization.
In your case, if you apply the above css in your items class bl_nav__item, it could work.

P.S: this optimization is usefull if you have 1000's of record loaded at the same time and you dont want to render it all at once..

I hope i am able to understand your issue and this could be any help.

Collapse
 
blackstar1991 profile image
Andry Zirka

in my example, I wanted to show you that we got problem with hidden element on a page. jsfiddle.net/rd2b37t4/ A psevdo menu dosn't work. .btn_menu__checkbox:checked+.block_navigation dosen't work if using your ficha