Frontend · Learning hub

Vite cheat sheet & developer notes

Vite cheat sheet and 3 curated developer notes — core concepts, patterns, and interview prep. Maintained by the DevRecall team.

Save this stack to your DevRecall Test yourself — Vite quiz More Frontend notes

Vite Configuration & Features

Vite Configuration & Features. Why Vite?. Dev server uses native ES modules — instant server start (no bundling needed). HMR (Hot Module Replacement) is blazing fast — updates only changed module. Production build uses R…

Vite Features & Optimization

Vite Features & Optimization. Vite provides HMR, code splitting, library mode, and multiple build targets. This page covers advanced configuration for production-ready applications.. HMR — Hot Module Replacement. // Vite…

Vite Setup & Configuration

Vite Setup & Configuration. Vite is a next-generation frontend build tool. It uses native ES modules for instant dev server starts and Rollup for optimized production builds.. Scaffolding & Installation. # Create new pro…

From the community

Notes from developers

See all in Frontend →

Zustand

No preview available.

Concepts to know for Vite

ES Modules vs CommonJS: How JavaScript Modules LoadWhy require runs a file on the spot while import builds the whole graph first, what live bindings and circular imports do, and how Node picks a module system.Intermediate·14 min React Server ComponentsHow one React tree becomes two programs, what may cross the server/client boundary, why the payload is not HTML, and how streaming and server actions fit in.Intermediate·14 min The Critical Rendering PathHow a browser turns HTML, CSS and JS into pixels, which resources block which step, and why some CSS changes cost a layout while others cost nothing.Intermediate·14 min Core Web VitalsWhat LCP, INP and CLS actually measure in the browser, the fixes that move each one, and why a green Lighthouse score can go with red field data.Intermediate·14 min Tree Shaking, Code Splitting and Bundle SizeWhy JavaScript bytes cost more than image bytes, how bundlers drop unused exports, what quietly stops them, and how splitting and budgets keep bundles small.Intermediate·13 min

Related stacks

Accessibility Alpine.js Angular Ant Design AppKit Astro Axios Babel Blazor Bootstrap CSS Modules Chakra UI

Browse all stacks →

Keep your Vite knowledge sharp.

Save this stack to your personal DevRecall — add your own notes, track what you're learning, and share what you know with the community.

Get started — free forever