「フロントエンド向けWebAssembly入門」リンク集(2023-12-05)
■本書を読む前に 日経BPのサイト https://bookplus.nikkei.com/catalog/
本書サポートサイト https://www.staffnet.co.jp/hp/pub/support/
■1章 図1-2 WebAssembly Binary Toolkit公式サイト https://github.com/WebAssembly/wabt#wabt-the-webassembly-binary-toolkit
図1-3 WebAssembly テキスト形式 https://developer.mozilla.org/ja/docs/WebAssembly/Understanding_the_text_format
図1-5 WebAssembly ブラウザーAPI https://developer.mozilla.org/ja/docs/WebAssembly/JavaScript_interface
図1-7 WebAssemblyに対応可能なプログラミング言語一覧 https://github.com/appcypher/awesome-wasm-langs
図1-8 C/C++からWebAssemblyへの変換 https://developer.mozilla.org/ja/docs/WebAssembly/C_to_wasm
図1-9 RustでWebAssembly実行ファイルを生成する https://developer.mozilla.org/ja/docs/WebAssembly/Rust_to_wasm
図1-10 AssemblyScriptの公式サイト https://www.assemblyscript.org/
図1-11 WebAssemblyをサポートするWebブラウザー https://caniuse.com/wasm
図1-18 Adobe Photoshop Web版の開発の経緯 https://web.dev/ps-on-the-web/
図1-19 OpenCV.js公式ページ https://docs.opencv.org/4.x/df/d0a/tutorial_js_intro.html
図1-20 babylon.js公式ページ https://www.babylonjs.com/
図1-21 Unity公式ブログ https://blog.unity.com/ja/technology/webassembly-is-here
図1-22 TensorFlowバックエンドの紹介 https://www.tensorflow.org/js/guide/platform_environment?hl=ja
図1-23 メルカリ公式の技術ブログ https://engineering.mercari.com/blog/entry/20211222-mercari-lens/
図1-24 WebAssembly標準化完了のプレスリリース https://www.w3.org/press-releases/2019/wasm/
図1-26 WebAssemblyコア仕様 https://webassembly.github.io/spec/core/
図1-28 WebAssembly追加機能の協議プロセス https://github.com/WebAssembly/meetings/blob/main/process/phases.md
図1-29 標準化が進行中のProposal一覧 https://github.com/WebAssembly/proposals
図1-30 WebAssembly の普及を推進する団体「Bytecode Alliance」 https://bytecodealliance.org/
図1-31 Bytecode AllianceのGitHub https://github.com/bytecodealliance/
■2章 Node.js公式サイト https://nodejs.org
Python 公式サイト https://www.python.org/downloads/windows/
図2-2 emscripten-core/emsdkをzip形式で一括ダウンロード https://github.com/emscripten-core/emsdk
7zipツール https://7-zip.opensource.jp
図2-9 WebAssemblyモジュールのインスタンス化で利用するAPI https://developer.mozilla.org/ja/docs/WebAssembly/Loading_and_running
図2-10 WebAssembly.instantiateStreaming() https://developer.mozilla.org/ja/docs/WebAssembly/JavaScript_interface/instantiateStreaming
図2-11 http-server公式サイト https://github.com/http-party/http-server#readme
■3章 図3-6 Moduleオブジェクトの詳細 https://emscripten.org/docs/api_reference/module.html
図3-7 emccコマンドの詳細 https://emscripten.org/docs/tools_reference/emcc.html
図3-8 Emscriptenのsettings.js の内容 https://github.com/emscripten-core/emscripten/blob/main/src/settings.js
7zipツール https://7-zip.opensource.jp
図3-16 EMSCRIPTEN_KEEPALIVEの解説 https://emscripten.org/docs/api_reference/emscripten.h.html#c.EMSCRIPTEN_KEEPALIVE
図3-19 cwrap()関数の詳細 https://emscripten.org/docs/api_reference/preamble.js.html?highlight=cwrap#cwrap
図3-20 ccall()関数の詳細 https://emscripten.org/docs/api_reference/preamble.js.html?highlight=ccall#ccall
図3-28 Closure Compiler公式サイト https://developers.google.com/closure/compiler?hl=ja
図3-29 「Debug C/C++ WebAssembly」のchromeウェブストア https://chromewebstore.google.com/detail/cc++-devtools-support-dwa/pdcpmagijalfljmkmjngeonclgbbannb?pli=1
図3-34 WebAssemblyのC/C++コードのデバッグ https://developer.chrome.com/docs/devtools/wasm/
■4章 図4-3 EM_JSの利用方法 https://emscripten.org/docs/api_reference/emscripten.h.html?#c.EM_JS
図4-4 EM_ASMの利用方法 https://emscripten.org/docs/api_reference/emscripten.h.html?#c.EM_ASM
図4-5 ライブラリファイルの利用方法 https://emscripten.org/docs/porting/connecting_cpp_and_javascript/Interacting-with-code.html#implement-a-c-api-in-javascript
7zipツール https://7-zip.opensource.jp
■5章 図5-1 Fixed-width SIMDの標準化は完了 https://github.com/WebAssembly/proposals/blob/main/finished-proposals.md#finished-proposals
図5-2 Threadsの標準化は実装段階のフェーズ https://github.com/WebAssembly/proposals#phase-3---implementation-phase-cg--wg
図5-3 Fixed-width SIMDとthreadは主要ブラウザーでサポート済み https://webassembly.org/roadmap/
図5-4 BlazeFaceアプリの紹介 https://javascript.plainenglish.io/face-detection-in-the-browser-using-tensorflow-js-facb2304ed91
図5-5 SIMD およびマルチスレッドによる高速化の効果 https://developers-jp.googleblog.com/2020/09/simd-tensorflowjs-webassembly.html
図5-8 WebAssembly SIMD命令一覧 https://github.com/WebAssembly/simd/blob/main/proposals/simd/NewOpcodes.md
図5-13 インテルのベクトル演算命令からWebAssemblyへの変換 https://emscripten.org/docs/porting/simd.html#compiling-simd-code-targeting-x86-sse-instruction-set
図5-14 インテルのベクトル演算命令の一覧 https://www.intel.com/content/www/us/en/docs/intrinsics-guide/index.html#ssetechs=SSE2
図5-15 Wasm Workers APIとPthreadの比較と選択ガイド https://emscripten.org/docs/api_reference/wasm_workers.html?%20#pthreads-vs-wasm-workers-which-one-to-use
図5-16 Wasm Workers APIの利用方法 https://emscripten.org/docs/api_reference/wasm_workers.html?#wasm-workers-api
図5-17 Pthreadの利用方法 https://emscripten.org/docs/porting/pthreads.html#pthreads-support
図5-18 SharedArrayBuffer利用時の必須ヘッダー https://web.dev/i18n/ja/coop-coep/#coop%E3%81%A8coep%E3%82%92%E7%B5%B1%E5%90%88%E3%81%99%E3%82%8B
図5-19 WebAssembly拡張機能の検出 https://web.dev/articles/webassembly-feature-detection?hl=en
7zipツール https://7-zip.opensource.jp
■6章 図6-3 TensorFlow公式サイト https://www.tensorflow.org/overview?hl=ja
図6-4 TensorFlow Lite公式サイト https://www.tensorflow.org/lite?hl=ja
図6-5 TensorFlow.js公式サイト https://www.tensorflow.org/js?hl=ja
図6-7 TensorFlow.jsのAPI https://js.tensorflow.org/api/latest/?hl=ja
図6-8 TensorFlow.js用の学習済みモデル https://www.tensorflow.org/js/models?hl=ja
図6-10 WASMバックエンドの詳細情報 https://www.npmjs.com/package/@tensorflow/tfjs-backend-wasm
図6-12 WebGLバックエンドの詳細情報 https://www.npmjs.com/package/@tensorflow/tfjs-backend-webgl
図6-14 CPUバックエンドの詳細情報 https://www.npmjs.com/package/@tensorflow/tfjs-backend-cpu
図6-15 手のポーズ検出モデルの紹介 https://blog.tensorflow.org/2021/11/3D-handpose.html
図6-16 手のポーズ検出モデルが推測する21のポイント https://github.com/tensorflow/tfjs-models/blob/master/hand-pose-detection/README.md#keypoint-diagram
図6-17 手のポーズ検出モデルの詳細情報 https://github.com/tensorflow/tfjs-models/tree/master/hand-pose-detection/src/tfjs
7zipツール https://7-zip.opensource.jp
■7章 図7-3 ソニー「メタバースハンド」の紹介 https://xtrend.nikkei.com/atcl/contents/18/00105/00138/
7zipツール https://7-zip.opensource.jp
図7-13 iOS における WASMバックエンドThreads機能の不具合 https://github.com/tensorflow/tfjs/issues/7540
図7-14 requestAnimationFrame()の紹介 https://developer.mozilla.org/ja/docs/Web/API/window/requestAnimationFrame