영상 넘기기가 버벅이던 이유와, 영상을 통째로 받아 두기로 한 결정

연예견 · 묘하냥 · 작업한 때 2026년 10월 14일 · 기록 2026년 10월 16일

연예견 피드의 영상은 아래쪽 막대를 손가락으로 끌어 원하는 장면으로 넘길 수 있어요. 그런데 이게 자주 멈칫거렸어요. 10월 14일 하루 동안 이 문제를 여러 겹으로 고친 기록이에요.

첫 번째 겹: 화면을 다시 그리는 일 줄이기

먼저 손가락을 움직일 때마다 생기던 불필요한 일을 줄였어요.

• 넘기기 막대의 진행선과 시간 표시는 매번 화면 구성 요소 전체를 다시 그리는 대신, 해당 요소만 직접 바꿔요.
• 손가락이 움직일 때마다 영상에 “여기로 가”를 쌓아 두지 않고, 하나가 끝나면 가장 최근 위치로 하나만 보내요.
• 넘기는 동안 흐릿한 반투명 오버레이를 숨겨서, 그 뒤의 흐림 효과를 매번 다시 계산하지 않게 했어요.
• 피드의 카드들이 상관없는 변화에도 모두 다시 그려지던 걸 막았어요.

두 번째 겹: 영상이 아직 도착하지 않았다

그래도 멈칫거렸어요. 원인은 영상 파일 자체에 있었어요. iOS로 찍은 영상은 초당 약 10메가비트로 꽤 커요. 10초짜리가 12MB쯤이에요. 게다가 조각난 MP4 형식이라 “몇 초는 파일의 어디쯤” 같은 색인이 없어요. 영상은 저장소에서 스트리밍으로 받고 있었으니, 아직 받지 않은 지점으로 넘기면 플레이어는 그 앞의 조각을 모두 읽을 때까지 기다려야 했어요. 한 화면쯤 지나간 영상은 iOS의 디코더 개수 제한 때문에 소스를 놓았다가, 돌아오면 처음부터 다시 받았고요.

그래서 영상이 화면 근처에 오면 통째로 받아 두고, 그다음부터는 받아 둔 사본으로 재생하기로 했어요. 한 번에 두 개씩 받아요. iOS 앱에서는 앱의 캐시 폴더에 저장해서 앱을 다시 열어도 남아 있고, 최대 300MB까지만 써요. 웹에서는 최근 영상 6개를 메모리에 둬요. 덤으로, 다시 보는 영상은 다시 받지 않게 됐어요.

넘기는 방식도 둘로 나눴어요. 빠르게 휙 넘길 때는 가장 가까운 키프레임으로 바로 가고(빠르지만 정확하지 않아요), 천천히 끌거나 손가락을 멈추거나 놓을 때는 정확한 프레임으로 가요. 휴대폰 영상은 키프레임 사이가 몇 초씩 벌어질 수 있어서, 빠른 방식만 쓰면 그림이 계단처럼 움직이거든요.

세 번째 겹: 파일 읽기가 화면을 막았다

받아 둔 사본으로 바꾸자, 이번에는 영상을 열거나 지나칠 때 화면이 잠깐 멈췄어요. 앱이 로컬 파일을 웹 화면에 넘겨주는 기본 방식이 12MB쯤 되는 파일을 한 번에, 화면을 그리는 스레드에서 읽고 있었어요. 그래서 영상 전용 주소 형식(localclip://)을 직접 만들어, 파일을 256KB씩 나눠 화면 스레드 밖에서 건네주게 했어요.

정리하면

• 버벅임은 대개 한 가지 원인이 아니에요. 화면 그리기, 네트워크, 파일 읽기를 한 겹씩 벗겨야 했어요.
• 휴대폰으로 찍은 영상은 색인이 없는 경우가 많아요. 넘기기가 중요하면 통째로 받아 두는 게 확실해요.
• 큰 파일을 읽는 일은 화면을 그리는 스레드에서 떼어 내야 해요.