피크 성능을 위해 웹 사이트를 캐시하는 방법 : 웹 캐싱에 대한 초보자 안내서

웹 사이트를 캐시하는 방법을 배우는 것이 필수적입니다. 캐싱은 웹 사이트 성능, 사용자 경험 및 SEO에서 중요합니다. 이를 구현하는 몇 가지 방법이 있으며이 게시물에서 모든 것을 배울 것입니다.

아래에서는 캐싱이 무엇인지, 작동 방식, 이점 및 존재하는 다양한 유형에 대해 설명합니다. 그 후, 우리는 귀하의 웹 사이트에 캐싱을 가능하게하는 데 사용할 수있는 세 가지 다른 방법과 사례 연구를 통해 성능에 미치는 영향을 지적합니다. 마지막으로, 웹 사이트 캐시를 지우는 방법과 이유를 신속하게 다룰 것입니다.

캐싱이란 무엇입니까?

가장 기본적인 수준에서 캐싱은 캐시 (임시 스토리지 위치)에 파일 사본을 저장하여 빠른 액세스를 이용할 수 있도록하는 것을 의미합니다. 브라우저, 프로그램 및 운영 체제를 포함하여 많은 소프트웨어 및 기술 분야에서 사용되는 방법입니다.

웹 사이트는 다양한 유형의 파일로 구성되므로 캐싱에도 완벽하게 적합합니다. 사이트의 HTML, CSS, JavaScript 및 이미지 파일을 저장하여 브라우저가 더 빨리 액세스하고 웹 사이트를 더 빨리 표시 할 수 있습니다.

일부 유형의 콘텐츠는 다른 유형보다 캐싱에 더 적합합니다. 예를 들어, 자주 변하지 않는 사이트 요소를 의미하는 정적 컨텐츠는 완벽합니다. 웹 사이트 로고는 자주 전환하지 않을 가능성이 높기 때문에 좋은 예입니다.

반면에 자주 변하는 내용은 다른 이야기입니다. 캐시를 캐시 할 수는 있지만 방문자가 구식 버전을 볼 수 없도록 규칙을 설치해야합니다. 곧 더.

웹 사이트 캐싱의 이점

웹 사이트를 캐시하는 주된 이유는 성능을 향상시키는 것입니다. 브라우저가 웹 사이트를 표시하는 데 필요한 파일을 더 빨리 사용할 수있는 경우 방문자는 사이트를 더 빨리 볼 수 있습니다.

이로 인해 더 나은 사용자 경험이 생겨 방문자가 사이트에 더 오래 머무르거나 제품 구매와 같은 원하는 조치를 취하거나 나중에 돌아올 가능성이 높아집니다. 전환율과 결론에 대한 모든 좋은 소식.

사이트 속도는 또한 검색 엔진이 관심을 갖는 것입니다. Google은 10 년 이상 순위 요소로 사용해 왔습니다. 또한, 핵심 웹 생명체 지표는 사용자의 페이지가 얼마나 빨리 나타나는 지, 사용자 입력에 얼마나 빨리 응답하는지를 측정합니다.

또한 캐싱은 서버에서 스트레스를받습니다. 반복 방문자가 사이트에서 다운로드 해야하는 파일 수와 서버가 동시에 처리 해야하는 요청 수를 줄입니다. 또한 캐싱을 통해 일부 작업을 외부 서버에 아웃소싱 할 수 있습니다.

이것은 귀하의 웹 사이트가 더 인기를 얻을 때 특히 중요합니다. 캐싱은 서버가 압도당하는 것을 막는 데 도움이됩니다. 또한 제한된 호스팅 계획에있는 경우 대역폭과 비용을 절약합니다.

캐싱의 유형은 무엇입니까?

로딩 프로세스의 다른 수준으로 웹 사이트를 캐시 할 수 있습니다. 서버와 클라이언트 측 캐싱의 두 가지 주요 유형이 있습니다.

클라이언트 측 캐싱은 컴퓨터 나 방문자의 브라우저 (예 :“클라이언트”)에서 발생하는 모든 것과 관련이 있습니다. 반면에 서버 캐싱은 웹 사이트 파일이 포함 된 컴퓨터에서 발생합니다.

브라우저/클라이언트 캐싱

브라우저에 웹 사이트가 표시되면 많은 데이터를 다운로드해야합니다. 반복 방문의 로딩 시간을 단축하려면 방문자의 하드 드라이브에 많은 콘텐츠를 저장하는 경우 더 빠른 액세스가 발생합니다.

