Why We're Breaking Up with CSS-in-JS

Hi, I'm Sam — software engineer at Spot and the 2nd most active maintainer of Emotion, a widely-popular CSS-in-JS library for React. This post will delve into what originally attracted me to CSS-in-JS, and why I (along with the rest of the Spot team) have decided to shift away from it. We'll start with an overview of CSS-in-JS and give an overview of its pros & cons. Then, we'll do a deep dive int

[uehaj]

CSS-in-JS libraries that convert your styles to plain CSS at compile time. These include: Compiled Vanilla Extract Linaria These libraries purport to provide a similar benefits to runtime CSS-in-JS, without

[efcl]

CSS-in-JSのランタイムパフォーマンス問題についての記事。

[mizdra]

emotion のメンテナーによる CSS-in-JS の長所・短所について。CSS-in-JS はランタイムのバンドルサイズや CSS のシリアル化にコストが掛かる / CSS Modules はビルド時のアプローチなのでそうしたコストが掛からない、という主張。

[arark]

CSS-in-JSはDXは良いがパフォーマンスがよくないという指摘。良DXかつ高速なスタイリングのためにCSS Modules+Utility classにのりかえたというレポート。