Web API HTMLElement

Creator
Creator
Seonglae ChoSeonglae Cho
Created
Created
2021 Jun 7 8:18
Editor
Edited
Edited
2022 May 12 14:7
Refs
Refs
Web API HTMLElement Properties
inert되면 overlay 생긴것처럼
 
  • testContest
  • innerText
  • innterHTML
textContent의 성능이 가장 좋은 편
notion image
 
 
당신이 innerHTML을 쓰면 안되는 이유
textContent 중심으로 본 innerHTML, innerText 와의 장단점 비교 textContent의 값은 식별자 노드의 내부 콘텐츠를 text/plain 으로 파싱(Parsing)한 결과입니다. 즉, 해당 요소 내부의 원시 텍스트(raw text) 입니다. 그래서 다른 프로퍼티들에 비해 파싱이 빠릅니다. 참고 : Node.textContent | MDN innerText 프로퍼티의 값 또한 text/plain 으로 파싱한 결과입니다. 그래서 innerText는 textContent와 혼동하기 쉬우나, 중요한 차이점이 있습니다.
당신이 innerHTML을 쓰면 안되는 이유
[스압/데이터주의] 웹 최적화 방식 모음 - 2. 파싱 및 렌더링 트리
이 파트의 핵심은 파싱의 병렬성과 렌더링에 미치는 영향이다. 크게 배치순서를 바꾸는 것과 제한, 기타 효율적 활용하는 방안으로 나눌 수 있다. 2.1.1 CSS를 상단에 배치 개요 분류: CSS HEAD에 스타일 시트를 넣으면 페이지가 점진적으로 렌더링 될 수 있어 좋다. CSSOM 트리는 CSS를 모두 해석해야 구성되고, 구성되지 않으면 렌더링이 차단되기 때문이다.
[스압/데이터주의] 웹 최적화 방식 모음 - 2. 파싱 및 렌더링 트리
 
 

 

Recommendations