マンデルブロ集合を鑑賞するツールを作成した youtu.be 先日動画を公開しました。 マンデルブロ集合を鑑賞するツールを作成しました。 Unity や three.jsなどは使わずに、ゲームエンジン部分も自作です。 よかったら上記の動画も確認してみてください。 また…

目次 はじめに webpack + TypeScriptのプロジェクトを作成する シェーダのソースコードをimportする 実際にポリゴンを描画する さいごに 1. はじめに この記事では、WebGLでポリゴンを描画する方法を紹介します。 言語はTypeScriptを使います。 わざわざJava…

目次 概要 プロジェクトの作り方 さいごに 1. 概要 Webで新しいプロジェクトを作るときって意外と大変だったりしますよね。 あの設定ファイルってどうするんだっけ。 あのライブラリはどこで有効にできるんだっけ。 そんなことに悩むのが面倒だったので、基…

目次 概要 準備 Storeの変更 Storeの読み出し まとめ 1. 概要 最近Web開発はNuxt.js + Typescriptの組み合わせが気に入っています。 せっかく気に入っているので、この組み合わせでの開発ノウハウを記載しておきます。 今回は基礎の基礎、Storeの変更と読み…

目次 この記事の目的 描画順序を制御する方法 描画処理のソースコード 全ソースコード まとめ 1. この記事の目的 この記事では、カメラからの距離を無視して描画順序を制御する方法を紹介します。 今回は例として、二つのオブジェクトを空間に配置し、描画…

目次 この記事の目的 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から読み込んで実行する まとめ

目次 WebAssemblyとは サンプルを動かしてみる サンプルの動作を解説する まとめ 1. WebAssemblyとは WebAssembly(wasm)とは、JavaScript高速化の最新技術です。JavaScriptの高速化技術であるasm.jsがさらに進化したものです。C/C++, Rust, Goなどの言語で記…

Unity Web Player をブラウザの画面に合わせて起動する 結論 Project をビルドした時に生成される HTML ファイルを編集する。コミットログを見ればわかる方は次のリンクへ飛んでください。以降では HTML の編集箇所の説明を書きます。 ※ Unity Web Player は…