画像プレビューとウェブワーカー

Question

Webワーカー内でファイルリーダーAPIを使用して画像をロードすることができます。つまり、プレビュー/サムネイル用にメインUIスレッドがブロックされないようにすることは可能ですか？

thisような何かが、それはあなたが作成することはできませんので、ページのDOMレベルにアクセスすることはできません労働者からのWebワーカー

Answer 1

内部のCPUに負荷をかけ部品（主にファイルの内容を読み込み、画像を拡大縮小）を包みますImageオブジェクトまたはキャンバス（スケーリングパーツ用）を使用して、画像を操作したいので答えはノーです。

ajaxまたはFileReaderSyncでWebワーカーに画像ファイルを読み込んでbase64データURL文字列に変換してメインスクリプトに送り返すことはできますが、画像を操作する方法はありませんサムネイルを作成する。 （png/jpg/bmp形式のファイル仕様が分からず、バイナリ文字列に直接作用するスケーリング関数をハードコードしたいのでなければ、それほどうまく見えません）

Answer 2

メインスレッドはUIスレッドと呼ばれます。 UIに直接関連していることが起こります。 Web WorkerではDOMを操作できませんが、Web Worker内ではイメージファイルのバイナリを操作できます。画像操作後、データをメインスレッドに転送し、DOMに添付させる必要があります。ブラウザはメインスレッド内でこのイメージをレンダリングします。

Answer 3

可能な場合は可能です。

• ワーカーからサーバーにajaxリクエストを行い、responseTypeをarraybufferに、responseTextをresponseに設定します。
• サーバー上で、PHPが要求されたイメージをGD表現（createImageFromJpeg）にロードすると言うことができます。
• 各ピクセル情報（imagecolorat）を取得します。
• RGBAの色を抽出し、それぞれをパックして文字列に追加します。
• その文字列をワーカーに送り返します。
• 応答から新しいUint8Arrayを作成します。
• いくつかの操作を行います。
• メインスクリプトに所有権を委譲します。
• データをキャンバスに追加します。

読むために何か：Sending Arraybuffer、Transferable Objects

スクリプト全体が範囲を超えて行くだろう書き留めて。