[개발자 도구] TTFB(Time To First Byte)

TTFB(Time To First Byte)는 서버의 성능을 보여주는 척도로, HTTP를 요청했을 때, 처음으로 정보(Byte)가 브라우저에 도달하는 시간을 의미한다. 당연한 말이지만, SEO에 직결되고 UX적으로도 사용자가 빠르게 데이터를 확인할 수 있게 하기위해 확인해야하는 정보이다.

 

1. TTFB

TTFB는 위에서 설명한 것과 같이 웹서버의 응답을 측정하기 위해 사용한다. 좋은 사이트의 경우는 0.8s 즉 800ms 안으로 TTFB가 걸릴 수 있는 것이 좋다.

 

2. TTFB 확인하기

TTFB를 확인하는 부분은 크롬의 개발자 도구를 활용하면 간단하다. 개발자 도구의 네트워크 부분을 들어간다. 그리고 내트워크 내부에서, 아래와 같이 waterfall부분을 찾자. 

 

 

색이 있는 이쁜 컬러부분에 마우스를 올려보자. 그러면 아래와 같이 내용이 보인다.

 

 

위의 사각형 부분의 Waiting for server response 부분이 바로 TTFB 부분이다. 1.32s 가 걸린 것을 알 수 있다. 1.32s가 걸린다면, 무좋은 좋지 않을 웹사이트일까? 그렇지는 않다. 이미지도 용량에 따라서 오래걸리는 부분이 당연히 있다고 할 수 있다. 이러한 경우는 렌더링 페이지가 다 생성 후에 다중에 lazy loading 하는 방식으로 사이트를 만드는 것이 좋다.