인스타그램은 어떻게 올린 사진을 여러 기기에서 빠르게 보여줄까?

주말에 찍은 사진을 인스타그램에 올린 지민은 친구의 태블릿에서 같은 게시물을 봤습니다. 자기 휴대폰에서는 피드의 작은 사진이었던 것이 태블릿에서는 더 크게 보였습니다. 손가락으로 피드를 내리자 다음 사진도 금세 나타났습니다.

사진 한 장을 올렸는데, 서비스는 화면과 연결 상태가 제각각인 기기에 어떻게 사진을 보여 줄까요?

---

1. 업로드한 사진과 화면에 보여 줄 파일을 나눠 생각합니다

사진을 올리는 것과 다른 사람이 화면에서 사진을 보는 것 사이에는 저장과 전송이 있습니다. 게시물에는 사진을 찾아 표시하는 데 필요한 정보가 연결되고, 사진 데이터는 스토리지에 보관할 수 있습니다. 사진 서비스가 이처럼 게시물과 파일을 구분하면, 같은 게시물에서도 쓰임새에 맞는 파일을 제공할 수 있습니다.

이미지를 전송할 때는 해상도와 파일 용량이 중요합니다. 작은 미리보기라면 화면에 표시할 픽셀보다 훨씬 많은 정보를 매번 내려받을 필요가 적습니다. 메타는 모바일 이미지 전송을 설명하면서 받는 쪽에 맞춰 CDN에서 이미지 크기를 조정할 수 있다고 소개했습니다. 이는 이미지 전달의 일반적인 예시이며, 인스타그램의 모든 사진에 적용되는 변환 규칙을 뜻하지는 않습니다. 메타의 모바일 이미지 업로드 기술 글

2. 화면에 필요한 크기와 표현 방식을 고릅니다

피드에 작게 들어가는 사진과 큰 화면에서 보는 사진은 필요한 정보량이 다릅니다. 화면의 표시 크기에 어울리는 해상도로 조정하거나, 이미지 압축으로 용량을 줄이면 내려받을 데이터가 줄어듭니다. 압축을 강하게 적용하면 미세한 무늬나 경계가 덜 선명해질 수 있어 용량과 품질을 함께 고려합니다.

기기의 화면 특성도 다릅니다. 메타는 인스타그램의 HDR 사진 지원을 소개하며 기기가 표현할 수 있는 밝기와 색의 범위, 여러 플랫폼에서의 표시 경험을 다뤘습니다. 같은 게시물이어도 사진을 표현하는 화면과 처리 조건에 따라 밝기나 색이 다르게 느껴질 수 있습니다. 메타의 인스타그램 HDR 사진 소개

3. 자주 요청되는 사진은 가까운 곳에서 보내 줄 수 있습니다

지민의 게시물을 여러 사람이 볼 때마다 파일을 원본 저장소에서 멀리 보내면 전송 경로에 부담이 쌓입니다. 콘텐츠 전송 네트워크인 CDN은 여러 지역에 거점을 두고 사진 같은 파일을 전달합니다. 가까운 거점에 요청한 버전의 사본이 있고 재사용할 수 있다면, 원본까지 왕복하지 않고 전달할 수 있습니다. 이처럼 다시 쓸 데이터를 보관해 두는 방식을 캐시라고 합니다.

메타의 미디어 플랫폼 팀은 CDN에서 이미지를 제공하는 단계부터 기기에서 표시하는 단계까지를 다룬다고 설명합니다. 예를 들어 작은 버전이 이미 캐시에 있다면 그 버전의 다음 요청은 더 빨리 처리될 수 있습니다. 다른 크기의 사진이 필요하거나 캐시가 없으면 추가 요청과 처리가 필요합니다. 메타의 이미지 전송 및 표시 설명

4. 파일이 도착하면 기기가 화면에 그립니다

마지막 작업은 휴대폰이나 태블릿에서 일어납니다. 앱은 받은 이미지 파일을 화면에 그릴 수 있도록 해석하고, 피드에서 사진이 들어갈 크기에 맞춰 표시합니다. 화면에 작게 그린다는 것과 애초에 작은 파일을 받는 것은 다른 단계입니다. 큰 파일을 받아 축소해 그리면 보기에는 작아도 전송량은 줄지 않습니다.

지민이 두 기기에서 본 것은 같은 게시물이지만, 파일의 크기와 전달 경로, 화면에서 표현되는 밝기까지 같을 필요는 없습니다. 피드에서 사진이 빠르게 나타나는 경험은 저장된 사진을 찾는 일, 필요한 데이터를 보내는 일, 기기에서 화면을 그리는 일이 이어진 결과입니다.