JSS has a number of performance advantages.
- Incremental compilation and rendering (as soon as needed).
- Rendered styles are cached. Compilation and DOM Rules creation happens only once.
- Only styles which are currently in use on your screen are also in the DOM (react-jss).
- Simple class selectors ensure high selectors performance at scale.
Run benchmarks locally
These benchmarks are used to ensure performance after code changes.
However, one test compiles bootstrap library from JSS JSON to a CSS string. On my machine in Chrome ~130KB JSON compiles at 180 ops/sec.
yarn yarn bench
Comparison to other CSSinJS libs
JSPerf JSS vs. CSS
JSPerf simple class selectors
JSPerf inline styles vs. classes
Inline styles are also slower because of a simple fact that same styled items (for e.g. in a list) don't share the same rule.