한빛출판네트워크

제공 : 한빛 네트워크
저자 : Lara Swanson
역자 : 고미솔
원문 : Iterate on performance

당신의 사이트가 빠르게 호출되기 위해서 필요한 가장 중요한 2가지 작업은 벤치마킹과 페이지 로드 타임을 반복하는 것이다. 오늘날, 빠른 성능은 분명 좋은 일이지만 성능과 미적인 부분의 균형을 맞추고 정기적으로 체크-인을 하면 당신의 사이트는 점점 무거워질 것이다.

페이지 로드 타임을 벤치마킹

WebPagetest는 성능을 측정하기 위해 개발자들이 자주 애용하는 툴이다. URL을 이용하여 직접 들어갈 수 있고, 테스트를 하고자 하는 국가나 브라우저를 선택할 수도 있다. 테스트를 한 뒤에는 어떤 파일이나 이미지가 총 페이지 로드 타임을 오래 걸리게 만드는 지 폭포 모양의 도형으로 볼 수 있고, 특히 어떤 지점이 페이지 로드 타임이 많이 걸리는 지 알 수 있다.

YSlow와 PageSpeed도 사이트의 성능을 분석하고 개선할 수 있도록 도와주는 추가적인 툴이다. 당신이 페이지 로드 타임을 개선하기 시작했다면, 나는 문제점을 해결하기 위해 이 3가지 툴을 모두 사용해보길 추천한다.

WebPagetest를 이용하여 지금 당장 페이지 로드 타임을 벤치마킹 해보아라. 어떤 점수가 나오는가? 다른 국가에서는 어떤 결과가 나오는가? 호출하는 데 너무 오래 걸리는 시점을 넘어가거나, 콘텐츠를 막으면 어떤 이점이 있는가? 페이지 로드 타임을 개선하기 시작했다면 이러한 결과를 저장해라. 그리고 후에 결과를 비교해 보아라(WebPagetest는 최대 1년 동안 결과를 저장해준다). 계정이 있다면, 결과를 다른 사람들과 분별하고 개인적으로 저장할 수도 있다.

무거운 미학 vs. 성능

나는 가능한 한 빨리 디자인을 적용하기를 추천한다. 포토샵은 한 번 호출된 환경에서는 디자인이 어떤 영향을 주는 지 측정하기에는 다소 어렵다. 그리고 페이지를 호출하는데 얼마나 무거운지, 디자인에 대한 결정이 성능에 어떤 영향을 미치는 지 보게 될 것이다.

당신이 디자인을 바꿀 때 어떤 때는 페이지 로드 타임을 줄이는 것을 선택할 수도, 또는 디자인이 예쁘길 선택할 수도 있다. 이럴 때는 교정의 관점에서, 어떤 것이 가장 큰 효과일지를 생각하는 것이 열쇠이다. 디자인을 선택한다면, 다음 질문을 스스로에게 던져라:

• 3가지 이상의 폰트 종류가 정말로 콘텐츠에 필요한가?
• 우리가 희망하는 대로 적용하기 위한 측정 기준은 무엇인가?
• 당신의 사이트의 새로운 페이지를 시작하거나 요소를 다시 디자인하거나 개선할 때 측정 기준을 선택해라. 페이지 전환 비율, 방문 당 페이지 호출 수, 재호출 비율 등과 같은 것들이 좋은 측정 기준이다. 측정 기준 단위가 크면 약간의 성능 저하를 가져올 수도 있고, 측정 기준이 부정적으로 페이지 로드 타임에 영향을 주어 사이트 호출이 이루어 질 수도 있다.

반복

만일 성능에 좋지 않은 영향을 가져오더라도 미적 디자인을 원하는 경우, 어떤 것이 실질적으로 측정기준을 개선하는지 알기 위해 테스트를 진행한다. 그리고 이러한 테스트를 위해 현재 디자인을 반복하여 호출해라. 디자인을 새로 호출할 때 측정 기준 뿐만 아니라 성능에 대해서도 벤치마킹하고 반복하는 것을 계속해라.

페이지 로드 타임은 어떠한 알림 없이 조용히 이루어 질 수 있다. 이미지를 바꾸거나 사이트에서 지원하는 요소를 대체하는 섬세함 덕분에 말이다. 메인 페이지의 로드 타임을 정기적으로 체크해라. 그리고 가능하다면, 결과를 사용자들에게 알려라.

이러한 알림은 목표를 잡고, 이루고, 내용에 반영하는 동안 당신의 개발팀을 격려함으로써 좋은 영향을 줄 수 있다.