Skip to content

Instantly share code, notes, and snippets.

View trassmann's full-sized avatar
🏠
Working from home

Tormen Raßmann trassmann

🏠
Working from home
View GitHub Profile

Drawbacks of 'classical' styling approach

  • Styles are often hard to find, at least viewing another file is required
  • Classnames are inconsistent and messy, approaches have been changed over the course of development (BEM, OOCSS)
  • Dynamic styles are harder to implement, classname-switching based on props needs extra code
  • Theming conflicts are common, refactor/cleanup is very time consuming
  • Picking classnames is annoying and takes time, can even be a point of contention in code review
  • There is no easy-to-handle plugin/extension system
  • Choosing performant selectors becomes the developer's responsibility
  • Selectors based on tagName can be hard to read and can cause conflicts when changing the DOM structure
  • Overriding styles or adjusting styles is harder, as specificity needs to be increased to override properties, or the dreaded !important needs to be used