twstyled
css-modules-typescript-loader
| twstyled | css-modules-typescript-loader | |
|---|---|---|
| 1 | 2 | |
| 46 | 198 | |
| - | 0.0% | |
| 0.0 | 0.0 | |
| over 2 years ago | 6 months ago | |
| TypeScript | JavaScript | |
| MIT License | MIT License |
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.
twstyled
-
Real-world CSS vs. CSS-in-JS performance comparison
We have a "write tachyons/tailwinds CSS-in-TypeScript" project [1] that can sit on top of any CSS-in-JS runtime (emotion and fela are both supported).
I'm hoping to eventually find one of these build-time CSS-in-JS frameworks that is smart enough to partially eval ~80% of our `
` expressions to be zero runtime.And, if/when this happens, do this as a seamless upgrade to our existing codebases, i.e. without any lines of `css={Css.m4.black.$}` in our app need to change.
Basically we're using our Truss DSL both for atomic/utility class names today + a decoupling layer to switch CSS-in-JS libs in the future if/when needed.
I think Linaria and https://github.com/twstyled/twstyled (based on/forked from Linaria) are the closest to doing this eval during compilation, but haven't had to dig in so far (runtime emotion has been fast enough for us so far).
[1]: https://github.com/homebound-team/truss/
css-modules-typescript-loader
-
SASS vs CSS Modules vs CSS-in-JS vs Compile time CSS-in-JS. Who wins?
Or for Webpack CSS Modules TypeScript loader
- Real-world CSS vs. CSS-in-JS performance comparison
What are some alternatives?
clsx - A tiny (239B) utility for constructing `className` strings conditionally.
vite-plugin-sass-dts - This is a plugin that automatically creates a type file when using the CSS module type-safely.
chakra-ui - ⚡️ Simple, Modular & Accessible UI Components for your React Applications
webpack-react-typescript
emotion - 👩🎤 CSS-in-JS library designed for high performance style composition
classnames - A simple javascript utility for conditionally joining classNames together
personal_web - Source code of my personal website: https://pustelto.com
vanilla-extract - Zero-runtime Stylesheets-in-TypeScript
typescript-plugin-css-modules - A TypeScript language service plugin providing support for CSS Modules.
extract-loader - webpack loader to extract HTML and CSS from the bundle