Introduce Linaria to CRA, zero runtime CSS in JavaScript

CSS in JavaScript has been getting popular these days in front end development.

styled-components is one of the most famous libraries in CSS in JS, and it brought a great DX for a lot of developers, such as name collisions and vendor prefixing out of the box. But there are some issues with performance because of its parser.

When it gets rendered, styled-components:

• Parses the components
• Generates the CSS
• Injects the CSS into the style tag in the HTML file

The whole process could make React render slower in some cases.

In fact, most apps will not even notice the performance issue unless there are a ton of components made up of styled-components.

But, if your app is getting larger and changing rapidly in UI, it should be considered.

#programming #javascript #react #reactjs #web-development