JS ファイルを PNG 画像に圧縮して保存する方法_PHP チュートリアル-PHPチュートリアル-php.cn

JS ファイルを PNG 画像に圧縮して保存する方法_PHP チュートリアル

WBOY

リリース： 2016-07-13 10:31:10

オリジナル

1018 人が閲覧しました

次のことを考えたことはありますか: js ファイルを圧縮するには、js ファイルを PNG 画像に変換し、キャンバスコントロールの getImageData() 関数を使用して画像を js ファイルに再読み込みします。昨日ここで公開した JS ファイルの高速読み込みに関する記事でこの方法について言及しましたが、一部のネットユーザーがこの方法に非常に興味を持っているので、今日は詳しく説明します。

これにより、非常に高い圧縮率を実現できます。どの程度高いかについては後述します。このメソッドはキャンバスコントロールを使用します。これは、キャンバスコントロールをサポートするブラウザでのみ有効であることも意味します。

JS ファイルを PNG 画像に圧縮して保存する方法_PHP チュートリアル

上の画像はノイズ画像のように見えますが、実際には 124K プロトタイプフレームコードから変換された 30K 8 ビット PNG 画像であることがわかります (圧縮率は悪くありません)。

実際、コードを画像形式に変換して保存するには、GIF 形式と PNG 形式に変換できます。 PNG 形式には 24 ビット画像と 8 ビット画像があります。24 ビット RGB 画像を使用する場合、各ピクセルは 3 バイトのデータを保存できます。8 ビット RGB 画像を使用する場合、各ピクセルは 1 バイトを保存できます。データの。

PHOTOSHOP でのテストでは、300x100 のソリッドカラーノイズ 8 ビット画像は 5K まで圧縮できるのに対し、同じソリッドカラーノイズ画像が 100x100 の 24 ビット画像の場合は 20K までしか圧縮できないことがわかりました。同じパターンの8ビットGIF画像の場合、圧縮効果はPNGよりも悪くなります。したがって、圧縮および解凍用の保存形式として 8 ビット PNG 画像を使用することを選択します。

ここで、画像の圧縮を開始する必要があります。PHP で書かれたファイルを圧縮する方法は次のとおりです。リーリー

JS ファイルを読み込み、PNG 画像を作成します。画像内の各ピクセルは 0 ～ 255 の値であり、この値は JS 文字の ascII 値に対応します。
もちろん、圧縮に加えて、画像を JS ファイルに読み込むプロセスである解凍もあります。この関数は JS で書かれており、具体的なコードは次のとおりです:
リーリー

最後に、この Web ページで、PNG 画像ファイルを選択して、Web ページ上に画像を表示できます。コードファイル。

http://www.nihilogic.dk/labs/canvascompress/

興味がありそうな記事

phpでファイルのバッチ変換を実現圧縮パッケージのダウンロード
php は、ZipArchive 関数を使用してファイルの圧縮と解凍を行います
Smarty の一時ファイル作成失敗の解決策
php メソッドでリモートファイルが存在するかどうかを確認します
php は、ディレクトリ内のすべてのファイルを取得し、結果を配列に保存しますプログラム
JS はボタンのコードを取得します。JS はユーザーのボタンをどのようにブロックしますか。JS はユーザーのボタンに対応する ASII コードを取得します (すべてのブラウザーと互換性があります)
Js アドレスバーの特殊効果 (すべてのボタンのサイズとビューを表示します)ページ上のリンクされた画像現在のブラウザの高さ)