outpostHQ / numl

Atomic UI Framework based on Web Components and Runtime CSS Generation for rapidly building interfaces that follow your Design System 🌈
https://numl.design
MIT License
337 stars 16 forks source link

SSR Support #34

Closed tenphi closed 4 years ago

tenphi commented 4 years ago

Currently NuML initialize custom elements and generate CSS as soon as script is started (or init method is called). There is only one scenario where SSR works with NuML:

1) Client receive HTML 2) Client receive JS with App bundle. 3) Rehydration 4) NuML initialization

This scenario makes SSR kind of useless cause User will not get any styling.

Instead, we can split initialization of NuML into two parts and get the following scenario:

1) Client receive HTML and NuML synchronously 2) NuML generates all base CSS for elements and attributes presented in HTML 3) Client receive JS with App bundle 4) Rehydration 5) NuML initialize custom elements

Probably, this new approach will speed up current initialization without SSR and improve UX.

tenphi commented 4 years ago

it turned out that module-version of NuML is compatible with SSR (which will be an only version in v0.11). So I close this one.