This contribution is part of a series of articles that developer Hays has explicitly called upon young developers – with the aim of informing their classes, but of course also interested in “old classrooms”, about current trends, developments, phenomena, and personal experiences. Articles in this series of articles appear on a monthly basis. Are you yourself a “young professional” and want to be a part of this series? Then he submitted to the editorial team a suggestion. She is by your side with helpful advice throughout the writing, editing and approval process.
Problems from webpack
During build, a few more seconds can be controlled relatively. It becomes an issue when developing with the development server, because it also uses web packages. If the developers change a single file, webpack has to recreate entire packages from dozens of files. This is why the so-called hot module replacement – that is, the immediate replacement of changed components in the browser without the need to reload – quickly loses focus when wait times approach ten seconds. Vite only needs 430 milliseconds to start an empty React application, and it takes more than 12 seconds to build a React application or webpack (see next list).
``` yarn run v1.22.10 $ vite ⚡ Vite dev server running at: > Network: http://192.168.56.1:3000/ > Network: http://192.168.10.1:3000/ > Network: http://192.168.2.119:3000/ > Local: http://localhost:3000/ ready in 430ms ``` ``` [13:07:00] yarn run v1.22.10 $ react-scripts start Starting the development server... [13:07:12] Compiled successfully! You can now view cra-example in the browser. Local: http://localhost:3000 On Your Network: http://192.168.56.1:3000 Note that the development build is not optimized. To create a production build, use yarn build. ```