그 예의 한 예는 DNS 캐싱입니다. 웹 사이트와 관련된 IP 주소를 로컬로 저장하는 것을 의미하므로 다음에 사이트에 액세스 할 때 브라우저가 찾을 필요가 없습니다.

또한 브라우저는 항상 캐시를 먼저 확인하여 이미지 및 기타 파일과 같은 필요한 자산이 이미 있는지 확인합니다. 그렇게하면 서버에 연락 할 필요가 없습니다.

서버 캐싱

서버 캐싱에는 여러 형태가 있습니다. 주로 서버에 저장된 데이터 유형과 양이 다릅니다.

• Page Caching : 이는 이미 컴파일 된 HTML 버전의 페이지를 저장하여 모든 방문자에게 처음부터 생성 할 필요가 없습니다.

• 객체 캐싱 : 여기서 서버는 온라인 상점에서 제품 검색과 같은 데이터베이스 요청을 저장합니다.

• Fragment Caching : 특정 웹 사이트 요소, 일반적으로 이미지와 같은 정적 리소스 저장을 설명합니다.

• CDN 캐싱 : 이 경우 웹 사이트 데이터 사본은 다른 위치의 추가 서버에 있습니다. 이를 통해 방문자는 가장 가까운 서버에서 더 빨리 다운로드 할 수 있습니다.

캐싱 작동 방식

다음 이미지를 살펴보십시오.

위에서부터 캐싱이 어떻게 작동하는지 이해하기 쉽습니다.

1. 사용자는 URL을 입력하고 웹 브라우저는 캐시에 요청 된 페이지의 데이터가 있는지 확인합니다.

2. 그렇다면 저장된 파일 버전을 선언하는 서버에 메시지를 보냅니다.

3. 서버는 최신 버전이 있는지 여부를 확인하고 업데이트 된 리소스를 보냅니다. 이전에 요청 된 경우 서버는 처음부터 처리하지 않고 자체 캐시에서 전송할 수 있습니다.

4. 웹 브라우저는 캐시의 기존 데이터와 서버에서 전송 된 데이터를 사용하여 요청 된 웹 페이지를 표시합니다.

이제 웹 사이트 캐싱을 가능하게하는 기술에 대해 이야기 할 시간입니다 : 캐싱 헤더.

요청 및 응답 헤더 이해

요청 및 응답 헤더는 브라우저와 서버로 교환되는 작은 텍스트 조각입니다. 여기에는 그들 사이에 전송 된 데이터에 대한 중요한 정보와 지침이 포함됩니다.

그들이하는 한 가지는 캐싱 동작을 구성하는 것입니다.이 목적을 위해 여러 헤더가 존재합니다. 여기에는 캐시 제어, 만료, 최후의 수정 및 ETAG가 포함됩니다. 캐싱 헤더는 기본적으로 두 가지 방식으로 작동합니다.

1. 웹 사이트 파일을 전혀 캐싱되어야하는지, 얼마나 오래, 누가 (브라우저 및/또는 서버)를 선언하십시오.

2. 파일의 나이와 "버전"을 표시하므로 브라우저는 서버에 새로운 판이있는 경우에만 브라우저를로드합니다.

이 모든 것이 웹 사이트를로드하기 위해 전송 해야하는 파일 수와 데이터 양을 줄여 프로세스 속도를 높이는 데 도움이됩니다. 캐싱 헤더는 약간 기술적 인 것처럼 보일 수 있지만 특히 서버의 캐싱을 손으로 구성하기로 결정한 경우 알고 있어야합니다.

웹 사이트를 캐시하는 방법 : 고려해야 할 3 가지 옵션

이 모든 이론이 끝난 후에는 웹 사이트를 실제적인 용어로 캐시하는 방법에 대해 논의 해 봅시다.

1. 캐싱을 수동으로 활성화합니다

손으로 캐싱을 구성하는 것은 서버에서 캐싱 헤더를 수동으로 설정해야하기 때문에 가장 복잡한 접근 방식입니다.

첫 번째 단계는 호스팅 제공 업체 나 웹 사이트 소프트웨어가 이미 일부 작업을 수행했을 수 있으므로 상태를 확인하는 것입니다. 이를 위해 브라우저에서 사이트를 열고 개발자 도구 (대부분의 브라우저에서 Ctrl/CMD+Shift+I)에 액세스하고 네트워크 탭으로 이동하십시오 (여기에서 무언가를 보려면 페이지를 다시로드해야 할 수도 있음).

