up:: [[Computing MOC]] tags:: #note/develop #on/computing/programming/tools # Vite Vite is a modern JavaScript build tool and development server. It uses Rollup under the hood for bundling files. ## Browser Support For production builds, Vite targets modern browsers that support native ES Modules. Legacy browsers can be supported by using the `@vitejs/plugin-legacy` plugin. ## Vite vs. Traditional Bundlers Traditional bundlers bundle all your JavaScript modules, CSS, and other assets all at once. Sometimes these are bundled into a single file. This happens every time a change is made, which can lead to slowness as your application grows. Vite takes advantage of native ES modules and serves directly to the browser. It uses Rollup to bundle files, which is faster due to being able to pre-bundle things on the fly. ## Vite vs. Create React App [[Create React App]] (CRA) is a [[React]]-specific build tool. It is considered to be good for beginners. CRA can become slow as your application grows because it uses [[Webpack]] under the hood. Vite is a more generalized tool and has a [[React]] plugin. It uses ES Build to pre-bundle files and do code-splitting on the fly. This allows developers to see their changes in the browser immediately, rather than having to wait for everything to bundle each time. ## References “Vite Guide.” Accessed March 13, 2024. [https://vitejs.dev](https://vitejs.dev). _Vite Crash Course | Faster Alternative To CRA_, 2023. [https://www.youtube.com/watch?v=89NJdbYTgJ8](https://www.youtube.com/watch?v=89NJdbYTgJ8).