What is shadow dom?

While creating an Angular 4 component, a shadow DOM is created by default and our template gets loaded into it. It’s a DOM element subtree which renders as part of the document but not into the present main document DOM tree. It is used by browsers to determine the rendered object on the page. JavaScript programs use it to modify content, page styling and structuring.