Does the browser render elements hidden by overlay elements?

Question

css

There is a rather complicated (for rendering) page. A panel appears on top of it, covering 100% of the page with opacity: 1 (the final fade-in stage). But this panel draws another equally complex UI.
Question: will the browser burn the CPU by rendering everything that is hidden under the panel? Or do you need to cut the main content from the DOM at the time the panel is displayed? Can this be checked somehow?
Thank you!

Answer 1

Elements with "display:none;" style will not be rendered until they are called.

Answer 2

1) draws everything
2) VirtualDOM like React.