You get scoping and instantiation for free out-of-the-box. You get built-in methods that detect when the element enters or leaves the DOM, and when attributes on it change. Options and configs are declarative (in the HTML), not just JS. That makes it them both easier to author and easier to use differently in various places in the HTML.
With Web Components, simply including the custom element in the HTML instantiates it. And because Web Component classes happen on the HTMLElement base class, this inside your class methods is automatically scoped to the custom element.
[
add
]
[
|
|
...
]