In the long term, CSS, LESS and SASS are dead. To keep this project on the bleeding edge, we should drop SASS support in favor of inline styles.
I think the case is made pretty strongly in these three presentations.
| Christopher Chedeau | Michael Chan | Colin Megill |
|---|---|---|
 |
 |
 |
Clearly this is the direction in which web development is moving.
At the moment, all the inline CSS libraries suffer from some or all of these problems:
- Client side only
- No vendor auto prefixing (requires
User-Agentchecking on server side) - No server side media queries, resulting in a flicker on load to adjust to client device width
Ideally, a library would allow for all the benefits of inline calculable styles, but, in production, would allow some generation of a CSS block, with media queries to handle device width conditionals, to be inserted into the page with a <style> tag, and then each element that was using a style that was dependent on a media query would have a class name generated.
This is a list of possible style libraries that we could implement into this project.
- Radium
- React-JSS
- jsxstyle
- css-modules
- babel-plugin-react-autoprefix
- babel-plugin-css-in-js
- Add more if you know of others.
Users and contributors to this project should periodically go through this list and see if any of them have developed features that make them really worthy of server side rendering in a production environment.