3.1 Authenticate Server Actions Like API Routes핵심: Server Action 내부에서 인증/인가를 반드시 검증한다.왜 중요한가: 액션은 엔드포인트처럼 호출 가능하므로 보안 경계가 필요하다.코드리뷰 신호: action 함수 내부에 auth/authorization 검증이 없다. action 함수 내부에 auth/authorization 검증이 없다 코드는 보통 구현 편의 때문에 생기지만, 트래픽이 늘면 병목으로 확대된다. 이 항목의 핵심은 문법 변경이 아니라 실행/렌더 흐름을 정리해 Server Action 내부에서 인증/인가를 반드시 검증한다를 기본값으로 만드는 데 있다. 변경 뒤에는 서버 응답 시간, DB/외부 API 호출 수, 캐시 적중률와 회귀 테스트를 같이..

2.1 Avoid Barrel File Imports핵심: 대형 라이브러리는 배럴 import 대신 직접 import를 사용한다.왜 중요한가: 불필요한 모듈 해석/번들 포함을 줄인다.코드리뷰 신호: 아이콘/컴포넌트 라이브러리를 루트 엔트리에서 구조분해 import한다. 실무에서 아이콘/컴포넌트 라이브러리를 루트 엔트리에서 구조분해 import한다 부분만 단발성으로 고치면 같은 문제가 다시 나오기 쉽다. 작은 단위(한 페이지, 한 훅, 한 API)부터 대형 라이브러리는 배럴 import 대신 직접 import를 사용한다 패턴을 적용하고, 경계 케이스를 함께 정리해야 회귀를 줄일 수 있다. 이후 번들 분석 결과(엔트리 청크, 라우트별 청크)와 초기 JS 파싱 시간을 배포 전후로 비교해 불필요한 모듈 해석/..

Vercel Labs에서 skill로 공유한 React Best Practices를 개인 공부용으로 사람이 읽기 좋게 정리하고 설명을 다시 작성한 글입니다. 나중에 슥슥 읽으려고 AI와 함께 작성한 글이니까 이상한 부분 있으면 알려주세요. 1.1 Defer Await Until Needed핵심: await는 실제로 필요한 분기 안으로 옮긴다.왜 중요한가: 불필요한 대기를 제거해 응답 시간을 즉시 줄일 수 있다.코드리뷰 신호: `early return`이 가능한데도 그 전에 실행되는 오래 걸리는 비동기 호출이 있다. `early return`이 가능한데도 그 전에 실행되는 오래 걸리는 비동기 호출이 있다 징후는 기능을 빠르게 추가할 때 쉽게 누적된다. 먼저 의존성이 없는 작업은 먼저 시작하고, 실제 소비 ..