JS
マンデルブロ集合を鑑賞するツールを作成した youtu.be 先日動画を公開しました。 マンデルブロ集合を鑑賞するツールを作成しました。 Unity や three.jsなどは使わずに、ゲームエンジン部分も自作です。 よかったら上記の動画も確認してみてください。 また…
目次 はじめに webpack + TypeScriptのプロジェクトを作成する シェーダのソースコードをimportする 実際にポリゴンを描画する さいごに 1. はじめに この記事では、WebGLでポリゴンを描画する方法を紹介します。 言語はTypeScriptを使います。 わざわざJava…
目次 はじめに Promiseとは Promiseを使う 3.1. 基本的な使い方（then, catch） 3.2. 実行される順番に注意 3.3. then, catchが両方実行されることもある Promiseを作る 4.1. Promise.resolve(), Promise.reject() 4.2. new Promise() まとめ 1. はじめに こ…
目次 はじめに 一様分布と標準正規分布 ボックス＝ミュラー法 実装してみた まとめ 1. はじめに (擬似)乱数といえば、みなさん一度は使ったことがあると思います。 各言語で準備されている関数などを使ってランダムな値を取得できます。 特によくあるのは0以…
目次 概要 プロジェクトの作り方 さいごに 1. 概要 Webで新しいプロジェクトを作るときって意外と大変だったりしますよね。 あの設定ファイルってどうするんだっけ。 あのライブラリはどこで有効にできるんだっけ。 そんなことに悩むのが面倒だったので、基…
目次 概要 準備 Storeの変更 Storeの読み出し まとめ 1. 概要 最近Web開発はNuxt.js + Typescriptの組み合わせが気に入っています。 せっかく気に入っているので、この組み合わせでの開発ノウハウを記載しておきます。 今回は基礎の基礎、Storeの変更と読み…
目次 この記事の目的 描画順序を制御する方法 描画処理のソースコード 全ソースコード まとめ 1. この記事の目的 この記事では、カメラからの距離を無視して描画順序を制御する方法を紹介します。 今回は例として、二つのオブジェクトを空間に配置し、描画…
目次 この記事の目的 テスト対象のコードを準備する karmaの設定ファイルを準備 テストコードでfetchする まとめ
目次 この記事の目的 テスト対象のコードを準備する karmaとbabel, webpack karmaでカバレッジを測定する テストを実行します まとめ
目次 この記事の目的 C++でソートを実装 JSでソートを実装 実行用のHTMLを準備する 実際に速度を比較する まとめ
目次 この記事の目的 wasm側のソースコードを準備 wasmにコンパイルするスクリプトを準備 JSのtyped arrayをwasmに渡す方法 サンプルの動作確認を行うHTMLを準備 まとめ
目次 この記事の目的 babel, webpackの導入 JavaScriptのソースコードを用意する サンプルを動かすHTMLを準備する wasmに変換するソースコードを準備する Utilsクラスでwasm読み込みを実装する 動作確認用のHTMLを準備する まとめ
目次 この記事の目的 JSに渡したいクラスをC++で定義する wasmのソースコードを実装する JS側でポインタからインスタンスを読み込む HTMLからwasmを読み込んで実行する まとめ
目次 この記事の目的 includeされる側のクラスを実装 ビルド用のスクリプトを準備 includeする側の実装 HTMLからwasmを読み込み実行する まとめ
目次 この記事の目的 C/C++でコールバック関数の定義のみ書く JavaScriptでコールバック関数の実装を書く emccで –pre-js オプションでビルドする HTMLから読み込んで実行する まとめ
目次 本記事の目的 C/C++で呼び出したい関数を実装する emccのExportedFunctionsオプションを使ってビルド JSからwasmを読み込んで関数を呼び出す まとめ 1. 本記事の目的 本記事では、C/C++で実装した関数をJSから呼び出す方法を紹介します。 例として、int…
目次 関連記事 MODULARIZEオプション HTMLからwasmを読み込む方法 HTMLからwasmを読み込むサンプル まとめ 1. 関連記事 【WebAssembly】Getting Started をDocker で試す - shogonir blog wasm-sample/01-wasm-modularize at master · shogonir/wasm-sample …
目次 WebAssemblyとは サンプルを動かしてみる サンプルの動作を解説する まとめ 1. WebAssemblyとは WebAssembly(wasm)とは、JavaScript高速化の最新技術です。JavaScriptの高速化技術であるasm.jsがさらに進化したものです。C/C++, Rust, Goなどの言語で記…
