Cache Busting 이란
Cache Busting이란 무엇이고, 왜 발생할까?
https://www.keycdn.com/support/what-is-cache-busting
정적 파일을 빠르게 제공하기 위해 고려할 수 있는 여러 방법 중 하나는 캐시이고, 실제로 많은 서비스들에서 빠르게 정적 파일을 제공하기 위해 캐싱을 사용한다. 정적 파일이 캐시되는 케이스에서는 캐시가 만료되기 전까지 해당 파일은 오랜 기간 동안 저장될 수 있다.
사이트를 업데이트할 경우에는 캐시된 버전의 파일이 사용자의 브라우저에 저장되어 있기 때문에 사용자는 변경한 내용을 즉각적으로 볼 수 없다. 웹 사이트가 브라우저 캐시를 기본적으로 사용하도록 구성되어 있기 때문에, 사용자의 브라우저가 정적 리소스의 캐시된 복사본을 로컬에 저장하기 때문이다.
Cache busting은 유니크한 파일 버전 식별자를 사용하여 브라우저에게 새 파일 버전이 가용하다는 것을 알려줌으로써 브라우저 캐시 이슈를 해결한다.
왜, 그리고 어떻게 Cache busting을 사용할까?
Cache busting은 사용자들에게 가장 최근에 업데이트된 파일을 받도록 허용하여 브라우저 캐시를 비우는 강력 새로고침을 하지 않아도 되기 때문에 유용하다. 개발자의 관점에서 바라보면 cache busting을 사용하는 것은 가장 최근의 변경 사항이 실제로 모두에게 보여지게 될 것이기 때문에 좋다.
Cache busting을 사용할 수 있는 몇 가지 방법들은 아래와 같다.
- 파일 이름 버저닝 (
style.v2.css) - 파일 경로 버저닝 (
v2/style.css) - 쿼리 스트링 (
style.css?ver=2)
Cache busting을 사용할 때에는 파일 이름 버저닝과 파일 경로 버저닝을 사용하는 것이 권고된다. 캐싱 메커니즘을 방해하지 않으면서도 변경된 파일을 쉽게 반영할 수 있기 때문이다.
하지만 쿼리 스트링 방법은 몇 가지 캐싱 이슈를 일으키는 것으로 알려져 있다.
- 어떤 프록시나 CDN들은 쿼리 스트링이 포함된 파일을 캐시하지 않고, 사용하지 않는 것을 권고한다.
- 사이트에 대한 속도 테스트를 수행할 때 쿼리 스트링들을 삭제하는 것이 권고된다.
따라서 cache busting을 사용할 때에는 파일 이름이나 파일 경로 버저닝을 사용해야 한다.
둘 중 어떤 방법을 사용하더라도, 파일 이름이나 경로가 변경된 이후에는 해당 참조를 사용하는 HTML 파일 또한 업데이트해야 한다는 것을 잊지 말아야 한다.
CDN을 통해 Cache busting 사용하기
파일 이름이나 경로 버저닝을 통해 사용한다면 CDN을 cache busting과 함께 사용할 때 따로 설정할 것이 없다.
하지만 쿼리 스트링을 사용해서 cache busting을 사용한다면 몇 가지 옵션들을 설정해야 한다.
쿼리 스트링을 사용한 cache busting을 사용한다면 CDN에게 해당 요청 안에는 어떤 쿼리 스트링도 존재하지 않는 것처럼 보라고 미리 말해줘야 한다. 그렇지 않으면 CDN이 쿼리 스트링이 변경되어도 캐시된 버전의 리소스를 반환할 것이기 때문이다.
해당 설정이 꺼져있다면 CDN은 모든 쿼리 스트링 바리에이션에 대해 각각 별도의 파일로 보게 된다.
예시
- CSS 파일이 있고, 해당 타입의 파일은 1년 이후에 만료되도록 설정했다고 가정하자. 이 말은 곧 이 파일이 한번 사용자의 브라우저의 로컬에 캐시된 이후에는 1년 동안 오리진 서버에 대해 업데이트가 있는지 체크하지 않겠다는 의미이다.
- 3달 후에
style.css파일을 수정해야 하는 일이 생겼다. 변경 사항을 만들고 서버에 동일한 이름으로 재업로드하면 브라우저는 차이를 알아채지 못하고 원래 자신이 가지고 있던style.css파일을 서빙한다. - Cache busting을 사용하면
style.v2.css와 같은 다른 이름의 파일을 재업로드하게 될 것이다. 때문에 한번 페이지의 HTML 파일을 수정 사항을 반영하도록 수정하면 브라우저가 새로운 파일을 받아야 한다는 것을 그제서야 알게 되고 새롭게 업데이트된 파일을 받아 사용한다.