Disadvantages of Css-in-Js ?

I am a big fan of CSS-in-JS especially styled-components but in this article i want to discuss about disadvantages of using CSS-in-JS.

Difficulty to learn for the devs who are new to react syntax.
The class names themselves are dynamically generated,…


This content originally appeared on DEV Community and was authored by sakethk

I am a big fan of CSS-in-JS especially styled-components but in this article i want to discuss about disadvantages of using CSS-in-JS.

  • Difficulty to learn for the devs who are new to react syntax.
  • The class names themselves are dynamically generated, too, essentially breaking caching as things can change between builds/renders.
  • Css-in-js parses all the style definitions into plain vanilla CSS and put everything inside style tag in index.html file. This will increase html file size.
  • Adds lots of unnecessary code while parsing to vanilla css.
  • Browser will not start interpreting the styles until styled-components has parsed them and added them to the DOM, which slows down rendering.
  • Most of the UI libraries and frameworks won't support this approach.
  • We can't use other css utilities like SCSS, LESS and PostCSS.


This content originally appeared on DEV Community and was authored by sakethk


Print Share Comment Cite Upload Translate Updates
APA

sakethk | Sciencx (2021-07-01T17:12:29+00:00) Disadvantages of Css-in-Js ?. Retrieved from https://www.scien.cx/2021/07/01/disadvantages-of-css-in-js/

MLA
" » Disadvantages of Css-in-Js ?." sakethk | Sciencx - Thursday July 1, 2021, https://www.scien.cx/2021/07/01/disadvantages-of-css-in-js/
HARVARD
sakethk | Sciencx Thursday July 1, 2021 » Disadvantages of Css-in-Js ?., viewed ,<https://www.scien.cx/2021/07/01/disadvantages-of-css-in-js/>
VANCOUVER
sakethk | Sciencx - » Disadvantages of Css-in-Js ?. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2021/07/01/disadvantages-of-css-in-js/
CHICAGO
" » Disadvantages of Css-in-Js ?." sakethk | Sciencx - Accessed . https://www.scien.cx/2021/07/01/disadvantages-of-css-in-js/
IEEE
" » Disadvantages of Css-in-Js ?." sakethk | Sciencx [Online]. Available: https://www.scien.cx/2021/07/01/disadvantages-of-css-in-js/. [Accessed: ]
rf:citation
» Disadvantages of Css-in-Js ? | sakethk | Sciencx | https://www.scien.cx/2021/07/01/disadvantages-of-css-in-js/ |

Please log in to upload a file.



There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.

Related Posts