futursolo / stylist-rs

A CSS-in-Rust styling solution for WebAssembly Applications
https://crates.io/crates/stylist
MIT License
373 stars 22 forks source link

Server-side Rendering #64

Closed futursolo closed 1 year ago

futursolo commented 2 years ago

This issue aims to implement server side rendering support for Stylist.

A basic approach that I think would work would be to store all styles when not used in Yew and add a method on provider that returns style tags to be inserted to headers.

For hydration, I think there could be 3 ways:

  1. affix style tags with extra information (data-stylist?) for hydration (sha256 of Sheet via std::hash::Hash?).
  2. Ignore all style tags and re-generate all style tags on client-side (With option to remove all styles tagged with something like data-stylist ="pre-rendered").
  3. Insert in place (This requires Yew support. I wish a framework-agnostic solution can be established here.)

I personally lean towards option 2 as I feel the generation of a hash only for hydration is going to be unnecessarily expensive and may be worse performance wise.

Emotion: https://styled-components.com/docs/advanced#server-side-rendering Styled Components: https://styled-components.com/docs/advanced#server-side-rendering