메로그

성능 탭 화면단의 개발을 하다보면, 페이지의 동작이 어떠한 순서를 가지고 있는지, 성능이 얼마나 나오는지 확인하고 싶은 경우가 생긴다. 그럴 때는 개발자 도구의 성능 탭을 사용을 하면 되는데, 성능 탭은 자동으로 페이지를 분석하는 것이 아닌, 기록 버튼을 눌러 해당 페이지의 동작을 녹화 한 뒤, 녹화된 내용을 토대로 분석한 기록들이 나오게 됩니다. F12 를 눌러 개발자 도구를 열고 성능 탭을 누르면, 아래와 같은 화면을 볼 수 있을 것 입니다. 왼쪽 위의 녹화 표시로 되어있는 것을 누르면 페이지의 녹화가 시작되고 거기서 일어난 동작들을 분석(플로우, 렌더링 속도)합니다. 우리가 자주 쓰는 네이버 페이지에서 한 번 해보자. 녹화를 끝내면 아래와 같이 네트워크, 프레임, 기본 등등 해서 분석된 내용이 나오..