[WICG/webcomponents] All customElementRegistry definitions to persist across page loads (Issue #1033)

One of the biggest drawbacks of using web components is the flash of unstyled content (FOUC) following the page load but prior to web components being defined. Additionally, when loading multiple web components as modules pages go through a considerable amount of cumulative layout shift as each component is defined, styles are reevaluated and layout is recalculated.

While server-side rendering is an option, it has several drawbacks:
* It requires server configuration and resources. This can be a considerable barrier to use on what is fundamentally a client-side platform feature, especially when a single component library design system is used across multiple projects under a single domain
* Some approaches move component internals outside of shadowRoot, breaking style encapsulation
* Component stylesheets have to be passed through style nodes instead of constructable/adoptable stylesheets
* It requires a hydration step on the front-end, meaning there's still a delay to interactivity for components

It seems to me all these problems could be mitigated by allowing component definitions to persist across page loads within the same domain, similar to how data can be stored client-side in sessionStorage and localStorage. In this way, a first visit to a site using web components bears the weight of LCP & CLS metrics, but each successive page load is faster as the components are reused.

-- 
Reply to this email directly or view it on GitHub:
https://github.com/WICG/webcomponents/issues/1033
You are receiving this because you are subscribed to this thread.

Message ID: <WICG/webcomponents/issues/1033@github.com>