WordPress에서 브라우저 캐싱 활용 경고를 쉽게 수정하는 방법

게시 됨: 2021-08-18

웹사이트 성능을 측정하기 위한 다양한 온라인 도구를 접할 수 있습니다. 그들 각각은 웹사이트의 특정 부분이 얼마나 빨리 작동하는지 분석하고 있습니다. 그리고 수많은 일반적인 경고 중 "Leverage Browser Caching" 오류가 종종 있습니다. 이것은 클라이언트 장치의 공간을 일시적으로 사용할 수 있는 기능인 캐싱과 관련이 있습니다. 결과적으로 웹 사이트와 해당 페이지의 전체 로딩 속도가 빨라집니다. 즉, WordPress에서 브라우저 캐싱 경고를 쉽게 수정하여 방문자에게 더 나은 사용자 경험을 제공할 수 있습니다.

WordPress에서 브라우저 캐싱 경고 활용을 수정하는 확실한 방법

이 경고를 받는 두 가지 경우가 있습니다. 첫째, 브라우저 캐싱이 활성화되어 있지 않습니다. 둘째, 브라우저 캐싱이 제대로 구성되지 않았습니다. 그러나 오늘날 수많은 온라인 성능 도구에서 이 오류가 "효율적인 캐시 정책으로 정적 자산 제공" 으로 보고됩니다. 그러나 어떤 경고를 받든 브라우저 캐싱 규칙이 적용되지 않았음을 의미합니다. 스스로 문제를 해결하는 데 자신이 없다면 노련한 WP 전문가가 항상 이러한 문제를 해결하는 데 도움을 줄 수 있습니다. 또는 그렇다면 WordPress에서 "브라우저 캐싱 활용" 경고를 수정할 수 있는 방법을 살펴보겠습니다.

내용의 테이블:

  • 브라우저 캐싱이란 무엇입니까?
    • W3 토탈 캐시 플러그인
    • CAOS 플러그인
    • WP 로켓 플러그인
  • 플러그인으로 브라우저 캐싱 활용 경고 수정
  • 코드를 사용하여 수동으로 수정

브라우저 캐싱이란 무엇입니까?

솔루션을 진행하기 전에 이러한 유형의 브라우저 캐싱이 의미하는 바를 이해하는 것이 좋습니다. 웹사이트가 페이지 사본을 로컬에 저장하는 방법입니다. 브라우저와 서버 간의 요청 수를 줄여 로딩 속도를 향상시킬 수 있습니다. 따라서 다시 방문하면 브라우저는 서버에 다시 연결하고 추가 리소스를 요청할 필요 없이 웹 사이트를 더 빠르게 로드합니다.

"효율적인 캐시 정책으로 정적 자산 제공" 경고.
이것은 일반적으로 온라인 성능 도구에서 볼 수 있는 경고입니다.

캐시되는 가장 일반적인 파일 유형은 다음과 같습니다.

  • 스타일시트
  • 이미지
  • 로고
  • 및 기타 정적 요소

마지막 방문 이후로 변경되지 않을 수 있으므로 웹사이트가 방문자의 브라우저에서 더 빨리 로드됩니다. 문제는 캐시된 모든 항목에 만료 기간이 설정되어 있어야 한다는 것입니다 . 그 사이에 무언가가 변경된 경우 방문자가 웹 사이트의 업데이트된 버전을 로드할 수 있습니다.

플러그인으로 브라우저 캐싱 경고 활용 수정

캐싱 플러그인에 대한 플러그인 검색 결과입니다.
WordPress에서 수십 개의 캐싱 플러그인을 쉽게 찾을 수 있습니다.

W3 총 캐시

W3 Total Cache는 가장 인기 있는 캐싱 플러그인 중 하나 입니다. 이러한 플러그인에서 기대할 수 있는 모든 기능이 함께 제공됩니다. 전반적으로 이 플러그인은 웹사이트 성능을 향상시켜 SEO와 전체 사용자 경험을 직접적으로 향상시킵니다. 적절하게 구성하면 일반 성능을 약 10배 향상시킬 수 있습니다. 10년이 넘는 기간 동안 많은 웹 개발자, 웹 호스트 및 게시자가 이 플러그인을 신뢰하고 있습니다.

CAOS 플러그인

완전한 Analytics Optimization Suite는 WordPress 플러그인 저장소에서 쉽게 찾을 수 있습니다. 일반적인 캐싱 솔루션으로 유명하지는 않지만 이 플러그인 은 Google Analytics의 문제를 해결합니다 . Google Analytics를 사용하는 경우 PageSpeed ​​Insights 및 유사한 도구의 결과가 왜곡되는 경우가 있습니다. 대부분 Google이 캐시 만료 시간을 너무 짧게 설정했기 때문입니다. CAOS 플러그인을 사용하면 호스트 analytics.js/gtag.js를 로컬로 호스팅하고 자동으로 최신 상태로 유지할 수 있습니다.

