images-folder-optimizer

A high performance package that uses sharp.js to recursively optimize, transform and convert images from a folder to smaller, web-friendly JPEG, PNG, WebP, GIF and AVIF images. It is also possible to add watermark to the output images controlling opacity and positioning.

FEATURES

• PROCCESS ALL IMAGE FILES IN A FOLDER AT ONCE
• SIGNIFICANT REDUCTION IN IMAGE SIZE
• SCAN FOR IMAGE FILES RECURSIVELY ON ALL SUBFOLDERS
• CONVERSION BETWEEN IMAGE FORMATS, CHOOSING BOTH INPUT AND OUTPUT FORMATS
• IMAGE RESIZING
• IMAGE TRANSFORMATIONS (ONLY BLUR FOR NOW)
• POSSIBILITY TO OVERLAP A WATERMARK IMAGE CONTROLLING ITS OPACITY
• FULL TYPESCRIPT SUPPORT
• FULL CONTROL FOR SHARP.JS PARAMETERS

HOW TO USE IN YOUR PROJECT

• INSTALL THE PACKAGE:

  npm install -D images-folder-optimizer

• CREATE A JAVASCRIPT (OR TYPESCRIPT) FILE, AS example.js:

  import { functionOptimizeImages } from 'images-folder-optimizer';
  
  functionOptimizeImages({
      stringOriginFolder: 'static/images/originals',
      stringDestinationFolder: 'static/images/optimized',
      arrayOriginFormats: ['jpg', 'png'],
      arrayDestinationFormats: ['webp', 'avif'],
  }).then((results) => {
      console.table(results);
  });

• RUN THE FILE:

  node example.js

• CHECK THE NEW IMAGES IN static/images/optimized.

BUILT-IN EXAMPLES

YOU CAN FIND BUILT-IN EXAMPLES IN src/examples/ [LINK]. LET'S TRY ONE OF THEM:

npx tsc
node dist/examples/exampleFormatConversion.js

PARAMETERS AND TYPING

• PARAMETERS FOR functionOptimizeImages:

PARAMETER	DESCRIPTION	TYPE	REQUIRED	DEFAULT
stringOriginFolder	THE FOLDER WITH THE ORIGINAL IMAGES	string	YES	-
stringDestinationFolder	THE FOLDER WHERE THE OPTIMIZED IMAGES ARE GOING TO BE SAVED	string	YES	-
arrayOriginFormats	FORMATS OF THE ORIGINAL IMAGES	ARRAY WITH ELEMENTS BEEING 'webp' OR 'avif' OR 'png' OR 'jpg' OR 'tiff' OR 'gif'	YES	-
arrayDestinationFormats	FORMATS FOR THE NEW IMAGES	ARRAY WITH ELEMENTS BEEING 'webp' OR 'avif' OR 'png' OR 'jpg' OR 'tiff' OR 'gif' OR 'svg'	YES	-
stringFileNameSuffix	SUFIX FOR THE NEW FILE NAMES. EVERY ORIGINAL FILE NAME WITH THIS SUFIX IS GOING TO BE IGNORED	NO	-
objectResizeOptions	SHARP.JS OPTIONS FOR IMAGE RESIZING	CHECK IT HERE	NO	-
objectPngOptions	SHARP.JS OPTIONS FOR PNG TRANSFORMATIONS	CHECK IT HERE	NO	-
objectJpegOptions	SHARP.JS OPTIONS FOR JPG TRANSFORMATIONS	CHECK IT HERE	NO	-
objectWebpOptions	SHARP.JS OPTIONS FOR WEBP TRANSFORMATIONS	CHECK IT HERE	NO	-
objectAvifOptions	SHARP.JS OPTIONS FOR AVIF TRANSFORMATIONS	CHECK IT HERE	NO	-
objectAvifOptions	SHARP.JS OPTIONS FOR AVIF TRANSFORMATIONS	CHECK IT HERE	NO	-
objectTiffOptions	SHARP.JS OPTIONS FOR TIFF TRANSFORMATIONS	CHECK IT HERE	NO	-
objectGifOptions	SHARP.JS OPTIONS FOR GIF TRANSFORMATIONS	CHECK IT HERE	NO	-
objectBlurOptions	SHARP.JS OPTIONS FOR BLUR TRANSFORMATIONS	CHECK IT HERE	NO	-
objectWatermarkOptions	OBJECT WITH OPTIONS FOR WATERMARK INSERTION	typeWatermarkOptions DESCRIBED BELLOW	NO	-

• typeWatermarkOptions TYPE:

KEY	DESCRIPTION	TYPE	REQUIRED	DEFAULT
stringWatermarkFile	PATH OF THE IMAGE TO USE AS WATERMARK	string	YES	-
numberOpacity	WATERMARK OPACITY	number BETWEEN 0 AND 1	YES	-
objectResizeOptions	SHARP.JS OPTIONS FOR RESIZING THE WATERMARK IMAGE	CHECK IT HERE	NO	-
stringGravity	WATERMARK POSITION	'centre' OR 'northwest' OR 'northeast' OR 'southeast' OR 'southwest'	NO	centre