Skip to content

Commit

Permalink
docs: update
Browse files Browse the repository at this point in the history
  • Loading branch information
typicode committed Nov 18, 2024
1 parent 5a35d76 commit 30434b3
Showing 1 changed file with 14 additions and 1 deletion.
15 changes: 14 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -15,9 +15,22 @@ _What you see above is standard HTML ([data-attributes](https://developer.mozill
- 🥶 Below zero-runtime, it's zero JavaScript. Smaller bundles and faster code.
- 💎 What you write is what you get. No transformations, easy debugging.
- 🎒 Standards-based, reusable styles across frameworks, compatible with Tailwind or any CSS framework
- ⚡️ Instantly productive, no learning curve, simple onboarding.
- ⚡️ Instantly productive, no learning curve, simple on-boarding.
- 💖 Back to basics with a modern twist: access the full power of HTML and CSS, enhanced with type safety and code completion (without the complexity).

## Differences

| | CSS-in-JS | MistCSS |
| -------------------- | -------------------------------------- | ----------------------------- |
| Runtime | `~0-10 KB` | `0 KB` |
| JavaScript functions | `1 per component` | `0` |
| TypeScript code | `yes (at least for props)` | `no (generated for the user)` |
| Debugging | `react devtools` | `browser inspector` |
| Syntax highlighting | `depends (may require extension)` | `no additional extension` |
| Generated bundle | `runtime + JS functions + logic + CSS` | `CSS` |

_This is general comparison and may vary depending on the library you're using._

## Usage

Traditional approaches require wrapping your markup/styles in JavaScript functions (`Button.tsx``<button/>`, `Input.tsx``<input/>`, ...), defining props with TypeScript types, and writing logic to manage class names.
Expand Down

0 comments on commit 30434b3

Please sign in to comment.