서드 파티 리소스를 더 빠르게 로드하여 수익을 높이는 방법을 알아보세요.
이 우수사례는 서드 파티 리소스의 성능을 개선하여 어떻게 비즈니스 측정항목을 개선할 수 있는지에 대해 다룹니다. 이전 연구에서는 추가 광고 지연 시간의 비용을 측정했지만, 이 연구는 실제 실적 개선의 가치를 보여줍니다.
0.5%
게시자의 수익 상승도
2%
초기 광고 스크립트 로드 증가
출처: Google 내부 데이터, 2019년 6월~7월
배경
Google 게시자 태그 (GPT)는 웹에서 디스플레이 광고를 요청하고 렌더링하는 Google Ad Manager용 광고 태그 스크립트입니다. GPT에 간단한 stale-while-revalidate HTTP 헤더를 구현함으로써 GPT팀은 게시자 파트너를 위해 Google 디스플레이 광고의 속도와 실적을 개선할 수 있었습니다. 최신 코드를 로드하는 것보다 최대한 빨리 스크립트를 로드하는 것이 더 중요한 다른 시나리오에도 이와 동일한 기법을 적용할 수 있습니다.
문제
GPT는 15분의 짧은 TTL (수명)이 주어지는 부트스트랩 스크립트 gpt.js로 배포됩니다. 이 짧은 TTL을 통해 스크립트를 신속하게 업데이트하거나 롤백할 수 있습니다. 로드가 완료되면 gpt.js는 TTL이 더 긴 추가 구현 스크립트를 요청하고 로드합니다.
15분 TTL이 만료되면 캐시의 gpt.js 버전이 오래되어 다시 검증해야 합니다. 이전에는 이 재검증 프로세스에 새 스크립트 사본을 가져오기 위해 동기식 네트워크 요청을 하는 작업이 포함되었으므로 첫 번째 광고 요청에 지연 시간이 추가되었습니다.
해결 방법
stale-while-revalidate 속성은 Cache-Control 헤더에 의해 사용되며, 애셋이 비동기식으로 재검증되는 동안 캐시가 오래된 애셋을 사용할 수 있는 추가 기간을 정의합니다. 이를 통해 개발자는 즉시성(캐시된 콘텐츠를 즉시 로드하는 것과 최신 상태) 사이에 캐시된 콘텐츠의 업데이트가 향후에 사용되도록 하는 것 사이에서 균형을 맞출 수 있습니다.
Google 디스플레이 광고 우수사례
GPT팀에서는 stale-while-revalidate을 구현하는 브라우저가 있을 것으로 예상하여 2016년에 gpt.js HTTP 응답에 다음 Cache-Control 헤더를 추가했습니다.
cache-control: private, max-age=900, stale-while-revalidate=3600
이 설정은 이전에 캐시된 값 이후 15~60분 사이에 gpt.js이 요청되면 캐시된 값이 오래되었더라도 요청을 처리하는 데 사용됩니다. 동시에 백그라운드에서 재검증 요청이 이루어지며 나중에 사용할 수 있도록 캐시를 새로운 값으로 채웁니다.
Chrome은 버전 75에서 전체 트래픽의 99% 에 stale-while-revalidate를 출시했으며, 이 기능이 일시적으로 사용 중지된 트래픽의 1% 는 영향을 측정하기 위해 남겨두었습니다. GPT팀은 광고 스크립트에서 stale-while-revalidate의 효과를 테스트하기 위해 이 1% (실험 그룹) 및 이 기능이 사용 설정된 트래픽 (통제그룹) 1% 의 트래픽 샘플을 기록했습니다. 2주 동안 Google 디스플레이 광고 노출수 52억 회에 해당하는 표본 크기에서 기록된 측정항목을 통해 대조군에서 관찰한 내용은 다음과 같습니다.
- 광고 노출수 0.3% 증가
- 수익 0.5% 증가
- 초기 광고 스크립트 로드 2% 증가(페이지 로드 시작 후 500ms 미만)
- 전반적으로 성공적인 광고 스크립트 로드가 1.1% 증가했습니다.
위 차트에서 볼 수 있듯이 이 실험의 결과는 성공적인 광고 스크립트 로드의 증가로 인해 발생할 수 있으며, 대부분의 경우 페이지 로드 프로세스 초기에 발생합니다.
사이트에서 재검증 중 비활성 기능 구현
GPT팀은 stale-while-revalidate를 사용하여 HTTP 헤더를 비교적 간단하게 변경하면 속도가 향상되고 비즈니스 측정항목이 향상될 수 있음을 확인했습니다. 사이트에서 stale-while-revalidate를 구현하는 방법에 관한 자세한 내용은 유효하지 않은 콘텐츠를 재검증하는 동안 최신 상태로 유지하기 게시물을 참고하세요.