브라우저가 생각보다 강력한 이유 — Canvas API FFmpeg PDF 모두 브라우저에서

"브라우저는 웹페이지를 보여주는 프로그램"이라는 인식이 있습니다. 하지만 현대 브라우저는 그 이상입니다. 서버 없이 브라우저만으로 할 수 있는 것들을 정리해봤습니다.

---

이미지 처리 — Canvas API

Canvas API는 브라우저에 내장된 이미지 처리 엔진입니다. JavaScript로 픽셀 단위까지 조작할 수 있습니다.

할 수 있는 것들:

• 이미지 크기 조절
• 형식 변환 (JPG → WEBP 등)
• 밝기·대비 조절
• 필터 적용
• 워터마크 추가
• 여러 이미지 합성

서버 없이 브라우저에서 이미지를 편집하는 도구들이 Canvas API를 기반으로 합니다.

---

동영상 처리 — FFmpeg.wasm

FFmpeg는 동영상 처리의 업계 표준 소프트웨어입니다. 원래 서버에서 실행하는 프로그램이지만, WebAssembly 기술 덕분에 브라우저에서도 실행할 수 있게 됐습니다.

FFmpeg.wasm으로 브라우저에서 할 수 있는 것들:

• 동영상 압축 (용량 줄이기)
• 포맷 변환 (MP4, MOV, AVI, WebM 등)
• 동영상 자르기
• GIF 변환
• 오디오 추출

단점은 처리 속도입니다. 서버에서 실행할 때보다 느립니다. 하지만 파일이 서버로 전송되지 않으니 개인 동영상도 안전하게 처리할 수 있습니다.

---

PDF 처리 — pdf-lib

pdf-lib은 JavaScript로 PDF를 조작하는 라이브러리입니다. 브라우저에서 실행되며 서버가 필요 없습니다.

할 수 있는 것들:

• PDF 여러 개 합치기
• PDF 특정 페이지 분리
• 페이지 회전
• PDF 압축

기업용 PDF 편집 프로그램과 완전히 같은 기능은 아니지만, 일상적인 작업은 충분히 처리할 수 있습니다.

---

3D 파일 뷰어 — Three.js

Three.js는 브라우저에서 3D 그래픽을 렌더링하는 라이브러리입니다. WebGL을 더 쉽게 쓸 수 있도록 만들어졌습니다.

Three.js로 브라우저에서 할 수 있는 것들:

• OBJ, FBX, GLB, STL, PLY 파일 열기
• 3D 모델 회전, 확대, 이동
• 조명 조절
• 애니메이션 재생

설치 없이 브라우저에서 3D 파일을 확인할 수 있습니다.

---

암호화 — Web Crypto API

브라우저에 내장된 암호화 API입니다. 별도 라이브러리 없이 사용할 수 있습니다.

할 수 있는 것들:

• SHA-256 해시 생성
• AES 암호화·복호화
• 랜덤 비밀번호 생성
• 디지털 서명

---

파일 시스템 접근 — File System Access API

최신 브라우저에서는 사용자의 파일 시스템에 직접 접근할 수 있습니다. 로컬 파일을 읽고 수정하고 저장하는 것이 브라우저에서 가능해졌습니다.

---

브라우저가 이렇게 강력해진 이유

WebAssembly: C, C++, Rust 같은 네이티브 언어로 작성된 코드를 브라우저에서 실행할 수 있게 됩니다. FFmpeg, 이미지 처리 라이브러리 같은 기존 소프트웨어를 브라우저로 가져올 수 있었습니다.

Web API의 확장: 구글, 모질라, 애플, 마이크로소프트가 웹 표준을 계속 발전시키면서 브라우저가 할 수 있는 것들이 계속 늘어나고 있습니다.

JavaScript 엔진 성능: V8(크롬), SpiderMonkey(파이어폭스) 같은 JavaScript 엔진이 빨라지면서 복잡한 연산도 브라우저에서 처리할 수 있게 됐습니다.

---

정리

현대 브라우저는 이미지 편집, 동영상 처리, PDF 조작, 3D 렌더링, 암호화까지 할 수 있습니다. 서버 없이 브라우저만으로 처리하면 파일이 외부로 나가지 않고, 서버 비용도 없으며, 인터넷 없이도 동작합니다. 웹 기술의 발전이 브라우저를 하나의 운영체제에 가깝게 만들고 있습니다.