Use baoyu-compress-image to reduce image payloads for sites and articles. It uses local compressors or Sharp rather than an image-generation API. Evaluate size together with dimensions, text edges, and transparency instead of relying solely on a reduction percentage.
Install and invoke
Run this in your project terminal to install only this skill for Claude Code:
npx skills add jimliu/baoyu-skills --skill baoyu-compress-image -a claude-code
Node.js and npx must be available. For Codex, replace -a claude-code with -a codex. In the agent conversation, explicitly ask it to use baoyu-compress-image and supply your material. The installation command belongs in the terminal, not in your content brief.
Start with a representative image
Choose small text, fine lines, or transparent edges to make degradation visible. Ask the agent to locate the installed skill directory and its scripts/main.ts; {baseDir} in documentation is a placeholder. The workflow uses Bun when available and can fall back to npx -y bun.
Example brief:
Use baoyu-compress-image on assets/example.png.
Process only this image as WebP at quality 80 and explicitly keep the original.
Report input and output paths, sizes, and compressor. Do not change article links.
Let me inspect the details before processing the directory.
For a project installation targeting Claude Code, this is the corresponding single-file command. Replace the script path if your installation differs:
npx -y bun .claude/skills/baoyu-compress-image/scripts/main.ts assets/example.png --format webp --quality 80 --keep
Understand preservation and format choices
--keep retains the source. Same-format processing normally adds -compressed to the output name. Without it, the current script renames cross-format originals with _original, while same-format output can replace the original path. Do not assume the default invocation leaves every original filename untouched. An explicit --output should also avoid pointing at the only source copy.
WebP is the default; PNG and JPEG are supported too. Compressor selection depends on format and system, so machines may not use the same backend. If Bun is unavailable, verify its version and PATH using the official instructions. Resolve missing Sharp or local-tool errors on one image before retrying a directory.
Compare the result with the source, focusing on text, transparency, edges, and gradients. A successful command does not justify keeping a larger or visibly worse file. After the sample passes, use a directory input and add --recursive only when subdirectories are intended. Review successful and failed files separately. Changing extensions does not automatically repair site references; update those in a separate checked step.
Using it during a website image migration
Suppose a product page has 80 PNGs. Sample one image with small text, one with transparent edges, and one very large file before touching the directory. Keep originals with --keep, then record original dimensions, byte sizes, and output paths. Inspect each at mobile and desktop widths. If WebP saves little space while blurring thin lines, raise quality or leave that kind of asset in its original format rather than forcing uniform conversion.
Only after the samples pass should you process the directory. Save machine-readable results with --json and check successful and failed counts plus paths. Creating WebP files does not update HTML or Markdown references to PNGs; change the links separately and open the real pages to check loading and layout. Re-run a failed file alone and read the underlying tool error. A batch with 79 successes and one failure is not complete, and old assets should remain until the new versions are verified.
Compress at the right point in publishing
Compress after the final illustrations and cover are chosen but before article links and publishing HTML are finalized. Just Jason describes that order in an article workflow: generate images, compress them, format Markdown, then prepare the WeChat version. This means the formatter references the checked output files. Do not let “compress all images” hide individual failures: record input, output, and size for each file, then verify the links. If an image is regenerated later, compress and inspect the new version again.