[解決済み] 独立したJavascriptファイルを持たないWebワーカー?
2022-03-26 12:30:36
質問
私の知る限り、ウェブ ワーカーは別の JavaScript ファイルに記述して、次のように呼び出す必要があります。
new Worker('longrunning.js')
クロージャコンパイラを使って、すべてのJavaScriptソースコードを結合してミニマイズしているのですが、ワーカーを別々のファイルにして配布するのは避けたいのです。これを実現する方法はありますか?
new Worker(function() {
//Long-running work here
});
ファーストクラス関数がJavaScriptにとって非常に重要であることを考えると、バックグラウンドワークを行う標準的な方法は、なぜウェブサーバーからまったく別のJavaScriptファイルをロードする必要があるのでしょうか?
どうすれば解決するの?
http://www.html5rocks.com/en/tutorials/workers/basics/#toc-inlineworkers
ワーカー スクリプトをその場で作成したり、ワーカー ファイルを個別に作成せずに自己完結型のページを作成したりしたい場合はどうすればよいでしょうか。Blob() を使用すると、ワーカー コードへの URL ハンドルを文字列として作成することにより、メイン ロジックと同じ HTML ファイルにワーカーを "inline"することができます。
BLOBインラインワーカーの完全な例。
<!DOCTYPE html>
<script id="worker1" type="javascript/worker">
// This script won't be parsed by JS engines because its type is javascript/worker.
self.onmessage = function(e) {
self.postMessage('msg from worker');
};
// Rest of your worker code goes here.
</script>
<script>
var blob = new Blob([
document.querySelector('#worker1').textContent
], { type: "text/javascript" })
// Note: window.webkitURL.createObjectURL() in Chrome 10+.
var worker = new Worker(window.URL.createObjectURL(blob));
worker.onmessage = function(e) {
console.log("Received: " + e.data);
}
worker.postMessage("hello"); // Start the worker.
</script>
関連
-
[解決済み】React-Routerの子が1つしかない。
-
[解決済み】HTMLの最初の行に予期しないトークン<がある。
-
[解決済み] JavaScriptで "use strict "は何をするのか、その根拠は?
-
[解決済み] JavaScriptで文字列が部分文字列を含むかどうかを確認する方法は?
-
[解決済み] あるJavaScriptファイルを他のJavaScriptファイルにインクルードするにはどうすればよいですか?
-
[解決済み] JavaScriptでメールアドレスを検証するのに最適な方法は何ですか?
-
[解決済み] JavaScriptでタイムスタンプを取得する方法は?
-
[解決済み】JavaScriptの比較では、どちらの等号演算子(== vs ===)を使うべきですか?
-
[解決済み】JavaScriptで文字列の出現箇所をすべて置換する方法
-
[解決済み】オブジェクトからプロパティを削除する(JavaScript)
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】Facebook Graph API のクエリで with=location を使用すると "Uncaught (in promise) undefined" というエラーが発生する。
-
[解決済み】Failed to load resource: net::ERR_FILE_NOT_FOUND loading json.js
-
[解決済み】Angular JS Uncaught Error。[インジェクター:モジュラー]。
-
[解決済み] テスト
-
[解決済み】JavaScriptのボタンonclickが機能しない
-
[解決済み] エラー。モジュールhtmlが見つからない
-
[解決済み】React、Uncaught ReferenceError。ReactDOMは定義されていません
-
[解決済み】ES6マップオブジェクトをソートすることは可能ですか?
-
[解決済み】module.exports "モジュールが定義されていません"
-
[解決済み] JavaScriptとスレッド