모든 리소스를 클릭하여 요청 및 응답 헤더를 확인하십시오.

그런 다음 캐싱 전략을 정의해야합니다. 이것은 각 사용 사례마다 다르게 보입니다. 예를 들어, 뉴스 웹 사이트는 브로셔 사이트보다 더 짧은 캐싱 간격이 필요합니다. 뉴스 사이트의 내용은 순간까지 변경되는 반면 브로셔는 크게 동일하게 유지됩니다.

일반적으로 캐시 지속 시간과 데이터 신선도 균형을 유지하려고합니다.

• 미디어 파일 및 다운로드 가능한 콘텐츠와 같은 정적 자산을 더 길게 캐시합니다. 예를 들어, 최대 1 년 동안 로고 및 글꼴 파일을 캐시 할 수 있습니다.

• 캐시 제어를 사용하지 않아야 할 리소스에 캐시 제어 : 없음 스토어를 사용하십시오.

• 캐싱의 이점을 희생하지 않고 자원 신선함을 보장하기 위해 최후의 수정 또는 ETAG와 같은 유효성 검사기를 포함시킵니다. 일부 웹 캐시에는 연령 제어 헤더와 유효성 검사기가 필요합니다.

다음 단계는 서버에서 선택한 설정을 구현하는 것입니다. 이를 수행하는 방법은 서버가 실행중인 소프트웨어에 따라 다릅니다. 가장 일반적인 설정에 대한 지침은 다음과 같습니다.

• nginx

• 아파치

또는 호스팅 제공 업체는 캐싱 및 호스팅 패널에서이를 활성화 할 수있는 기능을 제공 할 수도 있습니다.

2. CDN을 사용하십시오

웹 사이트를 캐시하는 또 다른 방법은 CDN에 가입하는 것입니다. 이를 위해 먼저 CDN 제공 업체를 선택해야합니다. 우리는 CloudFlare를 가장 인기있는 서비스 중 하나이기 때문에 여기서 CloudFlare를 예로 사용할 것입니다.

선택한 CDN에 가입하여 시작하십시오. 웹 사이트로 이동하여 계정을 만듭니다.

귀하의 요구에 맞는 계획을 선택하고 웹 사이트 주소를 제공하십시오.

그런 다음 DNS 설정을 업데이트해야합니다. CDN 제공 업체는 현재 레코드를 스캔 한 다음 이름 서버를 표시합니다.

이를 통해 도메인 레지스트라 (예 : Namecheap, Godaddy 또는 Google 도메인)에 로그인하고 DNS 설정 섹션을 찾아 기존 네임 서버를 CDN이 제공 한 내용으로 바꾸십시오.

수정을 저장 한 다음 기다리십시오. DNS 변경은 완전히 전파하는 데 몇 시간이 걸릴 수 있습니다. 완료되면 웹 사이트가 CDN을 통해 성공적으로 라우팅됩니다. 마지막 단계는 CDN에 캐싱이 활성화되어 있는지 확인하는 것입니다.

3. 캐싱 플러그인을 사용하십시오

마지막으로 WordPress 웹 사이트를 사용하는 경우 WP Rocket과 같은 성능 플러그인을 사용할 수 있습니다. 자동으로 캐싱과 관련된 모든 것을 처리하므로 기술적 인 부분을 처리 할 필요가 없습니다. 또한 플러그인을 설치하고 활성화하기 만하면됩니다.

이 작업을 수행 한 후 캐싱은 모바일 장치 용 전용 캐시를 포함하여 사이트에서 즉시 활성화됩니다. 고급 규칙 에 따라 캐시를 더 잘 조정할 수 있습니다.

다른 옵션 중에서도 캐싱 수명을 결정하고 캐싱을 사용하고 싶지 않은 페이지, 쿠키 및 사용자 에이전트를 정의 할 수 있습니다. 문서에서 더 많은 정보를 찾을 수 있습니다.

캐싱 외에도 WP Rocket은 다음을 포함하여 WordPress 사이트 속도를 높이는 더 많은 기능을 제공합니다.

• 이미지 및 비디오에 대한 게으른로드

• 렌더 블로킹 리소스를 연기합니다

• 사전로드 캐시, 링크, 외부 파일 및 글꼴

• 자체 호스팅 Google 글꼴

• 데이터베이스 최적화

• RocketCDN을 포함한 CDN에 쉽게 연결하는 기능, 즉 WP Rocket 자체 CDN.

