"동일한 유형의 웹 구성 요소에서 스타일 공유"

Question

올바르게 이해하면 웹 구성 요소의 인스턴스를 만드는 것이 섀도우 루트를 만들고 마크 업을 복사하는 것과 같이 요약 할 수 있습니다. 템플릿에 CSS 태그가 포함되어있는 경우 물론 템플릿에도 CSS 태그가 복사됩니다. 따라서 웹 구성 요소의 내부 마크 업에 속한 스타일 범위를 지정할 수 있습니다.

질문 : 내가 바로 그 웹 구성 요소의 인스턴스의 톤을 만들 때 스타일이 바로 복사하지 재사용 같이이

1. 그것은 어떤 성능에 영향이 있습니까?
2. 같은 웹 구성 요소 인 의 여러 인스턴스에서 스타일 노드를 공유 할 수있는 방법이 있습니까?

Answer 1

성능에 미치는 영향이 있습니까?

예, 브라우저에 구현 된 CSS 엔진과 인스턴스 수에 따라 다릅니다. 모든 유스 케이스를 테스트하고 메모리 사용량 대비 속도를 고려해야합니다.

동일한 웹 구성 요소의 여러 인스턴스에서 스타일 노드를 공유 할 수있는 방법이 있습니까?

예, @import urllike in this SO question을 사용할 수 있습니다. 또는 그림자 DOM을 사용하지 않고 전역 CSS 스타일 만 사용하도록 선택할 수 있습니다.