Skip to content

GitLab

Commit cac2ee4a authored by Stefan Galinski's avatar Stefan Galinski 🎮
Browse files

[FEATURE] Use lossy jpg compression (85%), respect .jpeg extension (Hint:... 

[FEATURE] Use lossy jpg compression (85%), respect .jpeg extension (Hint: images:uploaded will always report changes now, but tons of MB are saved now)
parent b1312d02
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 911 additions and 443 deletions
core/tasks/images.js
View file @ cac2ee4a
......@@ -3,7 +3,7 @@ const Task = require('../task');
const globby = require('globby');
const fs = require('fs');
const imagemin = require('imagemin');
const imageminJpegtran = require('imagemin-jpegtran');
const imageminMozjpeg = require('imagemin-mozjpeg');
const imageminPngquant = require('imagemin-pngquant');
const imageminGifsicle = require('imagemin-gifsicle');
const imageminSvgo = require('imagemin-svgo');
......@@ -47,7 +47,7 @@ module.exports = class Images extends Task {
try {
this._config.images.optimize.forEach(async imagesPath => {
tasks.push(new Promise(async resolve => {
const files = await globby([`${imagesPath}/**/*.{png,jpg,gif,svg}`]);
const files = await globby([`${imagesPath}/**/*.{png,jpg,jpeg,gif,svg}`]);
await this._optimize(files, imagesPath);
resolve();
}));
......@@ -57,8 +57,8 @@ module.exports = class Images extends Task {
this._handleError(error);
}
if (
this._config.hasOwnProperty('logMessages')
&& this._config.logMessages.hasOwnProperty('images:uploadedSuccess')
this._config.hasOwnProperty('logMessages') &&
this._config.logMessages.hasOwnProperty('images:uploadedSuccess')
) {
let messageConfig = this._config.logMessages['images:uploadedSuccess'];
this._logger[messageConfig.level](messageConfig.message);
......@@ -74,17 +74,17 @@ module.exports = class Images extends Task {
async _optimizeExtensionImages() {
return new Promise(async resolve => {
const imagesPath = this._getFullPath(this._config.directories.images);
const files = await globby([`${imagesPath}/**/*.{png,jpg,gif,svg}`]);
const files = await globby([`${imagesPath}/**/*.{png,jpg,jpeg,gif,svg}`]);
try {
await this._optimize(files, imagesPath);
} catch (error) {
this._handleError(error);
}
if (
this._config.hasOwnProperty('logMessages')
&& this._config.logMessages.hasOwnProperty('imagesSuccess')
this._config.hasOwnProperty('logMessages') &&
this._config.logMessages.hasOwnProperty('imagesSuccess')
) {
let messageConfig = this._config.logMessages['imagesSuccess'];
let messageConfig = this._config.logMessages.imagesSuccess;
this._logger[messageConfig.level](messageConfig.message);
}
this._logger.info(`Task ${chalk.bold('images')} finished after ${this.getElapsed(hirestime.S)}s`);
......@@ -99,20 +99,20 @@ module.exports = class Images extends Task {
* @param {String} _imagesPath
*/
async _optimize(_files, _imagesPath) {
return new Promise(async (_resolve) => {
return new Promise(async _resolve => {
if (_files.length === 0) {
this._logger.success(`No images found in ${_imagesPath}. Moving on.`);
_resolve();
}
if (!this._embedded) {
this._loadingSpinner = ora();
this._loadingSpinner.start(`Optimizing images...`);
this._loadingSpinner.start('Optimizing images...');
}
let queue = async.queue((image, callback) => {
this._optimizeImage(image).then(callback);
}, 20);
_files.map(async (image) => {
queue.push(image, (_error) => {
_files.map(async image => {
queue.push(image, _error => {
if (_error) {
this._handleError(_error.message);
}
......@@ -127,7 +127,7 @@ module.exports = class Images extends Task {
// emit empty line before
console.log();
this._logger.warning(chalk.bgYellow(chalk.black(' Please note that the following images have been skipped due to an error:')));
this._failedFiles.forEach((file) => {
this._failedFiles.forEach(file => {
this._logger.warning(chalk.white(` - ${file.name}:`));
this._logger.warning(chalk.whiteBright(` ${typeof file.error === 'string' ? file.error : 'Error unknown'}`));
});
......@@ -160,7 +160,7 @@ module.exports = class Images extends Task {
try {
result = await imagemin.buffer(buffer, {
plugins: [
imageminJpegtran(),
imageminMozjpeg({quality: 85}),
imageminPngquant({quality: [0.65, 0.8]}),
imageminGifsicle(),
imageminSvgo({
......@@ -182,37 +182,38 @@ module.exports = class Images extends Task {
this._logger.warning(`Skipping ${_image}`);
return resolve();
}
this._totalBefore += buffer.length;
this._totalAfter += result.length;
let info;
if (buffer.length === result.length) {
// don't bother
resolve();
} else {
let info;
if (buffer.length === result.length) {
info = chalk.dim('(already optimized)');
} else {
let saved = buffer.length - result.length;
let savedPercentage = Math.round((saved / buffer.length) * 100);
info = `(saved ${prettyBytes(saved)} ~ ${savedPercentage}%)`;
if (savedPercentage >= 20) {
info = chalk.bgGreen(chalk.black(`${info}`));
}
}
let message = `${chalk.white(_image.replace(`${this._getFullPath(this._config.directories.images)}/`, ''))} ${chalk.magenta(`${info}`)}`;
fs.writeFile(_image, result, (error) => {
if (error) {
this._handleError(error.message);
}
if (!this._embedded) {
this._loadingSpinner.clear();
this._loadingSpinner.frame();
}
this._logger.success(message);
this._touchedFiles += 1;
resolve();
});
return resolve();
}
let saved = buffer.length - result.length;
let savedPercentage = Math.round((saved / buffer.length) * 100);
if (savedPercentage <= 0) {
return resolve();
}
info = `(saved ${prettyBytes(saved)} ~ ${savedPercentage}%)`;
if (savedPercentage >= 20) {
info = chalk.bgGreen(chalk.black(`${info}`));
}
let message = `${chalk.white(_image.replace(`${this._getFullPath(this._config.directories.images)}/`, ''))} ${chalk.magenta(`${info}`)}`;
fs.writeFile(_image, result, error => {
if (error) {
this._handleError(error.message);
}
if (!this._embedded) {
this._loadingSpinner.clear();
this._loadingSpinner.frame();
}
this._logger.success(message);
this._touchedFiles += 1;
return resolve();
});
});
});
}
......
package-lock.json
View file @ cac2ee4a
This diff is collapsed.
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment