Webワーカーのユースケースは何ですか?[閉まっている]


174

Web Workers APIを使用するための実際のシナリオを探しています


モバイル/ウェブキットプラットフォームでサポートされていますか?
dmp 5'5 /

確かではありませんが、そうだと思います。
セルゲイイリンスキー

6
@danpブラウザーサポート:caniuse.com/webworkers
Dheeraj Vepakomma 2013

1
私はその後、我々は最初のWebワーカーを使用するケースを書いて、我々はそれなしでオフに優れていた決定- windward.net/blogs/web-workers-abandon/#.Vl3QdXarQ-U
デヴィッドThielen

回答:


143
  • John Resig(jQueryの名声)には、ここでゲーム、グラフィックス、暗号化など、Webワーカーを使用する興味深い例がたくさんあります。

  • もう1つの用途はWeb I / Oです。つまり、バックグラウンドでURLをポーリングします。そうすることで、ポーリング結果を待つUIをブロックしません。

  • 別の実用的な用途:Bespinでは、Webワーカーを使用して構文の強調表示を行っています。これは、アプリの使用中にコード編集をブロックしたくない場合に使用します。

  • Mozillaから:ワーカーが役立つ1つの方法は、ユーザーインターフェイススレッドをブロックせずに、コードがプロセッサ集中型の計算を実行できるようにすることです。

    実用的な例として、#の大きなテーブルがあるアプリを考えてみます(これは実世界、BTW-私が2年前にプログラムしたアプリから取ったものです)。入力フィールドを介してテーブル内の1つの#を変更すると、さまざまな列にある他の多数の数値がかなり集中的なプロセスで再計算されます。

    以前のワークフローは次のとおりでした:#を変更します。JavaScriptが他の数値への変更を処理し、Webページが3分間応答しない間にコーヒーを飲みに行きます。コーヒーを取り戻す。2番目の#を変更します。何度も繰り返します。保存ボタンをクリックします。

    ワーカーを使用した新しいワークフローは次のとおりです。何かが再計算されていることを示すステータスメッセージを取得しますが、他の#を変更できます。さらに#を変更します。変更が完了したら、ステータスが「すべての計算が完了し、最後の#を確認して保存できる」に変わるまで待ちます。


5
素晴らしいリンク!私は労働者について聞いたことがありません...うーん、労働者。(行く時間は長く、熱いシャワーを浴びる...)
ピーター・ロウェル

51
これは2年前の答えですが、2番目の項目(URLのポーリング)にはWebワーカーを必要としないことをお伝えしたいと思います。XHRは非同期で発生し、ブロックしません。別のスレッドでXHRリクエストを実行する必要はありません。(もちろん、最新のアプリでは、ポーリングの代わりにWebSocketを使用する必要があります。)
josh3736

6
@ josh3736-あなたは正しいですが、私は今、多くの並列XHR ayncリクエストを実行すると、どういうわけかブラウザが不幸になる可能性があるかどうかについて知りたいですか?また、ワーカーが役立つ可能性のあるXHR応答を処理するには、ローカルリソースが必要です。
DVK 2012

すべての並列要求が同じサーバーに対するものである場合、2〜9の同時接続のどこかでホスト名ごとの制限に達します。(この制限は、メインスレッドから開始されたかワーカーから開始されたかに関係なく、すべての接続に適用されると思います。)もちろん、一度に10個の同時要求を実行している場合は、おそらくアプリケーションの設計を再考する必要があります。
josh3736 2012

2
簡単な質問ですが、上の例では「#」とは何ですか。
shrewdbeans 2017年

35

私はブラウザからサーバーに大量のデータを送信するためにそれらを使用しました。もちろん、通常のAJAX呼び出しでこれを行うことができますが、これがホスト名ごとの貴重な接続の1つを占める場合。また、ユーザーがこのプロセス中にページ遷移を行う(リンクをクリックするなど)と、前のページのJavaScriptオブジェクトが消え、コールバックを処理できなくなります。Webワーカーが使用されている場合、このアクティビティは帯域外で発生するため、完了することが保証されます。


2
ただし、メッセージをWebワーカーと交換する必要があります。この操作のコストがメリットに値するのはいつですか?
Danielo515 2018

6

別の使用例:

サーバーから圧縮形式で交換される画像やその他のメディアファイルが多数ある場合は、バックグラウンドでファイルを圧縮/解凍します。


39
これはJavaScriptでは発生しません。画像は、画像データを効率的に圧縮するように設計されたアルゴリズムを使用して既に圧縮(PNG、JPEG)されています。上に別の圧縮層を配置すると、実際にデータのサイズが大きくなる可能性あります。他のタイプのデータ(大きなJSONファイルなど)の場合、圧縮は標準のHTTP gzippingを使用してブラウザーで処理する必要があります。 JavaScriptで圧縮を行っている場合は、おそらく間違っています
josh3736 2012年

11
一部のユーザーがユースケースを不適格と見なしているようですが、これが私が言いたいことです。画像、音楽ファイル、データ、Excelシートなどをすべて1つのファイルに埋め込むことができる強力なドキュメントエディターのようなMS Wordのようなアプリケーションを検討してください。また、Webベースのクライアントとデスクトップクライアント、およびIOS / Androidクライアントがあることを考慮してください。このような使用例では、すべてのファイルの内容をzipファイルに保存してから、各クライアントで解凍できます。
sbr 2013年

3
Instapaperブックマークレットは、サーバーに送信する前に、保存されているページを圧縮します。時間と帯域幅を節約します。
stevendaniels 2013年

12
@ josh3736ブラウザーが実行できる唯一のことは、Webサーバー(またはブラウザーのキャッシュ)からファイルをgunzipすることです。ローカルストレージやWebSocketからデータを解凍することはできません。また、まったく圧縮することもできません。Webアプリは、ますます多くのデータをアップストリームに送信しており、このための圧縮は非常に便利です。これが投稿された1年前にも同様に有効です。JavaScript 圧縮の有効なユースケースが思いつかない場合は、おそらく想像力に欠けます。
アドリア

1
@Adria:websocket標準は、圧縮サポート追加を進めています。ブラウザ(<canvas>)で生成された画像を処理している場合は、圧縮形式(つまりpng)で画像データを取得できます。私のポイントは、JSで圧縮することは決して適切ではないということではありませんでした。私の要点は、ほとんどの場合、そうではなく、ほとんどの場合- 特にこの回答で述べられている画像の処理-独自の圧縮をローリングするより良い代替手段があることです。
josh3736 2013
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.