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.