Optimization techniques
It is important to notice that, in all the examples in this book, we are using apps that have either been created with create-react-app or have been created from scratch, but always with the development version of React.
Using the development version of React is very useful for coding and debugging as it gives you all the necessary information to fix various issues. However, all the checks and warnings come with a cost, which we want to avoid in production.
So, the very first optimization that we should do to our applications is to build the bundle, setting the NODE_ENV
environment variable to production
. This is easy with webpack, and it is just a matter of using DefinePlugin
in the following way:
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: JSON.stringify('production')
}
})
To achieve the best performance, we not only want to create the bundle with the production
flag activated, but we also want to split...