웹 사이트 성능 개선

웹 사이트 성능 개선

네트워크 기술이 발전하고 인터넷 환경이 좋아 지면서 웹 프로그래머들이 조금은 성능개선에 소홀하지 않나 생각이 듭니다. UI성능개선은 웹 프로그래머의 중요한 역량이자 책임이라고 생각합니다.

웹사이트 성능을 측정하는 분석도구는 많이 있습니다. 이중에서 크롬브라우저에 탑재되어있는 Audits를 활용해 보겠습니다.

 

Audits 탭

특정 URL에서 실행 화면(RUN) 아래와 같은 결과가 나옵니다.

 

개선이 필요한 주요 리스트

Enable gizp compression
javascript, css를 gzip 압축해야 한다. 웹서버에서는 gzip압축을 쉽게 지원하고 있고 대부분 브라우저는 압축을 알아서 해제해서 소스코드를 해석하여 화면에 표시. II7.X 버전은 간단한 모듈을 구성해야 합니다. II8 이후 버전은 설정에서 클릭으로 가능.

Specify image dimensions
이미지태그에 넓이와 높이값 명시 지정. 그래야 이미지를 다운로드 받는대로 빠르게 화면에 보여줄 수 있다.

Leverage browser caching
javascript, css 이미지들은 캐쉬설정. 기간이 짧아도 문제로 판단.

Optimize the order of styles and scripts
css는 HTML 내 상단에 위치, javascript 코드는 HTML 뒷부분에 위치.