Frontend - 성능 측정

프론트엔드 성능측정 이유

 

아래 사진과 같이 성능에 따라서 유저들이 증가/감소 할수 있기 때문

프론트엔드에서 측정할수 있는 성능

 - 로딩
  - 첫 요소가 로드 될때까지 걸리는 시간
  - 사용자한테 의미있는 요소가 첫 로드되는 시간
  - 주요 컨텐츠가 로드되는 시간

로딩시간은 2.5초 까지가 good
4초 넘어가면 형펀없음

 - 렌더링
  - 사람이 자연스럽다 느끼는 초당화면수: 60
  - 계산해보면 한 화면이 그려지는시간: 16/ms 미만

 - 메모리
  - 메모리 누수를 막아야한다.
  - 예)전역변수, 해제되지않은 타이머, 클로저 등

성능측정하는법:

 - 실시간 모니터링 도구, 리액트 프로파일러, 크롬 라이트하우스 등

성능측정시 고려할 것들

 - 측정 환경 통일, 서비스 타켓 고려
   - 크롬 익스텐션 종료하고 실행
   - 실제 모바일이나 태블릿 등으로 테스트
 - 우리 서비스가 어떤 서비스를 제공해야하는지 이해
   - 인터렉션이 많은지, 정적인지 등등