So I tried to the use the package react-image-file-resizer to resize dimensions & reduce size of images and the problem is when i want to get result as String to send it back to the component, I always get this Promise in the method imageFileResizeCompression below.įile : /** Convert an 'Image URL' to a 'Blob' type.Ĭonst convertImageURLToBlob = async (imageInputURL: string) => from '. Resizing an Image with Javascript is fairly simple. One of none, premultiply, or default (default). premultiplyAlpha Specifies whether the bitmap's color channels should be premultiplied by the alpha channel. Let’s take an example of that: If you use this below example that shows to preview the of resizing an image. The available options are: imageOrientation Specifies whether the image should be presented as is or flipped vertically.

Enable JavaScript to view data.I am using an API to get images that have high resolutions & sizes, but when loading the images in the component it took time to load and even the CPU & HDD are used with high percentage when scrolling the list. Installation NPM: npm install croppie Bower: bower install croppie Download: Source Then add the following elements to your page:

Javascript resize image base64