inflearn logo
강의

Course

Instructor

Real-world web performance optimization for frontend developers (feat. React) - Part. 1

1-5) Image size optimization

Image CDN 개념 관련 질문

1798

ktw23786330

25 asked

1

안녕하세요! 강의 너무 잘 듣고 있습니다.
 
해당 강의에서 Image CDN에 대해 '기본적인 CDN의 개념 + 이미지를 사용자에게 보내기 전에 특정 형태로 가공하거나 혹은 사이즈를 줄인다거나 이미지 포멧을 바꾼다거나 하는 등의 처리과정을 거쳐 사용자에게 이미지를 전달해주는 것이다.' 라고 개념 설명을 해주셨고, 이후에 brunch.co.kr의 사례를 보여주시며 해당 사이트는 직접 Image CDN을 구축해서 사용했다고 하셨습니다.
 
그리고 imgIX까지 보여주시며 우린 이런 솔루션을 통해서 Image CDN을 사용할 수 있다고 하셨는데, 해당 강의의 마지막에는 unsplash 함수를 이용하여 이미지 사이즈를 최적화해주는 방법을 사용하셨습니다.
 
그럼 마지막에 unsplash에서 제공하는 querystring을 이용한 함수를 사용하신건 Image CDN을 했다고 할 수 있는건가요? Image CDN이 사이즈를 줄이거나 포멧을 바꾸는 처리과정을 거치는 기술이라 정의한다면 마지막에 unsplash 함수를 사용하신 것도 분명 Image CDN의 일종이라고 볼 수 있을 것 같은데, 중간에 우리는 Image CDN을 사용하지 않고 이미지를 최적화할 것이라고 하셔서 개념적인 부분이 다소 헷갈리는 것 같습니다!
 
해당 강의에선 ImageIX가 아닌 unsplash 공식사이트에서 제공하는 방법을 이용하신 것 같은데, 대부분의 경우에는 ImgIX나 daumcdn과 같은 방법을 통해 이미지 사이즈 최적화를 하게 되나요?

react devtools

Answer 2

1

ktw23786330

끝까지 다시 듣다보니 unsplash가 Image CDN의 역할을 해주셨다고 하여 첫 번째 질문에는 굳이 답해주지 않으셔도 될 것 같습니다 ㅎㅎ.. 죄송합니다!

 

두 번째 질문에만 답변 주시면 감사하겠습니다. 강사님 좋은 강의 제공해주셔서 감사합니다 :)

0

hackurity01

안녕하세요, 강태웅님,

이미지 CDN에 대해서 질문을 주셨는데요,

첫 번째 질문에 대해서는 답을 찾으셨다니 다행입니다.

두 번째 질문에 대해서 답을 드리면,
대부분의 서비스(회사)에서 자체 이미지 CDN을 구축해서 사용합니다.
물론, 요즘에는 모든 기능들을 일일이 구현하지는 않고 클라우드 서비스를 통해서 구축하기도 합니다.
(예를 들어 아마존의 S3나 CloudFront 가 있습니다.)

추가적으로 몇 가지 오해하시는 부분이 있는 것 같아 정정하자면,
이미지 CDN은 "사이즈를 줄이거나 포멧을 바꾸는 처리과정을 거치는 기술"이 아니라 이미지 제공에 특화된 CDN이라고 봐야합니다.
거기에 사이즈를 줄이거나 포멧을 바꾸는 처리과정이 들어가는 거죠.

그럼 답변이 도움되셨길 바라며, 강의에 관심을 가져주셔서 감사합니다. :)

bundle analyzer 에 대한 질문이 있습니다.

0

108

2

Cannot find module serve 에러

1

104

1

성능 탭에서 소요시간이 안보입니다

0

205

2

이미지 CDN 만드는 방법

0

459

1

Performance FPS 탭이 안보여요.

1

798

1

CPU throttling이 뭔가요?

0

1119

1

default export가 아닌 named export일 때 lazy사용법

1

1070

1

lazy적용하였는데 네트워크탭에 분리하여 보이지 않습니다

1

583

1

network 캐싱에 대해서 질문 있습니다!

1

427

1

vue project에서 chrome performance tab 확인하기

1

458

1

node version으로 인한 오류

4

1232

1

강의 자막

1

956

2

번들파일과 병목현상 질문

2

396

1

webpack-bundle-analyzer 질문

1

786

1

이미지 프리로딩 질문

1

385

1

이미지 최적화 활용

1

582

1

강력 새로고침

1

323

1

Suspense 관련해서 질문드립니다

2

360

1

config-overrides cant resolve path

1

362

1

이미지 preload 컴포넌트 preload 차이 질문드립니다.

1

611

1

custom react 환경에서 node_modules chunk 분리

1

381

1

removeSpeical 함수를 줄여야겠다고 하는 이유!

1

283

1

Factory pattern에 대해서 궁금한 점이 있습니다

2

367

2

텍스트 압축 방식에 대해 질문이 있습니다

2

952

1