webiny-js icon indicating copy to clipboard operation
webiny-js copied to clipboard

Sharp png compression is not working inside webiny package

Open sunnythelucky opened this issue 3 years ago • 1 comments

Version

5.25.0

Operating System

OS

Browser

Chrome

What steps will reproduce the bug?

We modified compressionLevel in optimizeImage.ts and transformImage.ts from ./node_modules/@webiny/api-file-manager/handlers/transform and then use patch command to update @webiny package in node_module. But the png image is not being compressed as we expected. So we tested it with a separate script using exact same version of sharp and see if the compression makes any issue that turned out to be not happening. What we want to do is to compress Image after resizing.

What is the expected behavior?

compress png => resize => compress png

What do you see instead?

.png({compressionLevel: 9}) is not working properly instead when we run .toFormat("jpeg",{ quality : 50}) on png, it works just fine

Additional information

No response

Possible solution

No response

sunnythelucky avatar Apr 06 '22 19:04 sunnythelucky

##optimizeImage.js

var _default = async (buffer, type) => {
    switch (type) {
        case "image/png": {
            return await (0, _sharp.default)(buffer)
                .png({
                    compressionLevel: 9,
                    quality: 50,
                    force: true
                })
                .toBuffer();
        }

        case "image/jpeg":
        case "image/jpg": {
            return await (0, _sharp.default)(buffer)
                .toFormat("jpeg", {
                    compressionLevel: 9,
                    quality: 50
                })
                .toBuffer();
        }

        default:
            return buffer;
    }
};

##transformImage.js

var _default = async (buffer, type, transformations) => {
    const { width } = transformations;
    switch (type) {
        case "image/png": {
            return await (0, _sharp.default)(buffer)
                .resize({
                    width
                })
                .toFormat("jpeg", {
                    quality: 50
                })
                .toBuffer();
        }

        case "image/jpeg":
        case "image/jpg": {
            console.log(type);
            console.log(transformations);
            return await (0, _sharp.default)(buffer)
                .toFormat("jpeg", {
                    compressionLevel: 9,
                    quality: 50
                })
                .resize({
                    width
                })
                .toBuffer();
        }

        default:
            return buffer;
    }
};

sunnythelucky avatar Apr 06 '22 19:04 sunnythelucky