속도 이야기를 하면 대개 숫자부터 나옵니다. 그런데 방문자는 초를 세지 않습니다. 기억에 남는 것은 기다리는 동안 무엇을 봤는가입니다. 같은 시간을 기다려도 빈 화면을 본 사람과 내용을 읽기 시작한 사람의 인상은 전혀 다릅니다.
워드프레스는 이 부분에서 불리한 도구가 아닙니다. 오히려 캐시 · 이미지 처리 · 자산 관리 수단이 잘 갖춰져 있습니다. 문제가 생기는 지점은 대개 기본값 그대로 쌓아 올린 구성이고, 그것은 고칠 수 있는 종류의 문제입니다.
기다림에는 두 종류가 있습니다
첫째는 아무것도 없는 화면입니다. 주소를 눌렀는데 흰 화면이 이어지는 시간이고, 이 구간이 길면 사람들은 사이트가 고장 났다고 판단하고 되돌아갑니다.
둘째는 흔들리는 화면입니다. 내용이 보이기 시작했는데 이미지가 늦게 도착하면서 문단이 아래로 밀리고, 폰트가 바뀌면서 제목이 두 줄에서 세 줄이 됩니다. 읽던 자리를 잃고, 누르려던 버튼이 이동해 엉뚱한 것을 누르게 됩니다. 두 번째가 첫 번째보다 인상에 더 나쁩니다 — 느린 것은 참지만 불안정한 것은 신뢰를 깎기 때문입니다.
그 시간을 무엇이 쓰나
이미지가 압도적으로 흔한 원인입니다. 카메라나 휴대폰에서 나온 원본을 그대로 올리면 화면에 표시되는 크기의 몇 배짜리 파일이 방문자에게 전송됩니다. 표시 크기에 맞춰 줄이고, 최신 형식으로 저장하고, 첫 화면 아래의 이미지는 나중에 불러오도록 두는 것 — 이 세 가지만으로 대부분 해결됩니다.
스크립트는 조금 다릅니다. 슬라이더나 애니메이션이 잔뜩 든 다목적 테마는 그 기능을 쓰지 않아도 자산을 로드하는 경우가 많습니다. 화면 하나를 그리려고 여러 개의 스크립트를 내려받는 구조라면, 그 비용은 방문자가 매번 냅니다.
웹폰트는 한글 사이트에서 특히 무겁습니다. 글자 수가 많아 파일이 크고, 늦게 도착하면 임시 글꼴에서 본 글꼴로 바뀌며 줄 수가 달라집니다. 첫 화면에 쓰이는 글자만 먼저 받도록 나누는 방법이 있고, 임시 글꼴의 크기를 실제 글꼴에 맞춰 두면 바뀌는 순간의 흔들림이 줄어듭니다.
직접 재 보는 방법 — 조건을 고정합니다
속도는 재는 조건에 따라 크게 달라지므로, 조건을 정해 두지 않으면 잰 값이 서로 비교되지 않습니다. 네 가지만 지키면 됩니다.
특히 자기 회선에서 반복해 열어 보고 판단하는 것을 조심합니다. 브라우저와 서버 양쪽에 캐시가 남아 있어 두 번째부터는 실제 방문자가 겪는 화면이 아닙니다. 처음 오는 사람의 조건으로 재야 의미가 있습니다.
손대는 순서
한꺼번에 다 고치려 하면 무엇이 효과가 있었는지 알 수 없게 됩니다. 이미지 → 쓰지 않는 기능 정리 → 캐시 구성 순서로 하나씩 손대고, 각 단계 뒤에 같은 조건으로 다시 재세요. 이 순서인 이유는 앞쪽일수록 혼자 할 수 있고 되돌리기 쉽기 때문입니다.
그리고 바뀌지 않은 항목도 기록해 둡니다. 무엇이 효과가 없었는지를 아는 것이 다음 판단을 빠르게 만듭니다.
측정과 개선의 구체적인 항목은 성능 최적화 아카이브에 정리돼 있고, 우리 사이트의 현재 상태를 스스로 확인해 보고 싶다면 무료 도구의 진단 플러그인이 출발점이 됩니다. 서버 · 캐시까지 포함한 정비를 한 번에 맡기려면 최적화 지원 사업이 전후 측정을 함께 제공합니다.