The Sweet Spot for Web Components

Some weeks ago I encouraged to drop web components and instead write plain CSS for accessible and semantic headings in Union Investment's design system. Today I read the following post by Manuel Matuzović:

After almost a year of working with web components, I'm starting to doubt the usefulness of style encapsulation and shadow DOM in general.
Styling and some accessibility stuff is so much easier without...

His post got me thinking about where I actually see the place for web components. Turns out that finding their sweet spot is hard:

• No interactivity (like typography): too easy with (BEM-style) CSS
• Complex interactivity (like filter logic in a search): often better left to app frameworks
• Templating: better handled by a CMS or SSG

For me, web components shine where the browser fails:

• Drawers
• Tooltips
• Accordions
• Tabs
• (Dynamic) Alerts
• Switches

For everything else, I'm weighing the pros and cons and the burden of maintenance and performance-loss more than ever.