WebWorkersで巨大データ転送の不思議 - QiitaDeleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
Workerを駆使するためのプロジェクト構成 with webpack - Qiita
はじめに マルチコアプロセッサを持て余した人類のために、WebアプリもWebWorkersやServiceWorkerを使ってマルチスレッド処理を駆使していかなければなるかもしれません。 Workerの小さいコード例はたくさん見かけますが、どうやってプロダクトに組み込むかといった話はあまり見かけない気がしたので、最近試してみてしっくりきた構成を紹介します。 まず、要件として以下のようなことを考えました。 Worker側もES2015(Babel)で書ける 言わずもがな、新しい構文の恩恵を受けたい。TypeScriptなどでも同様です。 Worker側もCommonJSスタイルでモジュールの読み込みができる Worker側もコード量が増えると、当然モジュール分割が必要です。Workerには他のJSコードを読み込むためのimportScriptsが提供されていますが、メインスレッド側でwebp
JavaScriptで画像処理 ~CanvasとWebWorker編~ - Qiita
About はじめに JavaScriptで画像処理をするには、Canvasを使います。この手のサンプルコードはたくさんありますし、Canvas自体ハードルはそんなに高くないので、使ったことがある方は多いかもしれません。 しかし、大量の画像を処理したり、なんども画像処理するような場合、全ピクセルデータを計算するようなコードは非常に負荷がかかり、ユーザビリティを悪化させてしまいます。そこでWeb Worker APIの登場です。 Web Worker APIを使用することによって、JavaScriptでマルチスレッド処理を実現することができます。今回は、「Canvasで画像処理したいが、その処理が重たいので、Workerスレッドにピクセルデータを送って並行処理し、最後にそれを受け取って再描画する」ということをやってみます。 Demo この記事で紹介するコードを使って以下の様なサンプルコードを
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Is it possible to generate an image (blob or data-url) in a web worker from a canvas context's getImageData?