+ 1

Vite

Can someone explain in simple terms what Vite does with React? When I google this I just get some gibberish about bundling. I don’t get it, please explain to a React newbie what it does. Also, do I need it? Or can I just run react from node without and not get whatever special features it adds? Until now I have been coding in an online sandbox but now trying to do it on my own VS code but I having difficulty, so that’s why I’m asking

11th Sep 2024, 1:15 PM
Zvi
Zvi - avatar
3 Answers
+ 5
TLDR: Vite is a bundler, which is like a compiler. It makes it easy for you to construct development builds, production builds, etc. Other tools do that at as well. LONG VERSION: Vite is a modern build tool that significantly improves the development experience for front-end web applications, especially when using frameworks like React. Traditionally, building web applications involves bundling all the code, styles, and assets together, which can be time-consuming and slow during development. Vite changes this by offering fast and efficient build times. It uses a combination of native browser support for ES modules and an optimized development server that only processes the code you’re currently working on, making updates almost instant. The key benefits of Vite include faster startup times and quicker hot module replacement (HMR). With traditional bundlers like Webpack, the entire codebase needs to be bundled before you can see changes. Vite skips this by serving the unbundled source code directly during development and only bundles the code during production builds. This results in a much faster feedback loop when coding, which is especially helpful in large projects where waiting for builds can slow down productivity. Additionally, Vite supports React out of the box, making it easy to set up and start a project without much configuration.
11th Sep 2024, 1:38 PM
Jerry Hobby
Jerry Hobby - avatar
+ 2
Now I feel like a total moron. I just wasted a week of my summer vacation trying to work with React and Vite with vs code. Now I just went through the instructions carefully and everything is very fine!đŸ€Ș
11th Sep 2024, 6:51 PM
Zvi
Zvi - avatar
+ 1
Jerry hobby thanks I’m pretty sure I came across your long version word for word while googling. In your TLDR version you are saying that this will be a compiler which means it will translate what I wrote to be something that the computer will understand without having to do something else that I didn’t learn about. So yeah, for a newbie it’s something that I definitely need(or I need something else like it). Is that correct?
11th Sep 2024, 6:24 PM
Zvi
Zvi - avatar