Windows10のBashでJpegoptim・optipngで画像圧縮後サイトにアップロード

WPのプラグインEWWW Image Optimizer も Kraken Image Optimizerも500枚以上の画像圧縮は有料ということで、100ドル前後だったら有料でもなんとか払えるけど・・・画像多いので1000ドルとかはちょっと払いたくない。なので、ローカルで画像圧縮してからアップロードすることにした。

もともとこういうプラグインもjpegoptimを使っているようなので、ローカルでjpegoptimを使えば問題無さそう。でもLinuxのコマンドなんですが・・・

ちょうどタイミングが良いことに最近WindowsでBashが使えるようになったので設定して使えるようにしていきます。

Windows10でBashを使えるようにする設定

まずはBashを使えるように設定する必要があります。

Windows Subsystem for Linux (Bata)を有効にする

左下のWindowsアイコンを右クリックしてコントロールパネルを開いて以下のようにたどっていきます。

コントロール パネル\すべてのコントロール パネル項目\プログラムと機能

コントロール パネル\すべてのコントロール パネル項目\プログラムと機能

ここで「Windows の機能の有効化または無効化」を押してちいさなウィンドウを開きます。

Windows の機能の有効化または無効化

ここで「Windows Subsystem for Linux (Bata)」の項目にチェックを入れてOKボタンを押す。

これはもしかしたらWindows10を更新するとBataじゃなくて正式版になっているかもしれません。

Windows Subsystem for Linux (Bata) 設定完了

Windows Subsystem for Linux (Bata)を有効にできたら上記のようになって再起動します。

で、試しにコマンドプロンプトからbashを打つと・・・以下のように開発者モードを有効にしなさいと言われる。

Bash 開発者モードを有効に

開発者モードを有効にする

Windowsの設定 > 更新とセキュリティ > 開発者向け

こちらで開発者モードを有効にしましょう。

開発者モードを有効に

bash 初回はUNIXユーザー名とパスワード設定

これで無事bashが起動しました!初回はUNIXのユーザー名とパスワードを設定します。

Bash 初回パスワード設定

jpgとpngの画像圧縮ツールをインストール

bashはUbuntuシステムのようなのでapt-getでツールをインストールしていきましょう。

apt-getでjpegoptimインストール・jpg画像圧縮

sudo apt-get install jpegoptim

jpegoptim

jpegoptimの使い方

画像圧縮した画像が入っているフォルダのなにもないところを[Shift]を押しながら右クリックをして「コマンドウィンドウをここで開く」を選択してコマンドプロンプトを起動します。

画像フォルダ選択

あとは、以下のようにjpegoptimを起動させてフォルダ内の画像全てを圧縮していきます。

jpegoptim --strip-all --max=90 *.jpg

また、フォルダの中にフォルダがある場合で、全てのフォルダ内のjpg画像を圧縮する場合は以下のこまんどを打つ。

find ./ -type f -iname *.jpg -print | sudo xargs jpegoptim --strip-all --max=90

JPG画像圧縮

実行すると上記のように1枚1枚画像を圧縮してくれます。

optipngでpng画像圧縮

次にPNG画像も圧縮しないといけないのでoptipngをインストールしましょう。

sudo apt-get install optipng

実行は以下のコマンドで、フォルダ内のPNG画像が圧縮される。こちらはちょっと時間がかかるようでした。

optipng *.png

optipng

jpegoptimと同じようにフォルダの中にフォルダがある場合で全てのPNG画像を圧縮したい場合は以下のコマンド。

find . -name "*.png" -exec optipng {} \;

いままでアップロードした大量の画像を一旦ローカルにダウンロードして、画像圧縮してから上書きでアップロード・・・20時間くらいかかった。

画像数は古いのを抜かして204000くらいあった。多分リサイズしたのもあるので実際の画像数は6万枚くらいかな?

Imsanity 画像サイズを自動でリサイズ 未解決

ImsanityというWPのプラグインがありましたが、既存の画像サイズもリサイズすることはするんですが・・・リサイズし終わった画像が何度もリストにでてしまって、既存の画像が実質250枚ほどしかリサイズできませんでした(汗)

wp-members

設定は上記のようにして、下のように一括画像リサイズがあるのでやってみたが、250枚はうまくいってその後はリサイズされてない画像が出てこない(汗)

Imsanity

ということで画像圧縮はうまくいったようだけど、リサイズはうまく行ってない。

PageSpeed Insightsの結果

PageSpeed Insights の結果

まぁ、少しあがったけど?イマイチパッとしないかな。

PageSpeed Insights の結果 モバイル

まだ圧縮する余地がありそう。というよりモバイルはサイズが大きいみたい。モバイルの場合はサイズどのくらい(640pxじゃない?)にすれば良いのだろうか?

ちなみに画像が少なめなサイトでは普通にEWWW Image Optimizerを使えるようです、画像が30万枚あって今後増えていきそうなサイトのみこのように圧縮してからアップロードした。

以上、備忘録でした。

次回気が向いたら画像のリサイズをどうするか考える。

Windows11でLinux

