sapegin / react-spaceman

React component to manage whitespace
https://sapegin.github.io/react-spaceman/
60 stars 8 forks source link

react-spaceman and serverside rendering #4

Open julius-retzer opened 6 years ago

julius-retzer commented 6 years ago

Hi again!

Since attachStyles relies on document being defined, I just realized it's currently impossible for us to use it with our CSS modules + SSR setup.

That's a major bummer because we really like it :)

We are considering making a PR but since our setup is a bit specific, maybe we would need to fork, which I would really like to avoid.

Do you have any suggestions how to approach this?

Thanks a lot a for answering these questions!

sapegin commented 6 years ago

It would be very cool to support SSR. If you have any ideas how to do it feel free to send a PR! I guess just checking for document isn’t enough ;-|

ZauberNerd commented 6 years ago

How about removing jss and just using inline styles? Or writing <style> tags yourself in the <Panel /> component? You would have a bit of duplication in the generated HTML, but I don't think that will matter much, since it is only one or two attributes per element.

sapegin commented 6 years ago

We’re not using JSS.

https://github.com/sapegin/react-spaceman/blob/master/src/styles.ts

ZauberNerd commented 6 years ago

Ah, right I only saw it in the package.json and assumed that it is being used here.

But my proposal is still valid: Don't try to deduplicate css by collecting it and using class names, but instead write either inline styles via the style attribute or inline <style> blocks.

Also: Collecting styles/classes in a module-scoped variable could potentially leak during SSR when the consumer is doing async rendering and multiple request are being handled in the same time, right?

sapegin commented 6 years ago

Don't try to deduplicate css by collecting it and using class names, but instead write either inline styles via the style attribute or inline