Vite: Blazing-Fast Tooling That Could Change How You Code

Have you heard of Vite the modern and super-fast tool for scaffolding projects? Its spreading like wild fire due to its almost immediate code compilation and fast hot module replacement.

Vite is one of many tools that have come along to help developers get projects kicked off. Maybe youve used Babel, webpack and Create React App in the past. Vite is the next new thing to make our lives easier.

These feature-rich CLI tools provide a boilerplate setup, code transpilation, helpful optimizations and/or a dev server with hot module replacement out of the box. No longer do we have to create a bunch of HTML, CSS, and JS files, or deploy our projects manually via FTP clients, and files were uploaded as they were, without any processing and optimizations like minification and compressing.

So What Makes Vite Different?

Vite may just be our fastest bundler/compiler/dev server yet. On top of that, it provides a great developer experience.

Created by Evan You, the creator of the Vue.js framework, Vite runs a server to compile and serve on the fly any required dependencies via ES modules. This approach allows Vite to process and provide only the code thats needed meaning Vite handles less code during the server startup and doesn't have to pre-compile unnecessary code.

Where webpack bundles all files in the project before the development server is ready, thereby growing slower the bulkier a project grows, Vite stays nimble, working with ES modules to serve code as needed.

Vite also uses esbuild for pre-bundling dependencies during development. esbuild is an extremely fast JavaScript bundler written in the Go language. This makes it much faster than other bundlers like webpack, Rollup and Parcel, which were written using JavaScript.

On top of its speed, Vite is framework-agnostic. While a lot of popular frameworks provide official CLIs that can be used to scaffold projects (e.g., React offers Create React App, and Vue has Vue CLI), you can use Vite across the board, so its as versatile as you are.

Learn More About Vite and How To Use It

Would you like to know how to set up path resolving, use environmental variables, scaffold a project and see pros and cons of Vite? Ive written an in-depth guide to Vite that talks through more details about how its different as well as how to use it to get your project up and running.