pile·
프론트엔드·oliveyoung올리브영 테크블로그·

Front-end 개발자가 회고하는 기획전 개편

문제기획전 시스템을 JSP에서 Next.js로 전환할 때, 서버에서 HTML 문자열로 저장된 동적 콘텐츠 안에 React 컴포넌트를 삽입해야 했다.
접근dangerouslySetInnerHTML로 HTML을 DOM에 삽입한 뒤 useEffect에서 특정 클래스 요소를 찾아 createRoot로 React 컴포넌트를 독립적으로 주입했다.
결과1,000개 컴포넌트 테스트에서 메모리 영향이 미미했고, iOS lazy loading 이슈를 해결해 기획전 페이지를 Next.js로 성공적으로 전환했다.
oliveyoung
올리브영 테크블로그 블로그
원문은 여기서 이어서 읽을 수 있어요
원문 읽기
읽음 (0)

이 글과 비슷한

  1. 프론트엔드·LINE EngineeringLINE Engineering·

    AI로 웹 엔지니어 없이 LINE 앱 안에서 그룹 영상 통화 서비스 만들기

    LINE Planet 팀의 PM과 Android 엔지니어 두 명이 웹 전문 엔지니어 없이 LINE 앱 내에서 그룹 영상 통화 서비스를 개발한 과정을 다룬다. LIFF(LINE Front-end Framework)와 LINE Planet SDK를 활용해 React/Vite 기반 웹 앱을 구성했고, Firebase Cloud Functions로 별도 서버 인프라 없이 구현을 완료했다.

    #react#webrtc#firebase+2