Middleware를 통한 wildcard subdomain 최적화 (Lighthouse 42 => 92점) 와일드카드 서브도메인으로 들어오는 요청들을 클라이언트 레벨에서 url 정보를 이용해서 데이터를 서버로부터 받아오는 방식으로 성능 뿐 아니라, 메타 데이터와 OG image를 동적으로 생성하고 문제가 있었습니다. 페이지에 request가 도달하기 이전에 Next.js middleware를 활용하여 각각의 request들을 하위 디렉토리로 rewrite하였고, 하위 디렉토리 페이지에서 ISR 을 통해서 지원하여 페이지를 빌드 시점에 생성하여 성능을 2배 이상 향상시킬 수 있었습니다 3D 모델 파일 에디터 개발 3D 모델러가 AWS S3와 JSON에 직접 수정해서 glb(3D 파일)의 이벤트를 수정하는 업무를 하고 있었습니다. 이로 인해 3D 모델러와 Web GL 개발자의 커뮤니케이션 비용 증가, 병목현상이 발생하였는데 3D 파일을 웹에서 수정할 수 있는 백오피스 에디터를 처음부터 개발하여 병목현상을 제거하였고, 30% 이상 업무 시간을 줄였습니다 Jest, React testing library를 도입을 제안하여 통합 테스트를 작성하였고, 코드 안정성을 향상시켰습니다. 성능 최적화 CRA으로 만들어진 기존 프로젝트의 빌드툴을 Webpack에서 Vite로 마이그레이션하였습니다. 빌드 시간 2.2배 단축과 프론트엔드 개발 환경을 개선 회사 3D 페이지 reflow 방지를 통한 렌더링 개선, 3D 모델 Suspense를 통한 로딩 최적화

더보기