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

Vercel과 Shopify가 Hydrogen을 오픈소스·런타임 무관 프레임워크로 전면 재설계했다. 기존 Hydrogen은 빠른 헤드리스 스토어프런트 배포를 지원했지만 플랫폼 종속성이 있었고, 새 버전은 Svelte, Nuxt, Next.js 등 어느 JavaScript 프레임워크에서도 동작한다. 3레이어 아키텍처(코어/클라이언트/서버)로 재구성하면서 각 레이어가 명확한 역할을 분담한다.

채널톡이 1년간 미뤄둔 WYSIWYG 에디터 렌더링 끊김을, Andrej Karpathy 의 Auto Research 방식(점수 오르면 keep, 안 오르면 git revert)으로 AI 에게 맡겨 최적화한 실험기를 다룬다. 핵심 교훈은 "더 똑똑한 모델"보다 체감 성능을 제대로 반영하는 평가 루프(점수표)를 설계하는 게 관건이라는 점이다.

채널톡 Desk 실시간 채팅 SaaS 에서 입력·소켓 처리 병목으로 사용자 INP 가 느렸다.

배달앱의 복잡한 UI/UX 를 AI 대화 안에서 자연스럽게 처리하려면 플랫폼이 데이터·기능을 노출해야 했다.

1년치 FE 동향을 한 번에 따라잡고 싶을 때 흩어진 글을 모으기 번거롭다.

React Server Components의 Server Function 엔드포인트에서 DoS를 유발할 수 있는 고심각도 취약점이 CVE-2026-23864로 공개됐다. CVSS 7.5 수준으로 원격 코드 실행은 없지만 서버 충돌·OOM·과도한 CPU 사용을 일으킬 수 있으며 Next.js 13.x~16.x를 포함한 광범위한 React 에코시스템 프레임워크가 영향을 받는다.

게임 엔진 경험 없이 웹뷰 게이미피케이션 앱(일해라 김뱅샐)을 만들어야 했다. 캐릭터 옷 조합 수가 폭발적으로 늘어 모든 조합마다 애니메이션 파일을 만들 수 없었고, iOS 웹뷰에서 화면 깜빡임도 발생했다.

리액트 성능 최적화가 릴리즈 후 문제 발생 시 증상을 쫓는 방식으로 이루어지는 현실을 비판하며, react-best-practices 저장소가 임팩트 크기 순으로 정렬된 8가지 최적화 카테고리와 실제 코드 비교를 제시한다. 비동기 워터폴 제거, 번들 크기 축소, 불필요한 리렌더 방지를 세 가지 반복 문제로 진단한다.

AI 스트리밍 앱을 위한 react-markdown 대체 라이브러리 Streamdown이 v2에서 플러그인 기반 아키텍처로 전환해 번들 크기를 대폭 줄였다. 코드 블록·Mermaid·수식·동아시아 언어 등을 필요한 플러그인만 임포트해 선택적으로 로드하며, 스트리밍 중 커서 인디케이터와 configurable한 마크다운 힐링 옵션도 추가됐다.

React 19 의 Server Components 구현에서 두 가지 보안 취약점이 발견되었다. App Router 엔드포인트를 노린 악의적 HTTP 요청으로 서버를 멈추거나(CVE-2025-55184, DoS), 서버 액션의 컴파일된 소스 코드를 추출(CVE-2025-55183, 소스 노출)할 수 있다. React 19.2.2 이상, Next.js 14.2.35/15.0.7/15.1.11 이상으로 즉시 업그레이드가 필요하다.

React Server Components 의 핵심 취약점 React2Shell(CVE-2025-55182)을 중심으로 연관 CVE 3건(CVE-2025-66478, CVE-2025-55184, CVE-2025-55183)을 종합한 보안 공지다. Next.js 14~16 전 버전에 영향을 주며, 패치 버전별 업그레이드 표와 npx fix-react2shell-next 자동 수정 도구를 제공한다.

React Server Components 의 Critical 취약점 CVE-2025-55182 의 기술 세부사항을 정리한 글이다. React 19 의 Server DOM 패키지들이 untrusted input 을 처리하는 방식의 결함으로 RCE 가 발생하며, Next.js 외에도 Vite, Parcel, React Router, RedwoodSDK, Waku 등 RSC 를 사용하는 광범위한 프레임워크가 영향을 받는다.

Vite + React CSR 앱에서 멤버십 플랜별 동적 OpenGraph가 필요했지만 소셜 크롤러가 JS를 실행하지 않아 CSR에서는 초기 HTML에 메타 태그를 심을 수 없었다.

AI 스트리밍 마크다운 렌더링 라이브러리 Streamdown 1.6 이 출시됐다. memoization·LRU 캐싱·정규식 제거로 처리 속도를 높이고, React Suspense 레이지 로딩과 자체 마크다운 렌더러 도입으로 번들 크기를 줄였다. 정적 컨텐츠용 Static Rendering Mode 도 추가됐다.

화상회의에서 1명~수십 명을 다양한 화면 비율(모바일~21:9)에서 비율 제약(4:3~16:9, 최소 160px)을 지키며 공간 낭비 없이 동적으로 배치해야 했다.

인프런 강의실의 10개 이상 모달이 서로를 직접 호출해 조건 분기가 파일 곳곳에 흩어져 있고, 정책 변경마다 여러 컴포넌트를 동시에 수정해야 한다.

지도 위 마커 드래그 이벤트(60fps)마다 수백~수천 개 마커 전체와 거리 계산 → O(n) 반복으로 CPU 자원 급격히 소모

Vercel이 AI SDK와 연동되는 React 컴포넌트 오픈소스 라이브러리 AI Elements를 공개했다. shadcn/ui 기반의 메시지 스레드, 입력 상자, 추론 패널, 응답 액션 컴포넌트를 조합해 AI 채팅 UI를 빠르게 구성할 수 있다.

AngularJS 기반 두 어드민의 기술 부채, Native SDK의 느린 배포 주기, 파트너사별 맞춤 UI 요구사항이 복잡하게 얽혀 있었다.