코딩항해기
[JS] CDN (Content Delivery Network) (+ 문제점) 본문
CDN (Content Delivery Network)
간단하게 말하면 한 줄의 코드로 네트워크를 통해서 필요한 기술들을 가져와 사용할 수 있는 라이브러리라고 할 수 있다.
CDN은 CDN은 콘텐츠를 분산하여 저장한 다음, 요청할 때마다 신속하게 전송해 주는 서버 집단으로, 인터넷 서버와 가까운 위치에 파일을 미리 복사해두고 이를 빠르게 다시 가져가 사용하는 방식이다.
파일을 쉽고 빠르게 다운로드해 사용하는 방식으로, 기존에 외부의 js를 사용하기 위해 코드를 직접 다운로드 받거나 복사해 사용했던 방식을 코드 한 줄로 대신할 수 있고, 웹사이트 로드 속도를 빠르게 해 준다는 이점이 있다.
웹사이트에 처음 접속했을 때 브라우저는 화면을 표시하기 위해 서버로부터 HTML, CSS, Javascript 등의 소스파일과 미디어 파일들을 다운로드해야하는데 웹 서버로부터 물리적인 거리가 멀어질수록 전송 속도가 낮아지기 때문에 지역별로 속도의 차이가 발생하게 된다. CDN을 사용할 경우 전 세계에 있는 서버로 데이터가 분산되어 이런 속도 차이를 개선할 수 있는 것이다.
import 방식
<script src="(링크)"></script>
//head 태그 안에 작성
대표적인 예시로 jquery가 있다. jquery를 사용할 때 별도의 다운로드 없이 상단에 태그 한 줄만 추가하는데, 이 방식이 CDN 방식이다.
CDN의 문제
CDN은 해마다 성장하여 많은 곳에서 사용되고 있다. 다만 CDN을 사용할 때 몇 가지 문제가 있어 주의해야한다는 점이 있다.
· 프라이버시와 보안
웹사이트에서 CDN을 사용할 경우 웹사이트 방문 사실을 운영자, 서버 및 인프라 운영자 외에도 CDN에서 그 사실을 알 수 있다. CDN에서는 로그를 공개하거나 판매하지 않겠다고 했지만 해킹을 당할 우려도 있는 등 프라이버시와 보안에 문제가 있다.
· 시스템 안정성
CDN 자체에 장애가 발생하거나 해킹을 당할 경우 해당 CDN에 의존하는 기능들이 작동이 안 되어 혼란을 초래할 수 있다.
· 속도
지금의 브라우저는 보안 상의 문제로 여러 도메인에서 CDN에게 보내는 요청을 캐싱하지 않는다. 따라서 누군가 이미 라이브러리를 다운로드 하더라도 내가 사용할 때는 다시 다운로드 받아야하는 것이다. 하지만 앞서 이야기 했듯이 프라이버시와 보안 문제는 여전하다.
더보기 (https://www.datadoghq.com/knowledge-center/dns-resolution/)
마무리
CDN을 공부하며 문제점에 대해 참고한 글이 23년도 글이므로 많은 문제 부분이 개선되었을 수 있다. 하지만 CDN이 편리한 기술이라고 무조건 적으로 사용하는 것보단 문제점을 인지하고 사용하는 것이 좋을 것 같아 한 번 정리하게 되었다. 참고 블로그에서도 보완할 여러 확장 프로그램이 있고, CDN의 장점이 많으므로 무조건적으로 피하는 것을 경고하고 있다.
문제점 참고 : https://co1nam.tistory.com/67
'HTML CSS JS' 카테고리의 다른 글
[JS] location.replace() 와 location.href 차이 (+ 페이지 함수) (0) | 2024.09.19 |
---|---|
[JS] JQuery CDN 정리 (0) | 2024.09.17 |
[JS] 모듈 (import, export) (0) | 2024.09.15 |
[JS] jQuery의 prop(), attr() 메서드 비교 (+is() 메서드) (0) | 2024.09.01 |
[JS] Ajax (jQuery, XMLHttpRequest, fetch API) + 비동기처리 (0) | 2024.08.22 |