Vercel이 30명이던 시절부터 650명이 있는 지금까지 5년동안 일하신 분의 퇴사 기념 회고 글입니다.

좋은 인사이트가 많아요. 원문으로 읽어보시길 추천드려요!

Next.js 15.4 나오면서 16에 대한 얘기를 시작하네요.

• Cache Components 사용, 캐싱 전략 간소화
• Node.js Middleware가 stable로 바뀌게 됨
• Deployment Adaptor (배포시 사용할 수 있는 커스텀 어댑터를 지원하게 된다는 듯)
• Node.js 18 deprecated, next/image API 변경 있을 예정

React Router RSC 프리뷰 관련 후속 글입니다.

Framework Mode를 사용하지 않아도 Data/Declarative Mode 상태로 RSC 사용이 가능하게 될 거라고 해요.

Framework Mode를 사용할 이유가 줄어들었네요.

모든 문서를 마크다운으로 변환해줘요. MCP도 제공하네요.

LLM이랑 대화할 때 솔직히 아무렇게나 막 넣고 잘 대답해주길 바란 적이 많았는데, 제대로 질문하는게 정말로 중요하긴 한가보네요.

번들러들은 코드를 하나로 합칠 때 'scope hoisting' 과정을 거치는데요, 쉽게 말해서 모든 모듈을 전역 스코프로 모으는 겁니다.

원래는 합칠 때 전역 스코프에 싹다 긁어오는게 아니라 각 모듈을 함수 래퍼에 담아서 별도의 스코프로 격리했는데요.

이런 함수 래퍼가 불필요한 런타임 오버헤드를 만드니, 그걸 줄이겠다는 이유로 scope hoisting이라는 방법을 쓴거죠. (거기 더해 변수, 함수가 같은 스코프에 모여있어서 minify, 트리셰이킹도 잘 된다는 장점도 있고요.)

문제는 dynamic import 등의 방법으로 모듈을 여러개로 분리하면서 생기는데요, 이 글에서는 정확히 어떤 문제가 있는지 짚어줍니다. (사이드 이펙트의 실행 순서를 보장할 수 없다, this가 이상하게 들어간다 등)

페이스북은 리액트를 어떻게 서빙하고 있는가?

1. 정적 파일: 바벨로 컴파일, 사내용으로 만든 MakeHaste라는 자체 번들러 사용, i18n / AB 테스트 값들은 빌드 시점에 집어넣음. 즉, 한국어 빌드, Case별 빌드가 따로 나온다는 얘기고, 런타임에 서버에서 해당 플래그 조합을 반영한 번들을 생성, 캐싱하여 제공함. CDN으로 서브.

2. 동적 HTML/JS: Hack이라는 PHP 파생 언어 사용(자기들이 만든듯), 웹 어플리케이션 프레임워크는 사내용으로 만들어서 씀, SSR은 Hermes라는 JS 엔진 사용(이것도 자기들이 만듦)