In this article, we will learn how to compress react app.
we will use the compress-create-react-app to compress react app.
By adding post build compression to your create-react-app build without configuration, you can make your apps smaller.
uses the brotli and gzip algorithms to compress all of the html, CSS, and javascript files in the build folder.
-First of all, we have create react application.
-Then create an App.js file inside the src directory.
-After creating the App.js application, Install the required module using the below command.
npm install compress-create-react-app --save-dev
-Then edit the package.json build script for your application:
"build": "react-scripts build && compress-cra",
“build”: “react-scripts build && compress-cra -d build”,
(build: – build folder name )
(You can provide an optional path to your build directory by adding -d or –directory)
example:
"build": "react-scripts build && compress-cra -d ../code/src/res/views/react_UI",
-Build your app:
1.
npm run build
2.
serve -s build
-then run your project and check in network file size or in your build folder, file created with .br or .gz extension
