Rust와 WASM으로 구현하는 브라우저 기반 고성능 스타필드 효과

Context

복잡한 그래픽 엔진 없이 브라우저에서 효율적인 3D 시각 효과를 구현하려는 목적. WASM 환경에서 Rust의 성능을 활용하여 렌더링 루프와 투영 수학을 직접 제어하는 구조적 접근 필요.

Technical Solution

• Macroquad 라이브러리를 활용하여 추상화 계층을 최소화한 직접적인 렌더링 루프 설계
• wasm32-unknown-unknown 타겟 컴파일과 HTML5 Canvas 및 JS Shim을 이용한 경량 WebGL 브릿지 구성
• rand 크레이트의 default-features를 제거하고 small_rng 기능만 활성화하여 브라우저 빌드 호환성 확보
• z축 좌표를 기반으로 한 3D-to-2D 투영 공식 적용으로 전진하는 공간감 구현
• depth_factor(1.0 - z/STAR_DEPTH)를 계산하여 거리별 원의 크기와 밝기를 동적으로 조절하는 시각적 깊이감 부여
• z값이 임계치(0.2) 미만으로 떨어질 때 좌표를 재설정하는 객체 재사용(Recycle) 전략으로 무한 루프 구현

Key Takeaway

복잡한 프레임워크 없이 핵심 수학 원리와 가벼운 렌더링 라이브러리 조합만으로도 WASM 환경에서 충분한 시각적 퍼포먼스 구현 가능.