Vite's HMR API: Manually Controlling Hot Reloads
Vite's HMR API lets a module handle code changes without a full reload. While frameworks usually manage this, you can use it for custom tooling. The footgun: forgetting to wrap HMR code in `if (import.meta.hot)` will crash your production build.
SvelteKit: From Zero to Dev Server
Spin up a new SvelteKit app with `npx sv create`. This command scaffolds a project, prompting you to add tools like TypeScript. Then, `npm run dev` starts your dev server. The key footgun: forgetting to install dependencies before starting the server.
Scaffolding a Vite Project with `create-vite`
Use `create-vite` to instantly generate a new web project with your chosen framework. It's the fastest way to start a Vue, React, or Svelte app without manual setup. The footgun is forgetting you can pass a `--template` flag to skip interactive prompts.
Why Svelte Skips the Virtual DOM
Svelte skips the Virtual DOM, treating it as runtime overhead. It acts as a compiler, generating precise JavaScript to update the DOM directly. This avoids the 'diffing' step of frameworks like React, leading to smaller bundles and faster updates.
Svelte: A Compiler, Not Just a Framework
Svelte is a compiler that turns your component files into efficient, imperative vanilla JavaScript at build time. This avoids shipping a large runtime, leading to smaller bundles. The footgun is thinking of it as just a runtime; its power is in the build step.
Angular: The 'Batteries-Included' Framework
Angular is a 'batteries-included' framework, providing a complete, official toolkit for routing, forms, and more. This is ideal for large teams needing consistency, but its opinionated nature means fighting the framework if you prefer different tools.