A bundler is a development tool that combines many JavaScript code files into a single one that is production-ready loadable in the browser
For example:
- parcel
- webpack (used by
create-react-app
) and - vite ( prounounced as veet)
Parcel is a bundler used for development and productions purposes.
- HMR - Hot Module Replacement - parcel keeps track of file changes via file watcher algorithm and renders the changes in the files
- File watcher algorithm - made with C++
- MINIFY
- BUNDLING
- Cleaning our code
- DEV and production Build
- Super fast building algorithm
- does image optimization also
- Caching while development
- Compresses
- Compatible with older version of browser
- HTTPS in dev
- port Number
- Consistent hashin algorithm
- Zero Configuration
- Install:
npm install -D parcel
-D
is used for development and as a development dependency.
- Parcel Commands :
- For development build:
npx parcel <entry_point>
- For production build :
npx parcel build <entry_point>
It is not only the virtual DOM that makes React faster but other components like bundlers (e.g. parcel, webpack ,vite etc. ) and development ecosystme also.
It is a type of dependency where one dependency requires another dependency to work properly and another dependency requires an another dependecy.