Hi is there a way to use https://threejs.org/ for Image processing?
Convert raw image from camera and phone camera to compressed JPEG
Resize images and save as compressed JPEG
three.js is probably not the right library to use for that sort of image processing. I would start by looking for a JS library that reads RAW image files from cameras, like dcraw or raw-decoder, depending on what input formats you need to support. Then compress the data with a dedicated compression library like sharp or mozjpeg-js.
Related
I am working on an application where I have lot of images and icons(all png), I found out that the image folder's total size is close to 15MB, which is too much, as I am new to react-native so not sure how this size is impacting the total app size and also I am not sure about the best way to reduce this folder size(i.e., images/icons), should I use svg or any other format for this or is there any other way(i.e., compressing the image/icon size etc.)?
I can see that we can't able to use svg directly, we need to use some library and I don't want to burden my app with any libraries as it's already quite heavy
Thanks and looking for the best solution
You have three options to minimize your image assets bundle size.
Using an image URL - instead of storing images on your app. You can upload images to a server and refer the link to App. some image provider servers.
Cloudinary
Firebase Storage
Using SVG - you said that you don't want to include any libraries check the bundle size of react-native-svg it's a pretty lightweight package.
Use any image compressor - compress your image and use it. you can use
TinyJPG
Compress all images at build time using react-native-imagemin-asset-plugin
I have a base64-encoded jpeg string that I'm holding in state in React. I've been trying to work out how to convert it to a png format base64 string browser-side.
I briefly looked at sharp, but I found that requires a server side node.js environment. I don't really want to have to write my own conversion script. Further searching on npm hasn't yielded anything for me.
Any help with this is very much appreciated.
This is untested, but you should be able to set the base64 JPEG as the source of an image, then draw that image to a canvas using context.drawImage; once it's on a canvas, you can use canvas.toDataURL() to get a base64 PNG of it.
I am building an application which allows users to upload images to a post.
My issue is that some of these images are 10MB plus. I am currently optimising these using a Node.js module which lowers the file size. It does this by re-creating the image with a quality score of 70.
The issue I have is that some users optimize images before uploading. If an image has already been optimized I don't want to lower the quality any further.
Is there anyway I can detect the quality of an image before it is processed?
If you use multer, you can see that in size field, if you have only buffer you can use .length method, example:
buffer.length() // return 255bytes or 255000 255Kb
with imagemagick you can first identify the size and then convert it into small size or crop it
I have around 30 image files and 30 audio files in my Windows 8 Modern(Metro) UI app.Currently my application size is around 30MB.I want to reduce the size of my app.
So is there a way to repesent image files and aduio files in the format of the text/strings using any WinJS API ,so that it reduces size of the application.
If your images or audio are uncompressed for some reason, you could certainly use a compressed format (jpeg or mp3 for example). But, one methodology you might follow to reduce the size of your appx would be to only include images and audio that you immediately need and download the rest from a web service when the app first runs or when the files are actually needed. There is a Compressor Class in WinRT, but it will not give you any real compression benefit over an already compressed image type like jpeg or audio type like mp3.
30MB is an acceptable size for a Windows 8 App. Why are you concerned about the size?
Storing your images as zipped resources won't help because .appx packages are already compressed so all you would do is CPU overhead at runtime because you need to uncompress unnecessarily.
I wouldn't worry about it too much. 30MB is okay but of course you should always strive to keep your size to a minimum. One sure way to reduce size is to be smart on how you store your images and audio files.
For audio files
Check that you don't have uncompressed files (.wav).
Check that your .mp3 files or similar use an appropriate bitrate. You probably only need 128kbps
For image files
Check that your image files use an appropriate compression method. Some files might be okay to store as JPEG, others are best stored as GIF while still others might be best to be stored as PNG.
Optimize your PNG files with tools like PNG Gauntlet. These tools bring down file sizes substantially without reducing quality of the PNG files.
Windows 8 Scaling support
Also, make sure that your images properly support windows 8 image scaling. More information can be found here.
How can I create a Zebra GRF image from HTML5 canvas pixel data or a monochrome BMP file using javascript? I can't find any information on the format of GRF files.
Here is the ZPL programming manual.
The ~DG command will tell you the format of the GRF format. Then it's just some math
You might have to convert this Java code to Javascript, but I came across this and make a command line java app to help. If you can go to the server at all, then you could probably just invoke this app through shell.
https://github.com/asharif/img2grf