프로덕션 코드 리뷰하다가 등골이 서늘해진 적이 있다. addEventListener는 47번, removeEventListener는 31번.
npm ls framer-motion 치면 나오는 44KB(gzipped). 모달 열고 닫기, 페이지 전환, 리스트 아이템 등장 — 이 중 절반은 이제 브라우저가 공짜로 처리해준다.
모달 열 때 opacity: 0에서 opacity: 1로 트랜지션 주고 싶어서 requestAnimationFrame 안에 requestAnimationFrame을 넣어본 적 있는 사람? 아니면 setTimeout(0) 쓴 사람?
프로젝트에 tooltip 하나 추가하려고 npm install @floating-ui/dom부터 치는 게 프론트엔드 개발자의 근육 기억이었다. 그 근육 기억을 지워야 할 때가 왔다.
지난주 프로덕션 대시보드 페이지에서 버튼 클릭 이벤트를 하나 손봤다. 기존 동기 호출을 async/await로 바꾸고, 그 안에서 상태 업데이트 세 개를 순차적으로 돌렸다.
서버 컴포넌트를 고치고 브라우저를 봤는데, 새로고침을 안 눌렀다. 근데 이미 바뀌어 있었다.
AI 코딩 에이전트한테 "이 버튼 클릭하면 화면 깨져"라고 말하면, 에이전트는 코드를 뒤적거리며 추측한다. 브라우저를 못 보니까.
내가 MPA를 고를 때마다 PM이 한마디 한다. "페이지 전환이 좀 뚝뚝 끊기지 않아요?
Vite 8이 3월에 나왔다. 벌써 두 달인데 아직 7에 머물러 있는 팀이 꽤 보인다.
대시보드 프로젝트 하나를 프로파일링하다가 멍한 순간이 왔다. 진입점에서 import하는 모듈이 62개, 그중 사용자가 실제로 첫 화면에서 쓰는 건 11개.
프로젝트의 package.json을 열어보면 tooltip 하나 띄우려고 설치한 라이브러리가 꼭 하나는 있다.
프레임워크 전쟁의 승자가 결정됐다. Angular 20, Vue 4, Solid, Svelte 5 — 전부 Signals 기반 리액티비티로 수렴했다.
Claude Code한테 "이 버튼 눌렀을 때 콘솔 에러 좀 봐"라고 했더니 돌아온 답이 "브라우저에 접근할 수 없습니다"였다. 당연한 얘긴데, 그 순간 좀 멈칫했다.
프론트엔드에서 탭 UI를 만들 때 가장 짜증나는 순간이 있다. 사용자가 첫 번째 탭에서 폼을 절반 채우고, 두 번째 탭 갔다 돌아왔더니 입력값이 전부 사라진 거다.