Node.jsで画像変換

AMUSE で生成した画像は PNG 形式なのですが、1枚あたり500KB～1MBも使っているので、JPG に圧縮しようと考えました。
しかし、探してみると以外にオフラインでバッチ変換できるのってないんですよね・・・

ってことで、作ってみました。

ライブラリの準備

このブログは docusaurus を利用していて、 node.js 環境はあるのでこちらで作成することにしました。
sharp というライブラリが有名でメンテも継続されているみたいです。

→ https://sharp.pixelplumbing.com/

インストール方法はいろいろ紹介されていますが、今回は npm で。

npm install -D sharp

ディレクトリ構成

fromPNG ディレクトリに PNG ファイルを突っ込みます。
変換後に toJPEG ディレクトリに保存される仕組みにしました。

├── fromPNG
└── toJPEG

別に分ける必要はなく、同じディレクトリに出しても問題ないです。

コード

ドキュメントを見ながら読み込み・書き込みだけ実装。
ほとんど設定なしでそのまま JPG に変換できました。

import Sharp from "sharp";
import fs from "fs";

// 作業ディレクトリ
const cwd = process.cwd();

// fromPNG ディレクトリを検索してファイルを列挙
const pngFiles = fs.readdirSync(`${cwd}/fromPNG`);

pngFiles.forEach((pngFile) => {
  // 拡張子でpngファイル以外は除外する
  if (!/\.png$/.test(pngFile)) return;

  console.info(pngFile);

  // 出力ファイル名をjpgにする
  const jpgFile = pngFile.replace(/\.png$/, ".jpg");

  // オプション無しで単純変換
  new Sharp(`${cwd}/fromPNG/${pngFile}`).toFile(`${cwd}/toJPEG/${jpgFile}`);
});

実行結果

変換前、PNG ファイルで50MBほどあったものが6MBまで節約できました。
画質はちょっと悪くなりますが、通信帯域も減らせるので、表示も早くなったと思います！

Electron でGUIアプリにするのもいいかもしれないと考え中。