How To Compress React App

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)


"build": "react-scripts build && compress-cra -d ../code/src/res/views/react_UI",

-Build your app:


npm run build


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

Submit a Comment

Your email address will not be published. Required fields are marked *


Select Categories