[framework][Feature Request] Server-Side Rendering of UI5 Web Components

[ilhan007]

Background

Server-Side Rendering (SSR) is a technique in which the server generates the full HTML for a page on the server in response to navigation. This avoids additional round-trips for data fetching and templating on the client, since it’s handled before the browser gets a response(https://web.dev/rendering-on-the-web/). When it comes to web components, it means generating and serving the HTML of the web components, including shadow DOM and styles, before their JavaScript implementations have loaded and executed.

SSR can be used for a variety of reasons but performance is the most obvious one - some sites can render faster if they render static HTML first without waiting for JavaScript to load, then (optionally) load the page's JavaScript and hydrate the components.

Declarative Shadow DOM

Historically, it has been difficult to use Shadow DOM in combination with Server-Side Rendering because there was no built-in way to express Shadow Roots in the server-generated HTML. There are also performance implications when attaching Shadow Roots to DOM elements that have already been rendered without them. This can cause layout shifting after the page has loaded, or temporarily show a flash of unstyled content while loading the Shadow Root's stylesheets.

Declarative Shadow DOM removes this limitation, bringing Shadow DOM to the server - it's a