WP 로켓 플러그인

이 목록에 있는 WordPress용 최고의 캐시 플러그인 중 하나는 확실히 WP Rocket입니다. 다른 플러그인은 구성하기 어려울 수 있지만 WP Rocket은 매우 간단합니다. 초보자에게 친숙 하며 사전 지식 없이도 모든 것을 최적화할 수 있습니다. 기본적으로 설치하고 활성화하기만 하면 바로 권장되는 .htaccess 구성이 사용됩니다. 이것은 지금까지 WordPress에서 브라우저 캐싱 경고를 활용하고 웹 사이트를 최대한 사용자 친화적으로 만드는 가장 쉽고 빠른 방법입니다.

코드를 사용하여 수동으로 수정

이 방법 은 일정한 경험 이 필요하므로 초보자에게 권장하지 않습니다. 대부분의 경우 플러그인이 작업을 수행합니다. 그러나 어떤 이유로든 플러그인을 사용하지 않으려면 수동으로 코드를 추가하여 캐싱 문제를 해결합니다.

변경하기 전에 첫 번째 단계는 웹사이트를 백업하는 것입니다.

다음 단계는 사용 중인 서버에 따라 약간 다를 수 있습니다.

Apache 서버를 사용하는 경우

기본적으로 모든 것은 .htaccess 파일 편집으로 시작됩니다 . 내부에 들어가면 캐시 제어 및 만료 헤더용 코드를 추가해야 합니다. 캐시 제어는 캐싱을 처리하는 방법에 대한 일련의 지침입니다. 만료 헤더는 브라우저에서 리소스 보존 기간을 결정합니다.

  • 먼저 cache-control에 대해 다음 코드를 추가합니다 .

<filesMatch ".(ico|pdf|flv|jpg|jpeg|png|gif|svg|js|css|swf)$">
Header set Cache-Control "max-age=80000, public"
</filesMatch>

기본적으로 이를 통해 다양한 유형의 파일을 캐싱할 수 있습니다. 그리고 "max-age"(초) 후에 일반적으로 만료되도록 설정합니다. 그런 다음 브라우저는 전체 캐시를 다시 업데이트합니다.

  • 다음으로 만료 헤더를 정의할 코드를 추가합니다 .

<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpeg "access 2 year"
ExpiresByType image/jpg "access 1 year"
ExpiresByType image/png "access 3 year"
ExpiresByType image/svg "access 1 year"
ExpiresByType image/gif "access 2 year"
ExpiresByType text/css "access 1 month"
ExpiresByType application/javascript "access 1 month"
ExpiresByType application/x-javascript "access 1 month"
ExpiresByType application/pdf "access 3 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType image/x-icon "access 1 year"
ExpiresDefault "access 5 days"
</IfModule>

본질적으로 이 줄은 필요한 항목에 따라 다양한 파일 형식에 대해 다른 만료 날짜를 설정합니다.

Nginx 서버를 사용하는 경우

Nginx의 경우 브라우저 캐싱 문제를 해결 하려면 서버 구성 파일을 변경해야 합니다 . 유일한 주의 사항은 서버 구성 파일에 대한 액세스 권한이 없을 수 있다는 것입니다. 이를 위해서는 호스팅 제공업체에 문의해야 합니다.

  • 그러나 보안 액세스 권한이 있으면 캐시 제어 헤더를 자유롭게 추가 할 수 있습니다.

location ~* \.(js|css|png|jpg|jpeg|gif|svg|ico)$ {
expires 14d;
add_header Cache-Control "public, no-transform"; }

Apache와 마찬가지로 전체 캐시의 만료 시간을 설정합니다.

  • 다음 줄은 만료 헤더를 설정 합니다.

location ~* \.(jpg|jpeg|gif|png|svg)$ { expires 365d; }
location ~* \.(pdf|css|html|js|swf)$ { expires 4d; }

여기에서 이미지는 일반적으로 다른 파일만큼 자주 변경되지 않기 때문에 만료 기간이 더 깁니다.

파일 형식의 다른 아이콘.
주어진 파일 유형에 대해 만료 날짜를 설정할 수 있습니다.

웹사이트의 성능에 대한 올바른 그림을 제공하지 못할 수도 있지만 온라인 성능 도구는 올바른 방향을 알려줄 수 있습니다. 변경을 시작하는 가장 쉬운 방법 중 하나는 WordPress의 "Leverage Browser Caching" 경고를 수정하는 것 입니다. 또는 오늘날과 같이 종종 "효율적인 캐시 정책으로 정적 자산 제공"으로 간주됩니다. 이렇게 하면 웹사이트가 더 빨리 로드되고 신규 및 재방문자에게 더 나은 사용자 경험을 제공할 수 있습니다. 플러그인을 선택하든 수동으로 코드를 추가하든 상관없습니다. 일반적으로 웹사이트의 성능이 향상되는 것이 중요합니다.