WebpとAVIFをWindowsでローカルに使ってみる

Share
WebpとAVIFをWindowsでローカルに使ってみる

ブラウザツールはいろいろあるのだが、ローカルでやるのがやはり便利なのでその方法を模索する。

sharpで画像を一括圧縮、WebP・AVIF変換する - Web production note
画像変換ライブラリsharpを用いて、画像をまとめて圧縮や変換(Webp・AVIF・JPG・PNG)できる方法をまとめました。

非公式なコマンドラインツールなどもあるが、開発が最新のバージョンに追随していなかったりするので、おとなしく公式実装を使うのがよさそう。

PNGやJPEG画像をAVIFフォーマットへ変換してくれるコマンドラインツール「cavif」がリリース。
PNGやJPEG画像をAVIFフォーマットへ変換してくれるコマンドラインツール「cavif」がリリースされています。詳細は以下から。

Webp

WebpはGoogleが作ったナウい画像形式。古臭いJPEGに比べて画質を保ったまま小さくできるのがウリ。

WebpのダウンロードはGoogle公式ページの「Windows版をダウンロード」から。

WebP のダウンロードとインストール | Google for Developers

libwebp-1.6.0-windows-x64 のようなフォルダーがダウンロードされるハズ。その中にある bin フォルダー以下に cweb.exe などの各種ツールが入っているので、 適当に C:\\program files\\libwebp-1.6.0-windows-x64\\bin\\ のように配置して、環境変数にパスを登録しておく。

使い方

公式サイトに詳しく説明がある。

cwebp | WebP | Google for Developers

WebpにはLossyとLosslessの圧縮モードがある。

非可逆圧縮

Lossyならこれ。

cwebp input_file -o output_file.webp

基本的にはこれでOK。引数などのパラメータはデフォルトが結構考えられてセットされているので、下手にいじらないほうがいいのかもなあという結論。

可逆圧縮

PNGやTiffのような可逆圧縮の代替として使いたいならLossless圧縮。

cwebp -lossless input_file -o output_file.webp

圧縮モードの指定を -z int 引数で行える。1から9まで指定ができる。デフォルトは6だが私は基本的に9を指定してる。オプション -q または -m が後で使用されると、このオプションの効果が無効になります。

AVIF

AVIFのお勉強サイトをGoogleが公開しているので、参考にする。

AVIF 画像の配信 | Google Codelabs

avifencを導入する

Releases · AOMediaCodec/libavif
libavif - Library for encoding and decoding .avif files - AOMediaCodec/libavif

ここから最新のリリースビルドをダウンロードする。

windows-artifacts.zip をダウンロードすればよい。

適当に C:\\Program Files\\windows-artifacts のように配置して、環境変数にパスを登録しておく。

使い方

たぶん、avifはLossyしかないハズ。

avifenc happy_dog.jpg example.avif

基本的にこのコマンドでOK。

カレントディレクトリ以下の全JPEG/PNG画像ファイルをWebpあるいはAVIFに変換する

Powershellワンライナーに。

画像ファイルを新しい形式に変換して、置換する。

💡
元ファイルは削除されるので、注意。

注意点

  • デフォルト品質を使用(avifencとcwebpのデフォルト設定)
  • 必ずバックアップを取ってからテスト実行してください
  • まずはWhatIfや小さなフォルダーでテストすることをお勧めします

AVIF Lossy

Get-ChildItem -Recurse -Include *.jpg,*.jpeg,*.png | ForEach-Object { $out = $_.FullName -replace '\\.(jpg|jpeg|png)$','.avif'; avifenc $_.FullName $out; if($LASTEXITCODE -eq 0) { Remove-Item $_.FullName } }

WebP Lossy (デフォルト品質)

Get-ChildItem -Recurse -Include *.jpg,*.jpeg,*.png | ForEach-Object { $out = $_.FullName -replace '\\.(jpg|jpeg|png)$','.webp'; cwebp $_.FullName -o $out; if($LASTEXITCODE -eq 0) { Remove-Item $_.FullName } }

WebP Lossless

Get-ChildItem -Recurse -Include *.jpg,*.jpeg,*.png | ForEach-Object { $out = $_.FullName -replace '\\.(jpg|jpeg|png)$','.webp'; cwebp -lossless $_.FullName -o $out; if($LASTEXITCODE -eq 0) { Remove-Item $_.FullName } }

動作説明

  • Get-ChildItem -Recurse -Include *.jpg,*.jpeg,*.png: カレントフォルダー以下の全画像を再帰的に取得
  • 拡張子を.avifまたは.webpに置換
  • 変換コマンド実行
  • $LASTEXITCODE -eq 0で成功確認後、元ファイルを削除

Read more

1Passwordを閉じるボタンが……ねえ!

1Passwordを使っていたら、いつの間にかウィンドウの 閉じる/最小化/最大化ボタンが消えていた。Ctrl+Wでウィンドウ自体は閉じられるので長らく放置していたけれど、調べてみたら原因がしょうもなかったので共有しておく。 💡結論 F11を押してみよう 症状 * ウィンドウ右上の最小化・最大化・閉じるボタンが表示されない * タイトルバーも消えている * Ctrl+W では普通に閉じられる * PC再起動、1Passwordの終了・再起動、アンインストール → 再インストール、いずれも変化なし 原因 ただフルスクリーンモードに入っていただけ。 1Passwordコミュニティの投稿「Lost window minimize buttons top rhc.」で全く同じ症状が報告されていて、コミュニティマネージャーの回答が「F11でフルスクリーンを切り替えてみて」だった。 解決手順 1. 1Passwordのウィンドウをクリックしてフォーカスを当てる 2. F11 を押す これでタイトルバーとボタン類が戻ってくる。ダメな場合は Win + ↓(ウィン

By Sakashita Yasunobu

外字と訓点を compile-time hash で解く

aozora は青空文庫の外字参照 (※[#「魚+師」、第3水準1-94-37] のような形) を約 14,000 件のテーブルで解決する。このテーブルを runtime の HashMap ではなく phf (perfect hash function) で持ち、コンパイル時に static 配列に焼き込んでいる。この記事はその選択の根拠と、JIS X 0213 → Unicode フォールバックの設計をまとめたもの。 handbook の対応章: Shift_JIS + 外字 resolver。 外字テーブルの形 外字エントリには 3 種類の解決結果があり、それぞれに対応する variant を GaijiEntry に持たせている。 static GAIJI_TABLE: phf::Map<

By Sakashita Yasunobu

青空文庫の .txt を HTML に変換する最短手順

青空文庫 で配布されている .txt ファイルを HTML に変換したい、という用途向けの手順。Rust の知識は要らない。コマンド 1 行で済む。 1. CLI バイナリを取ってくる aozora の Releases ページ から自分の OS 向けのアーカイブを落とす。 OS アーカイブ名 Linux x86_64 aozora-vX.Y.Z-x86_64-unknown-linux-gnu.tar.gz macOS arm64 aozora-vX.Y.Z-aarch64-apple-darwin.tar.gz Windows x86_64 aozora-vX.Y.Z-x86_64-pc-windows-msvc.zip SHA256SUMS も同梱されているので、

By Sakashita Yasunobu