Web components

Web components are a declared standard of features that allow developers to extend the HTML structure with new elements, as well as encapsulate styles and behavior. One of the main reasons developers choose a modern component-based framework is to have the ability to decompose their app into smaller units, namely components.

Web components are comprised of key features that enable this scenario:

  • Custom elements enable extending HTML with new elements.
  • Shadow DOMs allow encapsulation of DOM and styles.
  • HTML import supports external sources.
  • HTML templates let you construct repeatable structures at will.

The fact that such capability is now met as standard can be quite revolutionary. Now one can develop such components using basic HTML, CSS, and JavaScript. The beautiful thing behind it is that it's really a standard, meaning others can use these components in any other app and any other framework they might be using.

This is certainly a good start in the right direction; however, that does not really accommodate every need to shift developers from choosing modern component frameworks. Those frameworks still provide a handful of benefits, such as data binding, component interaction, optimized rendering, and some sort of change detection or reconciliation. To emphasize, you can actually use modern frameworks to build standard web components. If you're interested in that, you can read further about Stencil, Angular Elements, and Vue CLI Web Components Build Target.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
3.12.108.175