Google jQuery 호스팅 라이브러리를 사용하면 실제로 만질 수있는 이점이 있습니까? 아니면 그냥 서버로 다운로드할까요?
이에 대한 의견은 무엇입니까?
댓글
- 간단한 Google 검색이 답을 제공했을 것입니다 …
답변
외부 CDN을 사용하면 두 가지 주요 이점이 있습니다. Google과 같은 jQuery 호스팅 :
- 더 빠릅니다. 확실히 사이트보다 빠르며 직접 설정 한 CDN보다 빠릅니다.
- 이미 이미 캐시 될 수 있습니다. . 많은 사이트가 Google CDN의 jQuery를 참조하므로 이전에 다른 사이트를 방문했다면 다운로드 할 필요조차 없습니다.
잠재적 단점 :
- 도메인이 차단 될 수 있음 (중국과 같은 지역에서 매우 일반적입니다. ). 로컬 폴백을 사용하여이 문제를 해결할 수 있습니다 ( re ).
- 조각화 버전 번호가 상당히 높으므로 사이트 방문자는 캐시 된 여러 버전을 가질 수 있지만 참조한 버전은 아닐 수 있습니다 ( 최근 통계는 여기에서 확인 ). 그러나 이것은 첫 페이지로드시에만 문제가됩니다.
댓글
- 설정 방법에 대한 참조를 게시 할 수 있습니까? 로컬 폴백?
- Zistolen이 이전에 지적했듯이 또 다른 이점은 웹 사이트에 다른 자산을 병렬로 다운로드한다는 것입니다. 이 훌륭한 답변에도 추가 할 수 있습니다.
- ' 약간 오해의 소지가 있습니다. 브라우저는 호스팅되는 위치에 관계없이 자산을 병렬로 다운로드하지만 ' 동일한 호스트에서 한 번에 다운로드하는 항목의 수에는 제한이 있습니다.
- 솔직히 ' 여기도 저기도 아닙니다. 파일을 동시에 다운로드 할 수 있지만 ' 또한 추가 DNS 조회. 또한 둘 중 어느 것이 든 시간의 차이는 무시해도 좋습니다.
- 충분합니다. 그러나 빠른 연결에서는 더 많은 " 파이프 "를 사용할 수 있으므로 전체로드 시간이 더 빨라지지 않을 수 있습니까?
답변
또 다른 단점 :
CDN을 사용하면 CDN 운영자가 추적 할 수 있습니다. 사이트 방문자. 그렇기 때문에 비용이 들지 않습니다.
댓글
- 확실하지만 방문자는 추적하지 않습니다. 둘 다 jquery ' 자체 및 Google '의 jquery CDN은 쿠키를 설정하거나 사용하지 않는 ' 도메인에서 호스팅됩니다 (이것은 성능 최적화 일 수도 있습니다), ' 요청에 실제로 식별 가능한 정보가 없습니다. CDN 공급자는 사용자 에이전트 문자열 및 참조 자에 대한 IP 주소 및 일부 통계에 대한 아이디어를 얻을 수 있습니다. 이는 가치가있을 수 있지만 ' 그 자체로 큰 개인 정보 보호 위험은 아닙니다 (이러한 기록이 다른 데이터베이스와 상관 관계가있는 경우 (예 : 유사한 시간에 개인 맞춤 광고가 게재 된 경우). 추적 수단).
- 거의 모든 사람이 항상 Google을 사용하여 검색하기 때문에 데이터가 다른 데이터베이스와 상관 관계가 있다는 것은 당연한 일이라고 생각합니다 (Google의 경우). Google 글꼴도 마찬가지입니다. 최근에 서버에서 글꼴을 자체 호스팅하려고했지만 수행하기가 매우 어렵다는 것을 알게되었습니다. Google은이를 금지하지 않지만 (오픈 소스) ' 즉시 사용할 수있는 방식으로 파일을 제공하지 않습니다. 직접 컴파일 할 수도 있지만 makefile 없음) 또는 요청을 정상적으로 전달하는 데 사용되는 서버로 위조 할 수 있습니다. 둘 다 비전문가에게는 불가능합니다.
- 아마도. 저는 ' 내부 정보가 없기 때문에 ' 확실히 말하기 어렵습니다. 나는 ' 확실히 ' 버그가 많고 상당한 간격이있을 것입니다. 유사한 시스템 (아마도 동일한 UA 문자열)을 가진 꽤 많은 사용자-어떤 요청이 누구에게서 오는지 알 수 없습니다. ' 물론 애드 센스 및 소셜 공유 버튼을 사용하면 거의 항상 더 신뢰할 수있는 수단을 가질 수 있으므로 신경 쓰지 않는다고 ' 생각할 수 있습니다. 글꼴에 관해서는 ' 여러 번 다운로드했기 때문에 ' 어려움이 무엇을 의미하는지 잘 모르겠습니까?
- 명확하게 말하면 ' 당신이하는 웹 사이트 방문의 대부분은 다음과 같은 이유로 대규모 통계 수집가가 추적 할 수 있고 추적 할 것이라고 가정합니다. 소셜 공유 버튼 (상당히 널리 퍼져 있음)과 광고는 거의 모든 곳에 있습니다. 따라서 과도하게 캐시 된 js 요청의 오해의 소지가있는 정보가 얼마나 중요한지 궁금합니다. ' 그렇지 않은 내기입니다. 따라서 그들이 동의하지 않는다고 가정합니다. ' CDN 제공 JS를 사용하는 사람을 개인적으로 식별하려고하지 마세요.
- 생각하는 것만 큼 캐시되지 않았습니다. fonts.googleapis에 CSS 링크를 삽입하여 Google이 선호하는 방식으로 글꼴을 삽입 할 때. com, 모든 단일 페이지보기는 Google에 대한 연결을 엽니 다 (Firebug에서 볼 수 있음). ' 캐시 여부는 중요하지 않습니다. 다운로드에 관해서 : 고품질 eot, woff, ttf 및 svg 형식 (Google에서 제공하는 것과 동일한 버전, 외부 변환기 없음)으로 글꼴을 다운로드 할 수있는 위치를 알려 주시겠습니까?
답변
CDN (s)을 사용하여 이와 같은 많은 서버에 종속성을 분할하는 것은 본질적으로 대역폭과 지연 시간 사이의 균형을 나타냅니다. 성능에 대해.
부수적으로 대안은 단순히 로컬에서 호스팅하는 것이 아니라 다른 로컬 요청과 연결하는 것이라고 가정합니다. 일반적으로 가능할 때 연결하지 않을 이유가 없습니다.
대역폭이 무한한 경우 가장 느린 서비스만큼 느려질 수 있으므로 분할하지 않는 것이 가장 좋습니다. 서비스가 빠르더라도 지연 시간을 완벽하게 예측할 수는 없습니다. 페이지로드 속도를 늦추려면 약간의 불운이 필요합니다.
대기 시간이 0 인 경우로드를 여러 서버에 분산하면 많은 서비스를 활용하여 대역폭을 향상시킬 수 있습니다. rs (대역폭 제한이 서버가 아닌 클라이언트 근처에있을 가능성이 높기 때문에 도움이되지 않음) 그러나 더 중요한 것은 캐싱의 효율성을 높여 전송되는 데이터 양을 약간 줄일 수 있다는 것입니다.
귀하의 시나리오이지만 일반적으로 스크립트가 엄청나게 크지 않는 한 (jquery가 아닌) 대기 시간이 대역폭보다 더 문제가 될 것으로 예상합니다. 이 시점에서 일반적으로 연결된 로컬 파일의 일부로 jquery를 호스팅하는 것이 더 빠릅니다.
로컬로 호스팅하지 않는 이유는 대역폭 비용을 지불하거나 느린 서버에서 호스팅하는 경우입니다 ( 클라이언트에 대한 연결이 클라이언트가 아닌 사용자 측에 병목 현상이 있거나 클라이언트의 대역폭이 매우 낮다는 것을 알고 있습니다 (저급 dsl 또는 모뎀, 예를 들어 모바일이 대역폭 문제보다 지연 문제가 더 많은 경향이 있음). , 또는 클라이언트가 대역폭 (예 : 모바일)에 대해 비용을 지불하고 스크립트는 사소한 캐싱이이기는 것이 중요하다는 점에서 눈에 띄는 부분입니다 (가능성이 없음).
어쨌든 : 훨씬 더 관련성이있는 것은 귀하가 ” 먼저 기본 사항을 다뤘습니다. 적절한 캐싱 헤더, 연결, 축소 및 gzipping (높은 압축률 권장). 그리고 여기에 핵심이 있습니다. 만약 당신이 그렇게 하지 않으면 적어도 CDN이 이길 것입니다.
TL; DR : 연결 + 축소 + gzipping + 캐싱이 모두 포함 된 경우 작은 스크립트를 로컬로 제공하는 것이 CDN보다 더 빠릅니다. CDN의 더 나은 성능에도 불구하고-숙제를 완료 한 경우에만 가능합니다. 페이지로드, 그리고이 규칙에는 확실히 예외가 있습니다.
댓글
- 부수적으로, 단 하나의 요청을 사용하여 얻을 수있는 몇 가지 바이트 절감이 있습니다. 헤더 하나만으로도 거의 1kb에 달하며 28k 페이로드에서 ' 아무것도 아닙니다. gzip은 더 많은 컨텍스트에서 더 잘 작동하므로 0.5k를 더 절약 할 수 있습니다. TCP, DNS, HTTPS 오버 헤드는 모두 가능합니다. 여기 또는 저기에 KB를 쉽게 추가 할 수 있으며, RTT ' s를 쉽게 추가 할 수 있습니다. 따라서 '와 같은 작은 파일의 경우 CDN이 아닌 생각할 수 있습니다.
답변
Google에서 jQuery 호스팅 라이브러리를 사용하면 페이지가 더 빨리로드됩니다. 실제로 라이브러리는 이후가 아니라 페이지와 동시에로드됩니다.
댓글
- 하지만 페이지로드에 어떤 영향을 미칠까요?
- 페이지가로드되는 동안 로컬 라이브러리도로드 됨-두 경우 모두 (최신) 브라우저가 다운로드를 트리거하는 코드 스 니펫을 볼 때 자산 다운로드가 시작되며, 일반적으로 전체 문서가 다운로드되기 전에 발생합니다. . 예제는 Firebug 스크린 샷 을 참조하세요.