Vite got too big to ignore…

This is convenient,   but WebPack is also slow, notoriously annoying to configure, and had a tendency to make developers {ts:67} question their career choices halfway  through writing a webpack config file. ... {ts:80} Unlike Webpack, which was built in the CommonJS era, Vite was designed for a   world where modern browsers already supported native ES modules. So,   instead of bundling everything up front, … ... {ts:192} It is also important to note  that Vite shines when it comes   to performance. It uses fast native tools like esbuild and SWC for heavy   tasks while keeping the rest of the system in JavaScript for flexibility. {ts:203} If needed, framework-specific plugins can … In production, Vite doesn’t just dump your {ts:301} raw module files into the dist folder and lets the browser request them one by one. That would be too slow and will kill the server  with dozens or hundreds of separate HTTP requests. So, for production, Vite will run a Roll-up-based build step which is in charge of bundling modules {ts:316} into fewer, optimized chunks, minifying  and tree-shaking unused code, inlining   small assets like SVGs or tiny images, applying code-splitting so that browsers only download   what’s needed for the current page and, finally, … noticed that we are importing directly   a typescript file, which, of course, is not natively supported by the browser. This is where Vite starts running your code in development mode. When {ts:353} the browser requests a TS file, Vite intercepts the request,   compiles the TypeScript to JavaScript … headaches or the need for manual hard reloads. {ts:378} Next, let’s take it one step further. Splitting projects into multiple files  and modules is something really common,   but we rarely think about what happens under the hood, or the implications for performance. {ts:389} With Vite, you can take advantage of native … {ts:455} bundle stays small, and this chunk only downloads when the user clicks the button. Of course, this is a naive example,   but in real world scenarios the module loaded on demand could be an entire part of your SPA. {ts:467} But what’s really interesting is that Vite doesn’t … For years, build tools tried to be everything at once. Vite went   the other way and focused on keeping the core lean, deferring the rest of the work {ts:506} to plugins, and trusting native browser capabilities instead of replacing them. If you liked this video, you should check out