I built a chat app using reactJs and firebase when I upload images which size in kb it successfully uploading but when I want to upload images even sizes can be in MB,s But I want to degrade the size of these images before uploading. What is the best way I can achieve this by using reactjs?
Asked
Active
Viewed 801 times
0
-
Resizing images in React is unrelated to Firebase. See https://stackoverflow.com/q/47396784 and https://stackoverflow.com/q/54759082 – Frank van Puffelen Jul 07 '19 at 19:37
1 Answers
2
WEBP format of image is designed to reduce image file sizes over standard JPEG compression while maintaining the same or similar quality. So you can convert large image files to smaller size.
You can use webp-converter
,a npm package for converting JPG, JPEG and other image formats to WEBP format.
- Install package
npm i webp-converter
- Import module as
import webp from 'webp-converter';
. - Implement as in a function:-
webp.cwebp("input.jpg","output.webp","-q 80",function(status,error){
console.log(status,error);
});
- Push output.webp to firebase database.
Detailed package implementation details:- webp-converter

Abhinav Kinagi
- 3,653
- 2
- 27
- 43