공개 CDN은 더 이상 유용하지 않습니다.

5232 단어 cdnjavascript
공용 CDN은 페이지 속도를 높이는 데 도움이 되지만 2019년에는 상황이 변경되었습니다. Google Fonts , Cloudflare’s cdnjs , jsDelivrGoogle Hosted Libraries 과 같은 서비스는 더 이상 사이트 로드 속도를 높이는 데 도움이 되지 않을 수 있습니다.


공유 캐시는 더 이상 작동하지 않습니다



오늘날 공용 CDN의 주요 이점은 최신 브라우저에서 더 이상 지원되지 않습니다.

사용자가 방문하는 사이트에서 로드한 리소스(예: .js 파일)는 방문하는 다른 사이트에 대해 더 이상 캐시되지 않습니다. 브라우저는 2019년 9월경 공유 캐시를 사용하지 않습니다( Chrome 77 , Firefox ). 이 작업은 모두 2019년 3월에 보고된 교차 사이트 유출 보안 문제를 해결하기 위해 수행되었습니다.

  • Shared Cache is Going Away (jefftk.com)

  • sirdarckcat: HTTP Cache Cross-Site Leaks (sirdarckcat.blogspot.com)



  • 퍼블릭 CDN 정보



    CDN은 사이트가 더 빨리 로드되도록 도와야 했습니다. 예를 들어 jQuery와 같은 인기 있는 라이브러리는 한 사이트에서 CDN에서 로드할 수 있으므로 동일한 CDN을 사용하는 사용자가 방문할 다른 사이트에 대해 더 빠르게 로드할 수 있습니다.

    
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
    
    


    ☝Google has been running a CDN serving popular JavaScript libraries. (via Google)




    공용 CDN의 기타 문제



    📉 중단 시간 — 공용 CDN의 중단 시간은 사이트 서비스를 손상시킵니다. 가동 중지 시간이 빌드 및 배포에 영향을 미치지만 사용자에게는 영향을 미치지 않는 npm 또는 Rubygems와 비교하십시오.

    ⚠ 일부 지역에서 차단 — Google 글꼴 또는 Google 호스팅 라이브러리에서 중요한 자산을 로드하는 경우 사이트를 손상시키는 Google 도메인을 차단하는 국가가 있습니다.

    🥷 리소스 무결성 문제 — 공용 CDN이 손상된 경우 사이트에 악성 코드가 삽입될 수 있습니다. 이것은 Subresource Integrity (SRI) (즉, <script src="..." integrity="(sha384_hash_here)"> )를 사용하여 완화할 수 있지만 이를 유지하는 것은 번거로울 수 있습니다.


    공개 CDN이 여전히 유용합니까?



    공개 CDN이 심하게 너프되었지만 일부는 다른 이유로 유용하다는 것을 알게 되었습니다.

    💻 코드 예제 — Google 글꼴을 사용하면 코드 예제에 유용할 수 있습니다. npm 패키지의 최적화된 버전을 생성하여 코드 예제에서 빌드 및 컴파일 파이프라인을 건너뛸 수 있는 CDNskypack도 있습니다.

    🏗 빌드 파이프라인 단순화 — Railsimport-map와 같은 도구는 jspm과 같은 CDN을 사용하여 일부 npm 패키지에 필요한 빌드 단계를 아웃소싱할 것을 권장합니다. 개인적으로 나는 보안상의 이유로 이것이 의심스럽다고 생각하지만 일부는 편의를 위해 보안을 교환하는 것을 선호합니다.

    🔌 최대 연결을 회피하시겠습니까? — 브라우저는 HTTP 요청을 도메인당 6개의 연결로 제한하므로 일부 자산을 다른 도메인에서 제공하면 잠재적으로 몇 가지 이점이 있을 수 있습니다. 그러나 실제로 HTTP/1.1 pipeliningHTTP/2.0 Multiplexing은 브라우저가 여러 동시 요청을 할 수 있도록 이미 허용해야 합니다.


    지금 무엇을 해야 합니까?



    프로덕션 빌드의 경우 자체 호스팅이 CDN을 사용하는 것보다 훨씬 나은 대안인 것 같습니다.

    💡 자체 호스팅 JavaScript — 현재 자체 호스팅 npm 패키지에 대한 많은 옵션이 있습니다.

    💅 자체 호스팅 글꼴 — Fontsource은 글꼴 파일을 수동으로 관리할 필요 없이 Google 글꼴 등을 자체 호스팅하는 쉬운 방법입니다.

    ⚡ CDN 사용 — 공용 CDN은 아니지만 CloudflareFastly과 같은 CDN 서비스는 페이지를 빠르게 로드할 수 있습니다(<100ms!). 이렇게 하면 자체 호스팅이 매우 실행 가능해집니다.

    🔌 HTTP/2 활성화 — 웹 호스팅 인프라의 모든 단계에서 HTTP/2.0을 지원하는 것이 좋습니다. 예를 들어 Cloudflare는 캐시 프록시 서비스에서 enabling HTTP/2 support을 허용합니다.


    연결


  • How to Adapt to Shared Cache Going Away | Section
  • Shared Cache is Going Away
  • Shared Cache Is Going Away | Hacker News
  • sirdarckcat: HTTP Cache Cross-Site Leaks
  • 좋은 웹페이지 즐겨찾기