Webi Blog

웹아이에서 운영되고 있는 블로그입니다.

Web/ETC

[Mac] 맥 사파리, 크롬에서 웹사이트 캐시 지우기

웹아이 2022. 4. 27. 13:40

우리가 웹사이트를 접속 할 때 서버에서 불러오는 리소스(js, css, image) 등을 파일로 저장해 두었다가 다시 접속할 때 서버에서 로딩하지 않고 캐시 파일을 불러와 사용합니다.

브라우저의 개발자 도구를 통해 확인해보면 캐시된 파일들을 확인 할 수 있습니다.

 

메모리 캐시라고 표시된 항목은 캐시된 파일입니다.

 

 

캐시를 사용할 때 장점

대부분 브라우저는 캐시 사용이 기본 사용으로 설정되어있습니다.

캐시를 사용할 경우 웹페이지에 접속할 때 마다 사용되는 리소스 파일들을 서버에서 불러오지 않고 파일로 불러오기 때문에 웹사이트 접속을 빠르게 할 수 있습니다. 캐시를 끈 상태에서 웹사이트를 이용해 보면 실제로 체감이 될 정도의 속도차이를 느낄 수 있습니다.

또한 웹사이트 운영자는 캐시로 인해 서버에서 불러오지 않는 파일은 트래픽에 영향을 주지 않기 때문에 트래픽을 절약할 수 있는 장점이 있습니다.

 

 

캐시를 사용할 때 단점

캐시를 사용하면 서버에서 파일을 불러오지 않고 저장된 파일을 불러오기 때문에 웹사이트의 수정 내용이 바로 적용되지 않는 단점이 있습니다. 실제로 웹사이트 개발을이 완료되고 클라이언트와 수정 작업을 진행 할 때 캐시 문제로 인해 수정이 안된 것 같다는 피드백을 많이 받게 됩니다. 물론 운영중인 웹사이트의 경우는 일반 사용자들도 모두 적용이 안되는 문제도 있습니다.

그래서 운영중인 웹사이트 수정 작업 시에는 캐시를 고려하여 작업을 해야합니다.

 

 

맥 사파리에서 캐시 지우기

사파리에서 캐시를 지우려면 개발자 도구 메뉴를 활성화 해야합니다.

  1. Safari > 환경설정 메뉴를 선택합니다.
  2. 고급 탭으로 이동합니다.
  3. 하단의 메뉴 막대에서 개발자용 메뉴 보기를 체크하고 창을 닫아줍니다.
  4. 상단 메뉴에서 개발자용 > 캐시 비우기를 선택

사파리 환경설정 고급 탭
메뉴 개발자용 > 캐시 비우기

 

 

맥 크롬에서 캐시 지우기

크롬에서는 다음과 같은 방법으로 캐시를 지울 수 있습니다.

  1. 상단 메뉴 Chrome > 인터넷 사용기록 삭제를 선택합니다.
  2. 캐시된 이미지 및 파일만 체크하고 인터넷 사용 기록 삭제 버튼을 클릭합니다.
    (인터넷 사용 기록, 쿠키 및 기타 사이트 데이터는 체크하시면 브라이저 이용 기록이 삭제 됩니다.)

크롬 인터넷 사용 기록 삭제 창

 

 

맥 크롬에서 일시적으로 캐시 사용 중지하기

일시적으로 캐시 사용을 중지 해 두면 매번 캐시를 지워야 하는 번거로움을 줄일 수 있습니다.

 

  1. 보기 > 개발자 정보 > 개발자 도구를 선택합니다.
  2. 개발자 도구 > 네트워크 탭을 선택합니다.
  3. 상단의 캐시 사용 중지를 체크 합니다.
  4. 개발자 도구를 그대로 둔 상태로 웹사이트를 새로고침하면 파일들이 캐시되지 않습니다. 

개발자 도구의 네트워크 탭

이미지 같은 경우는 바로 확인이 되지만 스크립트나 CSS 같은 경우 잘못써서 적용이 안되는건지 캐시때문인지 확인이 힘들기 때문에 저는 주로 개발할 때 캐시 기능을 꺼두고 작업을 합니다.

여러분들도 서버 상에 올려놓은 웹사이트를 개발 혹은 수정할 때는 캐시기능을 꺼두고 작업하시는 걸 추천드립니다.

반응형

'Web > ETC' 카테고리의 다른 글

[Mac] 맥 사파리, 크롬에서 웹사이트 캐시 지우기  (0) 2022.04.27