Skip to content

Instantly share code, notes, and snippets.

@ShapeLayer
Last active March 1, 2021 04:18
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ShapeLayer/76cb230d8b1c99f70fbd75e2da034e89 to your computer and use it in GitHub Desktop.
Save ShapeLayer/76cb230d8b1c99f70fbd75e2da034e89 to your computer and use it in GitHub Desktop.
전남대학교 수강신청 페이지 브라우저별 속도 분석

전남대학교 수강신청 페이지 브라우저별 속도 분석 (21학년도 1분기)

분석 환경: WebPageTest

  • Dulles, VA USA (Desktop, Android, iOS)
  • 유선 환경
  • 검사 5회 시행
  • 검사 대상: sugang.jnu.ac.kr

이 분석 결과는 참고용으로만 받아들이세요.

  • 엣지 브라우저는 크로미움 버전( 아이콘)으로 분석하였습니다.
  • 여기서 사용하는 용어는 이 페이지를 기준으로 합니다.
  • 분석 내용에 관심이 없으시면 #결론 문단으로 이동하시면 됩니다.
  • 비로그인 상태로 수강신청 사이트에 접근하여 로그인 페이지를 로딩합니다.

Document Complete

Document Complete는 브라우저가 웹사이트 로딩이 완료되었다고 인식한 시점입니다.
일반적으로 이 순간부터 흰 화면에서 페이지의 내용이 보이기 시작합니다.

대체로 크롬과 파이어폭스가 비슷한 로딩 시간을 보여줍니다.
마이크로소프트 엣지가 크롬과 파이어폭스보다 빠르게 로딩된 경우도 있지만, 불안정하게 들쑥날쑥한 모습을 보여줍니다.
IE11의 경우 다른 브라우저보다 훨씬 빠르게 페이지를 보여줍니다.

Fully Loaded

Fully Loaded는 Document Complete 이후 더 필요한 내용까지 로딩을 끝낸 시점입니다.
일반적으로 이 순간부터 웹사이트를 사용할 수 있습니다.

크롬과 IE11이 근소한 차이로 비슷하게 로딩을 끝냅니다.
파이어폭스와 엣지는 다른 두 브라우저와 큰 차이로 더 느리게 로딩되고, 엣지는 로딩 시간이 불안정한 모습을 보입니다.

페이지 추가 렌더링 시간

Fully Loaded에서 Document Complete를 뺀 값입니다.

Waterfall

크롬 파이어폭스 엣지(크로미움) IE11
로딩 파일 갯수 23 58 176 26
가장 오래 걸린 파일 폰트 폰트 폰트 폰트
가장 양이 많은 파일 폰트 폰트 스크립트 폰트

Fully Loaded가 느렸던 두 브라우저(파이어폭스, 엣지)는 로딩 파일 갯수가 다른 두 브라우저보다 많습니다.

  • 파이어폭스: 여러 종류의 폰트와 더 많은 스크립트 로딩
  • 엣지: 엣지 브라우저 전용 스크립트 로딩

결론

  • 흰 화면에서 학사 페이지로 전환되는 속도는 IE11이 제일 빨랐다.
  • 크롬과 IE11은 로딩 속도에 큰 차이가 나지 않는다.
  • 엣지 브라우저는 전용 스크립트를 로딩하기 때문에 느리다.
  • 파이어폭스는 폰트를 여러개 로딩하기 때문에 느리다.

수강신청 권장 조합:

  • 크롬 브라우저 + IE11
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment