Google 크롬 브라우저로 트래픽/속도 측정하기

내 아임웹 사이트의 로딩 속도가 궁금할 때 Google 크롬 브라우저 개발자도구를 사용해 간단하게 트래픽/속도를 측정할 수 있습니다. 아임웹 뿐만 아니라 일반적으로 한 개 페이지가 표시되는 데 필요한 데이터 용량은 5MB 미만을 권장합니다.

만약 제작하신 사이트가 느리다고 생각되는 경우, 다음 절차에 따라 크롬 개발자도구로 내 사이트의 한 개 페이지에서 얼마나 많은 데이터가 로드되고 있는지 확인해 보세요.

측정방법

1단계: 크롬 개발자도구 열기
  1. Google 크롬 브라우저를 켭니다.
  2. 내 사이트에 접속합니다.
  3. 키보드 단축키 F12 (Mac: Option + Command +  I)를 누릅니다.
  4. 다음처럼 개발자도구가 화면 오른쪽에 나타납니다.

2단계: 개발자도구 내 'Network' 탭에서 기록 시작
  1. Network탭을 클릭합니다.

  2. 개발자도구 화면을 기준으로 왼쪽 상단 원형의 기록 아이콘을 클릭합니다. 또는 키보드 단축키 CTRL + E(Mac : Command + E)를 누릅니다.

  3. 기록이 시작됩니다.
3단계: '캐시 비우기 및 강력 새로고침'으로 사이트 다시 열기
  1. 브라우저 왼쪽 상단 새로고침 아이콘 위에 마우스 포인터를 올리고, 마우스 오른쪽 버튼을 클릭합니다.
  2. 캐시 비우기 및 강력 새로고침을 클릭합니다.

  3. 이제 해당 페이지의 트래픽/속도가 체크되어 리스트로 만들어집니다.
    주의: 반드시 캐시 비우기 및 강력 새로고침으로 페이지를 새로고침 해야 정확한 측정이 가능합니다.
4단계: 트래픽/속도 확인하기

다음의 설명을 참고해 속도를 저해하는 요소들을 확인할 수 있습니다. 여러 항목들이 있지만 주로 Name, Type, Size, Time을 통해 확인합니다. 각 항목은 마우스를 클릭해 높은 순 또는 낮은 순으로 정렬이 가능합니다.

  1. Name: 로드하는 파일의 이름이 표시됩니다. 마우스로 클릭해 이미지를 확인하거나 파일 내용을 확인할 수 있습니다.
  2. Type: 파일의 형식이 표시됩니다.
  3. Size: 파일의 크기가 표시됩니다.
  4. Time: 로드되기까지 시간이 표시됩니다.
  5. 사이트가 로드되기까지 걸리는 총 시간 및 트래픽이 표시됩니다.

위 항목들을 확인해 비정상적으로 과부하가 걸리는 이미지나 파일이 없는지 확인해 보세요. 사이트 로드 속도를 향상 시키는 여러 방법은 아래 관련 도움말을 통해 자세히 알아보실 수 있습니다.



관련 도움말

사이트 로드 속도가 너무 느리게 느껴지세요? 아래 도움말 링크로 이동해 사이트 로드 속도를 높이는 여러 방법들을 알아보세요.

사이트 로드 속도 향상 시키기

목록으로