Create-React-App production version differs from developer version

Question

I have deployed a react app, and when I run the code locally, it seems to be smaller than when it is deployed with the production version. The CSS is identical on both, and I'm using Google chrome when I test both. The pages appear to be smaller (Example: padding with the CSS and the different divs I have), then when I look at the deployed version of the exact same code, some of the divs are off the screen. I'm running the same code on the same computer on the same browser, not sure why this happens. The error I'm having is the size visually appears to be smaller on the production version than when I run it locally.

Answer 1

In the CRA(Create-React-App) project, we are using react and some dependency npm packages. The source of the project will be smaller but if you make it as production, it will bundle all into one or multiple js files.

So you don't need to install dependencies in production but just copy build or dist folder to your server.

Answer 2

The production instance of create-react-app is minified and bundled into few files, optimizing your code for performance and also some dependency which are only needed for production have been avoided. that yields a smaller size compared to the development