CSS classes are generally better for performance than inline styles.
The inline styling concept might not help you to build the best React components in your app. If you're planning to build a very performant, scalable, and rich application inline styling is not the right option for you.
Yes, inline styles are technically faster than an external stylesheet because you are making one less request on top of the page but using an external stylesheet is much preferred for code maintainability.
Inline CSS means that the CSS is loaded in the <head> tag of the site's HTML. This is faster than the visitor having to download the CSS files directly from the server; however, if all the site's CSS is displayed inline it can actually slow down the load time of the entire site.
Does the ReactJS virtual DOM make your app faster if you put all CSS as inline style? VS using raw .css files?
http://facebook.github.io/react/tips/inline-styles.html
Also see this ReactJS presentation on CSS in JavaScript: https://speakerdeck.com/vjeux/react-css-in-js
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With