画像一括リサイズ
昨今のスマホやデジカメは高解像度でWEBにちょっとアップするだけなのにすごく重い。
特に引っ越してからアップ速度が下がったので毎度リサイズしてからアップしてるので簡単にリサイズできるツールを作ってみた。
画像一括リサイズ
Windows用ソフトでよくあるタイプのあらかじめサイズを決めておけば画像をドロップしたら即リサイズされた画像が生成されるよう構想したが「ファイルのドロップ処理やcanvasのリサイズ処理はちょいちょい使うのでいいとして、画像を自動でダウンロードってJavascriptで出来るのか？」と調べてくと画像（base64やBLOB）をリンク（href）に埋め込んでクリックのイベントを発火させると自動でダウンロード出来るらしい。
PCはブラウザによっては警告が出るが複数ファイルを入れても一応ダウンロード出来た。続いてスマホでも検証すると複数読み込んでも一枚しかダウンロード出来なかった。
あったらいいなレベルで検索したらjavascript上でZIP圧縮するライブラリJSZipを見つけた。
Zipファイルも同じようにリンクに埋め込めば自動ダウンロードできるようになりました。
ちなみに標準の画像サイズは画像系SNSの雄インスタに倣って1080pxにしております。
公開後、実務に耐えるか試した見たところ解像度がすごく高い画像をいきなり小さくするとジャギー（荒れ荒れ画像）が目立ってしまう事が分かったネットで検索してみるとCSSの「-ms-interpolation-mode: bicubic;」みたいにアルゴリズムが選択は出来ないらしくやるなら自前で用意する必要があるらしい。流石にバイキュービックを自前での実装はしんどいしおそらくかなり重い処理になってしまうが海外の掲示板「Stack Overflow」に対策が色々書かれてて、どうやら段階的に小さくするとキレイになるらしいので実装してみたら荒れは無くなったが今度はぼんやりしてる。
対処法はシャープネスを掛ける事にしたがこれも自前で用意する必要があるらしい。「画像処理ソリューション」によるとlaplacian filterというアルゴリズムを適用したらなんとかなりそうな感じなので実装してみるといい感じに仕上がった（8近傍でk値は1にしました）。
ただ処理は重くなったので負荷が増えたので古いパソコンで複数枚処理するとしんどいかもしれない。
Tags: JavaScript