Document.visibilityState

Document.visibiltyState는 읽기전용 property로, 이 element가 현재 표시된 컨텍스트를 나타내는 document의 가시성을 반환한다.

document가 background 또는 보이지 않는 탭(다른 탭)에 있는지, 또는 pre-rendering을 위해 로드 된 것인지를 아는 것은 유용하다.

가능한 값은

* 'visible' : 페이지 내용은 적어도 부분적으로 보일 수 있다. 실제로 아는 페이지가 최소화 되지 않은 창에서의 선택된 탭을 의미함.

* 'hidden' : 페이지 내용은 사용자에게 표시되지 않다. 실제로 이는 docuement가 background-tap(다른탭)이거나, 최소화 된 창의 일부이거나, OS 화면 잠금이 활성 상태임을 의미

* 'prerender' : 페이지 내용이 pre-rendering되어 사용자에게 보이지 않는다. (document.hidden 목적으로 숨겨진 것으로 간주 한다.)

document는 이 상태에서 시작 될 수 있지만, 절대로 다른 값에서 이 값으로 전환되지는 않습니다. 

* 'unloaded' : 페이지가 메모리에서 로드죄지 않는다. 

 

이 property의 값이 변경되면 visibilitychange이벤트가 Document로 전송된다.

 

일반적으로 document pre-rendering시에 일부 assets의 다운로드를 막을 수 있다.

document가 백그라운드에 있거나 최소화 된 상태에서 일부 작어블 중지 할 수 있다. 

 

 

 

document.addEventListener("visibilitychange", function() {
  console.log(document.hidden);
  // 숨김 여부가 변했을 때의 행동
});