피드로 돌아가기
Dev.toFrontend
원문 읽기
서버리스 Client-side 처리로 월 $200 비용 제거 및 처리 속도 개선
I replaced a $200/month audio processing server with 40 lines of browser JavaScript
AI 요약
Context
EC2 기반의 FFmpeg 서버를 통해 일평균 2,000건의 오디오 변환을 수행하던 구조임. 파일 업로드 및 다운로드 과정에서 발생하는 네트워크 지연이 실제 변환 시간보다 길어지는 병목 현상과 매달 발생하는 인프라 비용이 주요 한계점으로 작용함.
Technical Solution
- Web Audio API의 decodeAudioData를 활용해 입력 포맷에 관계없이 raw PCM 샘플을 추출하는 디코딩 파이프라인 구축
- WebCodecs API의 AudioEncoder를 도입하여 브라우저 내 하드웨어 가속 기반의 고속 인코딩 구현
- Safari 등 WebCodecs 미지원 브라우저를 위해 FFmpeg.wasm을 Fallback 전략으로 채택하여 호환성 확보
- 500MB 이상의 대용량 파일 처리를 위한 메모리 부족 문제 해결책으로 AudioDecoder 기반의 Streaming Decode 방식 제안
- Client-side 처리를 통해 서버의 CPU 부하를 사용자 기기로 분산하고 데이터 전송 비용을 완전히 제거한 Zero-Infrastructure 설계
실천 포인트
- 하드웨어 가속 지원 여부에 따라 WebCodecs 우선 적용 후 FFmpeg.wasm으로 Fallback 구성 - 메모리 한계를 고려하여 대용량 파일 처리 시 decodeAudioData 대신 Streaming Decode 검토 - 모바일 환경의 낮은 메모리 제한 및 소프트웨어 인코더 사용으로 인한 성능 저하(2~3배) 사전 테스트