Compressing image with HTML5.
Browser | Version |
---|---|
IE | 10+ |
Chrome | 22+ |
Firefox | 16+ |
Safari | 8+ |
Android Browser | 4+ |
Chrome for Android | 32+ |
iOS Safarri | 7+ |
- Exif.js
- ES6 Promise polyfill.
Via npm:
npm install canvas-compress --save
Via bower:
bower install canvas-compress --save
import { CanvasCompress } from 'canvas-compress';
let compressor = new CanvasCompress(options);
compressor.process(fileBlob).then(({ source, result }) => {
const { blob, width, height } = source;
const { blob, width, height } = result;
...
});
There're four optional properties for options object:
-
type<string>
: output type, default isimage/jpeg
-
width<number>
: output width, default is1000
-
height<number>
: ouput height, default is618
-
quality<number>
: output quality, defalut is0.9
MIT.