웹페이지 응답속도 측정 툴(page speed insights)

내가 쇼핑몰을 만들어 웹페이지를 제작하고 도메인을 등록하여 웹서비스를 시작한다고 가정해보자. 그때에 내가 만든 웹페이지가 얼만큼 잘 보여지고 있는지 엄청 속도가 느리지는 않는지 만든이는 알기가 어렵다. 

이때 사용할 수 있는 툴 몇가지를 소개합니다

1. Page Speed Insihgts

구글에서 제공하는 웹페이지 성능 분석 툴입니다. 말 그대로 웹페이지 상태를 분석해주는데 어느 부분을 개선해야 하는지에 대해서 알려주는 녀석입죠

네이버의 메인페이지를 분석한 결과

역시 네이버라 그런지 H로 표시된 부분은 업네요. 제안사항을 클릭하면 개선이 필요한 부분도 확인할 수 있습니다

이미지 최적화부분을 눌러보았습니다. 

저런걸하면 데이터 용량을 줄일 수 있다는군요 음.. 어떻게 줄일 수 있을까요?

위쪽에 있는 자세히 알아보기 버튼을 눌러보면 설명이 나옵니다. 물론 영어입니다. 영어는 아직은 큰맘먹고 읽어봐야해서 패스

이런식으로 웹페이지의 어떤부분이 개선이 필요한지에 대해 알려줍니다. 이 확장프로그램의 설치와 사용법은 다음과 같습니다

1-1 page speed insight 설치

먼저 크롬을 엽니다 -> 상단의 "앱"을 선택합니다 -> 앱 내용 중 "웹 스토어"를 선택합니다

검색창에 "pagespeed insights"라고 입력 후 검색합니다 -> 확장프로그램 란에 있는 항목을 + 합니다(지금은 설치되어 있어서 평가하기라고 나오는데 원래 파란색으로 "+ 무료" 로 있습니다)

-> 추가 팝업창에서 "추가"를 선택합니다

이렇게하면 설치는 끝납니다

1-2 사용법

도구 더보기 -> 개발자 도구로 들어갑니다

상단 탭에서 ">>" 부분을 클릭 -> 맨 아래 추가된 "PageSpeed" 선택

테스트하려는 페이지로 이동 -> 분석시작 클릭

위와 같은 결과가 나옵니다