新しい自作PCにしたのでついでにWindows11にアップグレードしました。

またWindows11上でLinuxを使えるようにしていきます。

Windows Subsystem for Linuxをインストール

Microsoft StoreでWindows Subsystem for Linuxをインストール する。

管理者モードでコマンドプロンプトかPowerShellを開く

ターミナルを右クリックして「管理者として実行」を選んで管理者モードでコマンドプロンプトを開く。

Ubuntuなどのディストリビューションがインストールされていないので、wslコマンドを打つとディストリビューションをインストールしろと言われる。

インストールできるディストリビューションはUbuntuやDebianなど主に5個ほどある。

Ubuntuをインストールする(エラー解決)

まずはデフォルトなディストリビューションのUbuntuをインストールします。

wsl --install -d Ubuntu

エラー・・・解決方法

インストール中: Ubuntu
Ubuntu はインストールされました。
Ubuntu を開始しています...
PS C:\Users\GO> .
発生場所 行:1 文字:1
+ .
+ ~
パイプライン要素の '.' の後に式が存在しません。
    + CategoryInfo          : ParserError: (:) [], ParentContainsErrorRecordException
    + FullyQualifiedErrorId : MissingExpression

再起動しても以下のようなエラーになる。

Installing, this may take a few minutes...
WslRegisterDistribution failed with error: 0x80370114

エラー解決方法 その①

コントロールパネル >プログラム > プログラムと機能の左側のWindowsの機能の有効化または無効化を選ぶ

以下の2つにチェックを入れてOK、再起動する。

  • Windows ハイパーバイザープラットフォーム
  • 仮想マシンプラットフォーム

さらにエラー、BIOS設定も必要

再起動するとアプリにUbuntuが追加されている。

Ubuntuを起動すると更に↓以下のようなエラー、今度はBIOSの設定が必要みたい。

Installing, this may take a few minutes...
WslRegisterDistribution failed with error: 0x80370102
Please enable the Virtual Machine Platform Windows feature and ensure virtualization is enabled in the BIOS.
For information please visit https://aka.ms/enablevirtualization
Press any key to continue...

マザーボードによっては Virtual Machine 関連の設定がDisabledになっているようです。

自分のマザーボードはASUS TUG Gaming B550-PlusでSVM ModeをEnabledにする必要がありました。

Ubuntu起動完了

ユーザー名とパスワードを登録して、Ubuntuが使えるようになった。

apt update/upgradeできない

あとは以下のようにUpdateとUpgradeをすれば良いのですが、

sudo apt update
最後のほうに以下のようなエラーが出る。
All packages are up to date.
W: Failed to fetch http://archive.ubuntu.com/ubuntu/dists/jammy/InRelease  Temporary failure resolving 'archive.ubuntu.com'
W: Failed to fetch http://archive.ubuntu.com/ubuntu/dists/jammy-updates/InRelease  Temporary failure resolving 'archive.ubuntu.com'
W: Failed to fetch http://archive.ubuntu.com/ubuntu/dists/jammy-backports/InRelease  Temporary failure resolving 'archive.ubuntu.com'
W: Failed to fetch http://security.ubuntu.com/ubuntu/dists/jammy-security/InRelease  Temporary failure resolving 'security.ubuntu.com'
W: Some index files failed to download. They have been ignored, or old ones used instead.

/var/lib/apt/lists を新しくする(未解決)

listsを一時ユーザーのホームに移動してみるが解決できない。

sudo mv /var/lib/apt/lists ~/

原因はUbuntuがWi-Fiを使ってネットにアクセスできないことにあった。

UbuntuでWifiを使えるようにする(未解決)

コントロールパネル > ネットワークとインターネット >ネットワーク接続でWi-Fiを右クリックでプロパティを選択。

共有タブで「ネットワークの他のユーザーに、このコンピューターのインターネット接続を通しての接続を許可する」にチェックを入れる。

もう一度Listsを削除する。

sudo rm -r /var/lib/apt/lists

ダメだった・・・

resolv.conf編集する

sudo vim /etc/resolv.conf

resolv.confを見てみると↓nameserverが変なIPアドレスになっていた!

これをWi-fiルーターのIPアドレスにする。

nameserver 192.168.31.1

自分の場合は↑こちらに変えて保存した。

sudo apte update
~
Get:45 http://archive.ubuntu.com/ubuntu jammy-backports/universe amd64 Packages [6740 B]
Get:46 http://archive.ubuntu.com/ubuntu jammy-backports/universe Translation-en [9360 B]
Get:47 http://archive.ubuntu.com/ubuntu jammy-backports/universe amd64 c-n-f Metadata [352 B]
Get:48 http://archive.ubuntu.com/ubuntu jammy-backports/multiverse amd64 c-n-f Metadata [116 B]
Fetched 27.1 MB in 5s (5561 kB/s)
Reading package lists... Done
Building dependency tree... Done
Reading state information... Done
22 packages can be upgraded. Run 'apt list --upgradable' to see them.

うまくいきました♪

あとはpotipngとjpegoptimをインストールして使えるようになる。

コメント

タイトルとURLをコピーしました