网页性能优化,通常要处理图片,尤其图片量大的时候,更需要工具来批量处理,这里使用gulp,做个简单总结
image-resize压缩尺寸
1 var gulp = require('gulp'); 2 var imageResize = require('gulp-image-resize'); 3 gulp.task('resize', function() { 4 return gulp.src('./images/**/*') 5 .pipe(imageResize({ 6 400 7 })) 8 .pipe(gulp.dest('dist/resize')); 9 });
gulp-imagemin品质压缩
1 var gulp = require('gulp'); 2 var imagemin = require('gulp-imagemin'); 3 var pngquant = require('imagemin-pngquant'); 4 gulp.task('min', function() { 5 return gulp.src('./images/**/*') 6 .pipe(imagemin({ 7 progressive: true, 8 use: [pngquant({ 9 quality: '65-80' 10 })] 11 })) 12 .pipe(gulp.dest('dist/min')); 13 })