Hacker News Reader

Really like this as a React dev. Recently there is a trend to use inline CSS to do CSS modularization in React, but I feel it's not really a clean approach. With Shadow DOM you can mount the whole React App onto a Shadow root and have perfect CSS encapsulation. Hopefully we can see Shadow DOM supported by major vendors' stable channel soon.

View on HN

Shadow DOM is not the solution for CSS isolation for components. You'd have to mount every single component into its own shadow DOM which seems unnecessarily complex (and most likely has significant perf implications).

The answer to CSS scoping is much simpler: CSS Modules https://github.com/css-modules/css-modules

> and most likely has significant perf implications

This is true, CSS performance is better in native Shadow DOM.

No I wouldn't mount each component into a Shadow DOM. For example if I have a React App with 2 major parts developed by 2 teams, I would just mount them onto 2 Shadow DOMs so each team don't need to worry about CSS classes collisions or whatever else that's on the webpage.

Reply on news.ycombinator.com