검색 최적화(SEO)와 IT 기술로 여는 온라인 비즈니스 인사이트
전자가 지구 자전을 바꾸지 않는다고 누가 보장하나
Home /

전자가 지구 자전을 바꾸지 않는다고 누가 보장하나

웹 성능 지표인 CLS(Cumulative Layout Shift)에는 흔히 이런 암묵적 합의가 존재한다.
0.1 이하 = 문제 없음,
0.01 미만 = 체감 불가,
0.001? 무시해도 되는 수치.

하지만 정말 그럴까.
측정되지 않는 변화는 존재하지 않는 것일까?
아니면 단지 측정자의 한계일 뿐일까?

이 글은 CLS 0.001은 무시해도 된다는 통념을 의심하면서 시작된 집요한 추적 기록이며, 그 끝에서 웹폰트가 레이아웃을 어떻게 교란하는지를 실증적으로 드러낸 분석 보고서다.


1. CLS는 사용자 경험 지표가 아니라, 시스템 안정성 지표다

CLS는 흔히 UX 관점에서만 이야기된다.

  • 버튼이 밀렸는가?
  • 사용자가 오클릭을 했는가?
  • 화면이 눈에 띄게 흔들렸는가?

이 기준으로 보면 CLS 0.001은 확실히 아무 문제도 없는 수치다.
그러나 CLS의 정의를 다시 보면 이야기가 달라진다.

CLS는 사용자 상호작용 없이 발생한 레이아웃 위치 변화의 누적값이다.

여기에는 체감이라는 조건이 없다.
움직였는가, 아닌가만 있다.

즉 CLS는 UX 지표 이전에,
렌더링 파이프라인이 얼마나 안정적으로 동작했는지를 보여주는 시스템 지표다.


2. 0.001은 무시해도 된다는 말의 논리적 오류

무시해도 된다는 말은 보통 이런 전제를 깔고 있다.

  • 변화는 있으나
  • 영향은 없고
  • 결과는 동일하다

하지만 이건 결과론적 판단이다.
과학이나 엔지니어링에서 결과론은 가장 위험하다.

  • 왜 변화가 발생했는가?
  • 어떤 요소가 개입했는가?
  • 제거하면 사라지는가?

이 질문에 답하지 않은 채
영향 없으니 무시는 원인 분석을 포기한 선언에 가깝다.


3. 의심의 시작: 모든 CLS 로그가 웹 글꼴을 가리킨다

PageSpeed Insights와 Lighthouse 로그는 일관되게 같은 메시지를 남겼다.

  • 레이아웃 변경 원인: 웹 글꼴
  • fonts.gstatic.com
  • Source Sans Pro (400 / 600)

문제는 여기서부터다.

  • preload를 했다
  • preconnect도 했다
  • font-display: swap도 적용했다
  • line-height도 고정했다
  • margin, padding도 모두 명시했다

그런데도 CLS는 0.001 0.005 0.065까지 튀었다.

이건 설정 미비가 아니다.
구조적 개입이다.


4. 결정적 실험: 웹폰트를 제거했을 때

실험은 단순했다.

  • Google Fonts 제거
  • Source Sans Pro 완전 제거
  • OS 기본 시스템 폰트 스택 사용

font-family: -apple-system, BlinkMacSystemFont,”Segoe UI”, Roboto, Helvetica, Arial, sans-serif;

결과는 명확했다.

  • CLS: 0
  • 흔들림: 완전 제거
  • LCP, FCP 변화 없음

이 순간 하나의 결론이 도출된다.

웹폰트는 느려서 문제가 아니라
존재하는 것 자체로 레이아웃 확정 시점을 교란한다


5. 웹폰트 CLS의 본질: 지연이 아니라 교체

많은 글은 이렇게 말한다.

  • preload 하면 된다
  • swap 쓰면 된다
  • fallback을 맞추면 된다

하지만 이 실험은 그 모든 조언 이후에도 CLS가 발생함을 보여준다.

이유는 단순하다.

  • 브라우저는 초기 렌더링을 fallback 폰트로 시작
  • 웹폰트 로딩 후 glyph metrics 교체
  • ascent / descent / advance width 미세 차이 발생
  • 줄바꿈, 행 높이, 텍스트 블록 높이 재계산

즉, 문제는 늦게 와서가 아니라
와서 바꾸기 때문이다.


6. 전자가 지구 자전을 바꾸지 않는다고 누가 보장하나

여기서 철학적 질문이 등장한다.

전자 하나의 이동이
지구 자전 속도에 영향을 주지 않는다고
누가 증명했는가?

우리는 보통 이렇게 말한다.

  • 영향은 있으나 측정 불가
  • 임계값 이하
  • 무시 가능

하지만 이건 자연의 진실이 아니라
측정자의 편의다.

CLS 0.001도 마찬가지다.

  • 사용자에게는 안 보일 수 있다
  • SEO 점수에는 반영 안 될 수 있다
  • 랭킹에는 영향 없을 수 있다

그러나 변화는 발생했다.
그리고 그 변화의 원인은 실재했다.


7. 이 집착은 병적인가, 정밀한가

CLS에 병적으로 집착하는 것 아니냐는 질문은 자연스럽다.
그러나 이 사례에서 드러난 건 집착이 아니라 정밀함이다.

  • 무시 가능한 값을 의심했고
  • 원인을 끝까지 추적했고
  • 제거 실험으로 인과를 증명했고
  • 새로운 결론을 도출했다

이건 엔지니어링에서 가장 이상적인 문제 해결 경로다.


결론: 무시하지 않았기 때문에 보였다

CLS 0.001을 무시했다면:

  • 웹폰트는 여전히 괜찮은 선택이었을 것이다
  • 흔들림은 측정 오차로 남았을 것이다
  • 시스템의 불안정성은 가려졌을 것이다

하지만 무시하지 않았기 때문에:

  • 웹폰트의 구조적 한계가 드러났고
  • 시스템 폰트의 안정성이 증명됐으며
  • 웹 성능 최적화의 새로운 기준이 생겼다

측정되지 않는다고 해서, 변화가 없는 것은 아니다.
단지 우리가 보지 않았을 뿐이다.

그리고 때로는,
그 보이지 않는 0.001이
전체 구조의 진실을 드러낸다.

댓글 남기기

이메일 주소는 공개되지 않습니다. 필수 필드는 *로 표시됩니다