메인 항목으로

페이지 생명 주기 API

페이지 라이프 사이클 주요 이벤트(load, unload, pageshow, pagehide)

chrome_8NS5zpKeaB.png출처 : https://developer.chrome.com/docs/web-platform/page-lifecycle-api

  • load : 페이지의 모든 콘텐츠(이미지, CSS, 스크립트 등 종속 리소스 포함)가 완전히 로드되면 발생
  • unload : 페이지가 언로드될 때 발생. 단 unload 이벤트가 항상 발생한다고 신뢰할 수 없으며 사이트 성능에 부정적인 영향을 줄 수 있어 지원 중단 예정
  • pageload : load 이벤트 직후 또는 페이지가 bfcache(뒤로/앞으로 캐시) 에서 복원될 때 발생.
  • pagehide : 페이지가 언로드되거나 브라우저가 페이지를 bfcache(뒤로/앞으로 캐시) 에 넣으려고 할 때 발생

unload 이벤트 지원 중단 이유

  • 모바일 브라우저에서 다른 앱으로 전환하거나, 탭을 백그라운드로 보내질 때, 앱 관리자에서 브라우저를 강제 종료할 때에 unload 이벤트가 발생하지 않는 경우가 많다.
  • bfcache (뒤로/앞으로 캐시) 사용을 방지하여 사이트 성능에 부정적인 영향을 미친다.
  • 예기치 않은 브라우저 종료, 시스템 충돌, 또는 탭이 강제로 닫히는 경우 unload 이벤트가 발생하지 않을 수 있다.