또한 WP 로켓은 백그라운드에서 많은 추가 성능 향상을 구현합니다. 그중에는 GZIP 압축, CSS 및 JavaScript 파일을 조정하고 폴드 위의 이미지를 최적으로 최대의 콘텐츠 페인트를 개선합니다.

웹 사이트 캐싱의 성능 영향 : 사례 연구

실제 생활에서 웹 사이트 속도 향상에 대한 캐싱의 영향을 조사하기 위해 더미 컨텐츠가있는 테스트 사이트를 설정하고 WP 로켓을 활성화하기 전과 후에 PagesPeed Insights를 통해 실행했습니다.

캐싱없이 모바일 장치의 결과는 다음과 같습니다.

이제 캐싱이 활성화 된 후에 무슨 일이 일어나는지 보자.

효과는 크지 않지만 눈에 띄게됩니다. 특히 속도 지수 값의 3 초 향상은 비웃는 것이 아닙니다.

기사 전체에서 논의한 것처럼 캐싱은 반복 방문자에게 가장 큰 영향을 미칩니다. Pagespeed Insights는 의도적으로 캐싱이 제공하는 것의 많은 부분을 활용하지 않기 때문에 효과가 크지 않은 것은 놀라운 일이 아닙니다. 귀하의 웹 사이트 방문자에게는 더 눈에 띄어 야합니다.

궁금하다면, 아래는 사용되지 않은 CSS 제거, JavaScript를 연기, 이미지의 게으른로드 및 사전 로딩과 같은 WP 로켓에서 몇 가지 속도 향상을 켜면 아래에서 발생합니다. 몇 개의 상자를 확인하는 것입니다.

웹 사이트 캐시를 지우는 방법

문제 해결 문제, 새로운 기능 추가 및 최신 컨텐츠를 방문자에게 볼 수 있도록 웹 사이트의 캐시를 지우는 것이 필요할 수 있습니다. 당연히 캐싱은 다른 레벨에서 발생하기 때문에 비우는 방법도 다릅니다.

브라우저 캐시를 삭제합니다

브라우저 캐시를 비우는 정확한 방법은 사용중인 브라우저에 따라 다르지만 모두 설정에 옵션이 있습니다. Chrome에서는 개인 정보 보호 및 보안> 브라우징 데이터 삭제 에서 찾을 수 있습니다.

서버 캐시를 지우십시오

서버에서 캐싱이 구현 된 경우 호스팅 제공 업체는이를 지우는 옵션이있을 가능성이 높습니다.

CDN의 캐시를 비우십시오

CDN 캐시 퍼지는 자연스럽게 CDN 제공 업체를 통해 발생합니다. 예를 들어 CloudFlare에서 옵션은 캐싱> 구성> 퍼지 캐시 에서 사용할 수 있습니다.

웹 사이트의 캐시를 제거하십시오

플러그인을 사용하여 웹 사이트를 캐시하는 경우 일반적으로 캐시를 지울 수있는 버튼이 있습니다. WP Rocket은 설정을 변경하거나 새 컨텐츠를 게시하고 웹 사이트를 수정하거나 캐시 수명이 다 떨어질 때와 같이 적절한 시간에 웹 사이트 캐시를 자동으로 제거합니다.

수동으로 수행하려면 WordPress Back End 의 설정> WP 로켓 아래에서 대시 보드 에서이 옵션을 직접 찾을 수 있습니다.

또한 WordPress 편집기 내부 또는 페이지 또는 게시물 메뉴에서 개별 페이지의 캐시를 항목 위로 가져 가서 개별 페이지에 대한 캐시를 지울 수 있습니다.

웹 사이트를 어떻게 캐시합니까? 이제 알다시피

캐싱은 웹 사이트를 더 빠르게 만들 수있는 가장 근본적인 방법 중 하나입니다. 방문자가 웹 사이트를 볼 수 있도록 전송 해야하는 데이터의 양을 줄이는 간단한 방법입니다.

캐싱은 다른 수준의 로딩 프로세스에서 사용할 수 있으며 원칙은 동일하게 유지되지만 다른 웹 사이트 요소를 대상으로 할 수 있습니다.

WP Rocket을 사용하여 WordPress 사이트에서 캐싱을 자동으로 구현하고 수십 가지 다른 성능 기능 및 모범 사례를 활용하여 웹 사이트를 즉시 더 빠르게 만들 수 있습니다. 플러그인에는 14 일간의 돈을 보증하는 보증이 제공되므로 완전히 위험없이 테스트 할 수 있습니다.