🎨
Frontend — 335개 용어
React·Next.js·CSS·성능 지표·빌드 도구
Framer Motion👁 115
React의 선언적 애니메이션 라이브러리. 사실상 표준.
React👁 115
Meta가 만든 UI 라이브러리. 선언적 컴포넌트·단방향 데이터. 프런트엔드 1위.
useTransition👁 115
React 18+의 동시성 훅. 무거운 상태 업데이트를 낮은 우선순위로 처리.
ref (Vue)👁 114
Vue 3 반응형 원시값 래퍼. .value로 접근.
SWR vs React Query👁 114
서버 상태 라이브러리 비교. 기능 vs 간결함.
Code Splitting👁 113
하나의 거대 번들을 여러 청크로 쪼개 필요할 때만 로드하는 기법. 초기 로딩 속도 크게 개선.
CLS👁 112
Cumulative Layout Shift
페이지 로드 중 예기치 않게 레이아웃이 밀리는 정도. 사용자 경험을 크게 해침. 0.1 이하 권장.
Lazy Loading👁 112
지연 로딩
필요한 시점까지 리소스 로딩을 미루는 기법. 이미지·컴포넌트·라우트에 모두 적용.
React Hook Form👁 112
비제어(uncontrolled) 기반 고성능 React 폼 라이브러리. Zod·Yup 연동.
Reconciliation👁 112
React가 두 Virtual DOM 트리를 비교해 변경점을 찾아내는 알고리즘. key prop이 이 과정의 힌트.
Tree Shaking👁 112
사용되지 않는 코드를 번들에서 자동 제거하는 최적화. ES Module의 static 분석 덕에 가능.
CSS-in-JS👁 111
JavaScript 안에 CSS를 작성하는 접근법. styled-components, Emotion, Linaria 등이 대표적.
ESLint👁 111
JavaScript·TypeScript 정적 분석·린터. 코드 품질·버그 예방.
Svelte👁 111
Rich Harris가 만든 컴파일러 프레임워크. 런타임 VDOM 없이 순수 JS로 컴파일.
TSX👁 111
TypeScript + JSX. 타입 안전한 React 컴포넌트의 표준.
unbuild👁 111
Nuxt 팀의 라이브러리 번들러. Rollup·ESBuild 통합.
Container Style Queries👁 110
부모 컨테이너의 속성 값에 따라 자식 스타일 분기.
Headless UI👁 110
Tailwind 팀의 headless 컴포넌트 라이브러리. React·Vue 지원.
Jotai👁 110
Atom 기반 React 상태 관리. 작은 원자 상태들을 조합. Recoil의 단순화 버전.
React Fragment👁 110
여러 요소를 추가 DOM 노드 없이 묶는 React 기능. <>...</>.
Render Tree👁 110
브라우저가 DOM과 CSSOM을 결합해 만드는 실제 렌더링용 트리.
SWC👁 110
Speedy Web Compiler
Rust로 작성된 JavaScript/TypeScript 컴파일러. Babel 대체, Next.js 12부터 기본 채택.
Tailwind vs CSS Modules👁 110
utility-first vs component-scoped CSS. 트레이드오프.
TanStack Form👁 110
타입 안전 프레임워크 중립 폼 라이브러리.
Turbopack👁 110
Vercel이 만든 Rust 기반 차세대 번들러. Next.js 16에서 기본 활성화. Webpack 대비 수십 배 빠름.
useCallback👁 110
함수 참조를 메모이제이션하는 훅. 자식 컴포넌트 리렌더 방지에 활용.
Vitest Browser Mode👁 110
Vitest가 실제 브라우저에서 실행. JSDOM 대신 Playwright.
fetch API👁 109
브라우저 네이티브 HTTP 클라이언트. XMLHttpRequest의 현대 대체.
JSX👁 109
JavaScript 안에 HTML 같은 문법. React의 핵심. Babel·SWC가 트랜스파일.
Microfrontend👁 109
백엔드 마이크로서비스의 프런트엔드 버전. 독립 배포·기술 자유.
Tauri v2👁 109
Rust 기반 데스크톱·모바일 앱 프레임워크. Electron 대안.
tsup👁 109
esbuild 기반 TypeScript 라이브러리 번들러.
TTI👁 109
Time to Interactive
페이지가 완전히 상호작용 가능해진 시점. 긴 작업이 사라진 후.
Vite Plugin👁 109
Vite 플러그인 시스템. Rollup 플러그인과 호환.
Zod👁 109
TypeScript 최초 우선 스키마 검증. React Hook Form·tRPC 파트너.
Next.js👁 108
Vercel의 React 풀스택 프레임워크. SSR·SSG·App Router·PPR.
Panda CSS👁 108
Zero-runtime CSS-in-JS. 디자인 토큰·타입 안전. Chakra UI 팀.
Radix UI👁 108
접근성 완벽 headless 컴포넌트. 스타일 자유, 동작만 제공.
Remix / React Router v7👁 108
웹 표준 중심 React 프레임워크. 2024년 React Router와 통합.
Shadow DOM 스타일링👁 108
:host·::part·::slotted·CSS 변수로 Shadow DOM 경계 관통 스타일링.
TanStack Table👁 108
Headless 테이블 라이브러리. 정렬·필터·페이지네이션·가상화.
useMemo👁 108
비싼 계산 결과를 캐시하는 React 훅. deps 변경 시에만 재계산.
View Transitions API👁 108
페이지·상태 전환 시 부드러운 애니메이션을 CSS로 구현하는 웹 표준. 브라우저가 이전/이후 상태를 자동 크로스페이드.
VoidZero👁 108
Evan You(Vue 창시자)의 회사. Vite·Oxc 통합 도구 개발.
IntersectionObserver👁 107
요소의 뷰포트 진입 여부를 효율적으로 감지하는 브라우저 API. 지연 로딩·무한 스크롤.
reactive (Vue)👁 107
Vue 3 반응형 객체 생성. Proxy 기반.
Shadow DOM👁 107
DOM을 캡슐화하는 브라우저 표준. Web Components의 스타일·마크업 격리.
Sonner👁 107
세련된 React 토스트 라이브러리. shadcn/ui 기본 채택.
TanStack Query👁 107
서버 상태 관리의 표준 라이브러리. 캐싱·동기화·리페칭을 자동화.
useOptimistic👁 107
React 19의 낙관적 업데이트 훅. 서버 응답 전 즉시 UI 반영.