웹뷰 LCP 를 줄인 배민 critical-script, 번들보다 먼저 API 를 부르는 구조
정적 배포 웹뷰에서 API 요청을 HTML 인라인 스크립트로 앞당겨 번들 로딩과 겹치게 한 방식이다. 운영 LCP 가 25~35% 줄었고, 프리렌더하는 Vite 기반 React 앱이면 공개 플러그인을 바로 붙일 수 있다.
정적 배포 웹뷰에서 API 요청을 HTML 인라인 스크립트로 앞당겨 번들 로딩과 겹치게 한 방식이다. 운영 LCP 가 25~35% 줄었고, 프리렌더하는 Vite 기반 React 앱이면 공개 플러그인을 바로 붙일 수 있다.
여섯 방식은 HTML 을 만드는 때(빌드·요청·브라우저)와 브라우저로 보내는 코드로 갈린다. Next.js 16 문서 기준으로 동작, 장단점, 코드, 화면별 선택 예를 정리했다.
21st.dev·affectUI 는 에이전트가 바로 설치하는 React 컴포넌트를, Inspora 는 디자인 사례를, Prompt Motion 은 모션 영상 프롬프트를 준다. 직접 열어 보고 쓰임새와 비용을 갈랐다.