写真を限界までJPEG圧縮すると見えてくる世界
1983年徳島県生まれ。大阪在住。散歩が趣味の組込エンジニア。エアコンの配管や室外機のある風景など、普段着の街を見るのが好き。日常的すぎて誰も気にしないようなモノに気付いていきたい。（動画インタビュー） 前の記事：「神は細部に宿る」コレクション ＞ 個人サイト NEKOPLA Tumblr 限界までJPEG圧縮したい ここに何の変哲もない写真がある まったく同じ写真でも、JPEGの圧縮率を高めるとこうなる。一枚目の写真と比較して、容量は約2/3にまで圧縮できた。スマホで見ると違いが分からないかもしれないので拡大してみると、 汚いノイズが目立っている JPEGという画像圧縮の規格がある。人間の目には感じにくい情報を削ることで、画質をほとんど変えずにファイル容量を小さくする技術である。 当然ながら、画質と容量はトレードオフの関係にある。高画質を維持すればするほど容量は減らないし、逆に画質劣化を
もうサムネイルで泣かないための ImageMagick ノウハウ集 - Cybozu Inside Out | サイボウズエンジニアのブログ
こんにちわ、アプリケーション基盤チームの青木(@a_o_k_i_n_g)です。好きなみかんは紅マドンナです。 今回は、サイボウズのサムネイル事情について記事を書きたいと思います。サイボウズに限らず通常の Web アプリケーションでもサムネイル作成はよくあると思いますが、ハマりどころが多く涙しているサムネイリストも多いかと思います。これからの時代を生きるサムネイリストが快適なサムネイルライフを送れるよう、知見を共有したいと思います。 弊社では画像変換ツールに ImageMagick を用いており、従って本知見は ImageMagick 固有のものがほとんどです。 画像比較は人間の眼で行うべし サムネイル周りに何か修正を入れたら修正前後の画像を比較しましょう。機械によるバイト列の比較では画像の良し悪しがわかりません。頼れるのは人間の眼だけです。肉眼で確認しましょう。 比較できるツールを作ると良
画像ライブラリGrappyの作成と、ImageMagick, GDとの比較【実装編】 | 株式会社サイバーエージェント
概要 簡単な画像処理機能も備えた、シンプルかつ高速そしてAnimationGIFをサポートした画像形式変換ライブラリの Grappy を実装した。 これの性能について、ImageMagick, GDと、下記の比較を行った。 SSIMによる画質の比較 処理速度 Valgrindを使ったヒープメモリの使用量 ファイルサイズに関して 最後にそれらとの比較結果から、Grappyの優位性について述べた。 1.はじめに 画像のエンコード・デコードやリサイズといった処理をサービスに組み込もうと考えた場合、多くの場合は高レベルな画像処理をサポートした既存のライブラリの利用を検討することとなる。 しかし、既存のライブラリは機能と速度のバランスが悪く、使いにくいものであった。 Webサービスの中に画像関係の機能を取り入れる場合、求められるのは次のような単純な要求項目に限られる場合が多い。 JPEG, PN
JPEG画像の約半分のファイルサイズで同品質のものを表示できる画像形式「BPG」が誕生、実際に使ってみるとこんな感じ
同品質のJPEG画像と比較するとファイルサイズを約半分以下に縮小できる新しい画像形式が「BPG」で、FFmpegやJavaScriptだけで動くLinux「JSLinux」などを開発したFabrice Bellard氏が開発した画像形式です。ただサイズが軽いというだけではなく、グレイスケール・YCbCr＝4:2:0・4:2:2・4:4:4・RGB・YCgCo・CMYKなどの色空間をサポートし、アルファチャンネルや可逆圧縮にも対応しています。 BPG Image format http://bellard.org/bpg/ BPGが他の画像形式と比べてどれくらい優れているのかを比較できるのが以下のページ。2種類の画像形式で同程度のファイルサイズの画像を表示させており、「mozjpeg」とBPGとで同じ画像を比較すると、BPG画像の鮮明さが際立ちます。 BPG Image Comparison
ソフトバンクの「通信速度1位」のカラクリが明らかに、ヒントは「通信の最適化」 | Buzzap！
全国の主要都市の広告看板やテレビCMなどで「通信速度No.1」をうたうソフトバンクですが、そのカラクリが検証の結果、明らかになりました。キーワードは同社が適用している「通信の最適化」です。 ◆「通信の最適化」とは？ スマートフォンの普及に伴う通信量の増大によって発生するネットワークの負荷を軽減するため、ソフトバンクが2011年11月、KDDI（au）は2012年9月に導入したのが「通信の最適化」。 これはスマートフォンで以下のような形式のファイルを受信する場合、あらかじめネットワーク側で各種ファイルをスマートフォンの画面に適したサイズに画像を圧縮・変換するというもの。ちなみに圧縮されたデータは元に戻せません。 画像ファイル：BMP、JPEG、GIF、PNG形式 動画ファイル：MPEG、AVI、MOV、FLV、MP4、3GP、WebM、ASF、WMV形式 ◆「通信の最適化」でデータはどれだけ
pixivのサムネイル事情 - pixiv inside [archive]
この記事はピクシブ株式会社Advent Calendar 12/10の記事です。 こんにちは、インフラチームの@harukasanです。 さて、今日はpixivで使用しているサムネイル変換サーバについて紹介しようと思います。 pixivにはたくさんのサムネイルがある pixivにはうんざりするほどたくさんの種類のサムネイルがあります。 これは対応しているプラットフォームが多く、また画面毎にもサイズが異なるからです。 PC版であるwww.pixiv.netだけでも10種類以上のサムネイルが使用されています。 また、サムネイルにはアスペクト比を固定したものと、スクエアにクロップした2種類があります。 (Ugoira Tech Talks: Ugoku Backendより) 従来の方法ではこれらのサムネイルをアップロード時に生成していたため、サムネイル生成を非同期化するなどして対応していました。
![pixivのサムネイル事情 - pixiv inside [archive]](https://cdn-ak-scissors.b.st-hatena.com/image/square/a7795bb63b5f0ec25d6ef004b131815b4baf0e9f/height=288;version=1;width=512/http%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fh%2Fharukasan%2F20141210%2F20141210214738.png)
WebPでモバイルアプリの通信量を劇的に削減する - クックパッド開発者ブログ
モバイルファースト室の @slightair です。 クックパッドの iOS/Android アプリは、少し前のバージョンからWebP形式の画像をサーバから取得して表示するようにしています。 この記事では、なぜ画像形式をWebPに切り替えたのか、また切り替える上で注意した点などを説明します。 Cookpad アプリと画像 クックパッドのアプリはユーザさんに投稿していただいたレシピを表示するアプリケーションです。その性質上、レシピ画像や調理手順、検索画面のサムネイルなどたくさんの画像をサーバから取得して表示する必要があります。 画像の数が増えたりサイズが大きくなればなるほど通信量が増えます。最近はスマートフォンの画面サイズがどんどん大きくなっているので、それに合わせて取得する画像を大きくしていくとさらにファイルサイズが増え、通信量も増えていってしまいます。 サーバとやりとりするデータが多くな
写真サービス機能のブラウザ内実装 | 株式会社サイバーエージェント
2-1. リサイズ処理 Figure 2. Mobile Safariによる画像アップロード画面 最終成果の画像データを、サーバーサイドAPIにPOSTすることがゴールである。Androidにおいて、XMLHttpRequestでBlobをリクエストに設定しても空のボディで送信される問題がみられるため、今回はBase64 encoded DataURIとしてPOSTすることにしている。 2-1-1. 基本実装 ƒ 今回のリサイズ処理では、Canvas要素とFile APIを利用する。基本方針としては、inputtype='file'のchangeイベントから、Fileオブジェクトを取得し、それを一度Canvasに書き出すことでリサイズを試みる。最終的には、canvas.toDataURL() によってDataURIを取得する。 下記に、基本実装のサンプルを示す。( http://co
楓 software: mozjpeg はどのようにして圧縮率を上げているのか？
« Android 対応必要項目と工数見積もり | メイン | Lanczos3 を組み込んだ » 2014年03月10日 Misc.:: mozjpeg はどのようにして圧縮率を上げているのか？ Tweet @jin1016をフォロー ざっくりソースコード見たりしただけなので、間違っているかもしれないが書いておく。 一言で書くと「プログレッシブ方式で、DC成分の分割サイズを最適なものにすることで偏りを増やし圧縮率を上げている」ということのようだ。 この説明だと知っている人以外にとっては意味不明だと思うので、どのように圧縮しているのかある程度説明し、なぜ圧縮率が上がるのか説明してみる。 JPEG では、色空間変換 → DCT → 量子化 → ハフマン符号化+ランレングス と言う手順で圧縮している。 この中で実際に圧縮を行っているのは、「ハフマン符号化」と「ランレングス」の部分。 これ
『WebPの画質とファイルサイズを評価する』
amebaは大量の画像をそのまま配信するだけでなく、ダイナミックに加工を行ったり画質を変えたりといった機能を備えたプロキシサーバも保有しており、そのアプリケーションの開発および運用を現在担っているのが私の属するチームになります。
algorithm - JPEGminiの仕組みを推理する : 404 Blog Not Found
2012年01月23日19:30 カテゴリアルゴリズム百選iTech algorithm - JPEGminiの仕組みを推理する なぜコンピュータの画像は リアルに見えるのか 梅津信幸 JPEGの仕組みをおぼろげに知っている人ほど、むしろこれみて「ありえない」と思ったのではないのでしょうか。 JPEGmini - Your Photos on a Diet! でもよーく考えてみると、これでいけるという方法を発見というか再発見したので。 なぜJPEGminiがありえなさそうに見えるかは、以下に集約されます。 「なぜコンピュータの画像はリアルに見えるのか」 P.131 たとえば「ここは文字」「ここは背景の空」などと、ユーザーが自由に品質を設定できれば、さらによい画像になるはずです(できれば、それもコンピュータが自動で決めてくれるとうれしいのですが)。 同書も指摘しているように、JPEG 200
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - tsayen/dom-to-image: Generates an image from a DOM node using HTML5 canvas
Engadget | Technology News & Reviews
TechCrunch
ネットワークカメラを使った玄関前モニタリングの苦労話