【wasm】ブラウザでC++。Emscriptenを語ろう

■ このスレッドは過去ログ倉庫に格納されています
1L
垢版 |
2019/01/15(火) 19:50:48.94ID:cXSiB+ud
タイトル通り。

・canvas への描画が可能なことを確認。
・emscripten_sleep() でその場で停止できることを確認。
・付属の emrun や mongoose などで Local Server を作れば、local だけで
 wasm の起動が出来ることを確認。
・mongoose からは、cgi も起動でき、XmlHttpRequest()でローカルファイルを
JSから読み込め、cgi も自由に起動できることを確認。
・ローカル・ファイルアクセス、clipboard の読み書きの他、Local OS の
 全ての機能を自由にできる可能性有り。
・これを使えば、Java の JVM に変わる新たなローカル仮想環境ができる。
16L
垢版 |
2019/01/27(日) 14:04:20.14ID:UeSsBKpf
LLVM の alloca を wasm の native スタックに対応させずに、
グローバル変数的な、HEAP32[STACKTOP + ofs] の方に対応させた上で工夫すれば、
ASYNCIFY=1 的なものや、yield, async, await, function generator 的なものも
LLVM の LL コード以後の backend 層を修正する事無く実現可能ではないかと思っていた。

でも、LLVM の仮想レジスタ(%10 みたいな) の方も同様に HEAP32[] の方に
移さないと、多分、駄目だろう・・・。一時的に使うものは除いて。
一時的に使っているだけかどうかを最適化層で判定して、一時的ではないもの
だけを HEAP32[] の方に移さないと、アプリの実行速度は下がる。
本当は、LL コードは仮想レジスタに対しては最適化が強く利くはずなので、
なるべく仮想レジスタだけで済むならそれに越したことは無い。
グローバル変数の最適化はかなり難しいのd。
2019/01/27(日) 16:09:38.70ID:UeSsBKpf
Emscriptenの emcc で、ASYNCIFY=1 を指定した場合、1つのイベント・ハンドラ
の処理が完了する前に別のイベント・ハンドラが起動してしまうことがあるらしい。
例えば、Windows でいうところの OnMouseMove() ハンドラの中で少し
時間のかかる処理をしていたとする。例として、ハンドラの中で printf()
を使い、端末のスクロールに時間がかかってしまうとか。その場合、
そのイベント・ハンドラの処理が完了する前に、新しい OnMouseMove()
イベントが生じてしまう事があるらしい。

普通、Windows でも、JS でも、マウス・イベントなどは、イベント・キューの中
に蓄えられ、待ち行列を形成し、今実行中のイベント・ハンドラの処理が
完了するまでは次のイベント・ハンドラが実行されることは無い
(Win32では、ハンドラの中で SendMessage() を行えば話は違ってくるが。)。

ところが、ASYNCIFY=1 を指定した場合、printf() 関数の中で、新しい
マウス・イベントに対しての OnMouseMove() が、また呼び出されることが
あるようだ。これも確定事項ではない。しかし、いくつかの実験が不可解な
挙動をしていたのを、今から考えればでそう思えて来た。

そのときは、ASYNCIFY=1 を指定すると、printf() が「バグる」と思って
いたのだが。そういうカラクリだったのか・・・。
18L
垢版 |
2019/01/29(火) 10:27:43.11ID:8rAEnTT8
Emscriptenを使わずに、clang で wasm を出力してみたところ、
C の local auto 変数は、wasm の native stack(shadow stack) ではなく、
グローバル変数(wast において $global$0 という名前 ) を stack pointer
(asmjs における STACKTOP) として、memory なる HEAP8[] 相当の
JS 配列の中に確保されることが分かった。

つまり、asm.js を途中に介さないで直接 wasm を出力した場合でも、
local auto 変数は、wasm の native stack に確保されるわけではなく、
ちゃんと、HEAP8[SATCKTOP + ofs] のような意味でJS の グローバル変数の
HEAP8[] 配列のようなものの中に確保されていると言うこと。

だから、C の local auto 変数の(先頭)アドレスを取得することも出来るし、
C のglobal 変数のアドレスと、全く同じ扱いにすることが出来ている。
wasm において、Cのポインタの中に入っている「アドレス」は、
HEAP8[] 配列の index 番号である。だから、0 に近い小さな値となっている。
ポインタの値が、10 の場合、HEAP8[10] に対応している。

また、この memory は、現状、wasm 側で確保して、それを、JS 側に export
している。JS 側は、それを必要あらば、HEAP8[] 配列に「投影」することが出来る。
HEAP8 という名前は仮のもので、任意の名前をつけることが出来る。
また、同じ memory 領域を HEAP32、HEAP16、HEAP8 として、重ねるように
配列に投影することも出来る。
19L
垢版 |
2019/01/30(水) 15:30:21.11ID:vB8508VG
・LLVM は、割と簡単にデバッグ用の行番号情報を入れることが出来る。
・emcc で、-g4 と --source-map-base オプションを使えば、
 それを、sourcemap なる JS のデバッグ情報ファイルに出力できる。
・FireFox Debveloper Edition では、普通に C のソースに break point
 を指定して、wasm のプログラムをブラウザ上でデバッグできることを
 確認した。
・ただし、Web に出ている情報は、少しずつ間違っているか、または、
 現状に合ってないので、実験しないと上手くいく方法は分からなかった。

[emcc を使わないで、wasm-ld.exe を使って debug 情報を入れる方法]

・wasm-ld.exe は、wasm 用のリンカであり、入力は elf 形式似た *.o 。
 出力は、*.wasm 形式。wast が見たい場合は、wasm-dis.exe で変換する。
・この *.o は、emcc の *.o とは別。emcc の *.o は、単に拡張子が
 変わっているだけで、中身は *.bc と同じ。
・この elf 的な方の *.o は、clang で、*.bc を入力して作ることが出来る。
・wasm-ld.exe は、実験してみると、多分。この elf 的な *.o しか入力として受け付けない。
・wasm-ld.exe は、今のところ、直接的には、sourcemap を出力できないらしい。
・しかし、*.wasm の中には、既に dwarf 形式でデバッグ情報が入っているかもしれない。
・なぜなら、wast に変換してみてみると、ファイルの最後の方に ; ・・・ のコメントとして、
 それらしき記述があるから。
・この wasm の中の dwarf 情報は、wasm-dwarf なるプログラムで、sourcemap に変換
 することが出来るらしい。ところが、このプログラムは、「Rust言語」を使って書かれている
 らしい。
・だから、emcc を使わなくても、デバッグ情報を最後まで出力できる道は一応は、存在している
 かも知れない。
・最大の問題は、wasm-dwarf が Rust 言語で書かれていること。exe に直す方法があれば
 便利になると思う。
2019/01/30(水) 15:49:47.96ID:vB8508VG
Rust は、コンパイル言語なので、rustc コマンドでコンパイルすれば良いだけ
だったかも。
2019/01/30(水) 22:10:26.01ID:GmcWmER+
・wasm-dwarf を試してみたて、ちゃんと、sourcemap 形式のものを出力
 することはできた。
・FireFox Dev Ed. でCソースの行番号レベルのソースレベル・デバッグっぽい
 ことが出来る寸前まではいけた。ブレイクポイントは設定できる。
 しかし、実際にそこで停止することは出来なかった。
・もしかすると、wasm-dwarf の出力する sourcemap ファイルの mapping 部分は
 正しくないかもしれない。

・llvm-dwarfdump なるコマンドがあり、exeバイナリも容易に入手できる。
 そのコマンドを -all オプションを指定して使うと、*.wasm の中のデバッグ情報を
 全部見ることができるらしい。
・LLVM 公式サイトには、LLVM の操作ライブラリもおいてあるが、llvm-dwarfdump.exe
 や、wasm-emscripten-finalize.exe などのツール類は、そのライブラリを使って
 作られている気がする。サイズがどのコマンドも大きいくなっているのはそのせいかもしれない。
 たくさんの機能を持った汎用のライブラリがそのまま exe の中に入っているためにそう
 なっている気がするから。
2019/01/30(水) 23:38:06.00ID:YAuiBXnQ
もしかして、ここまですべて同じ人?
2019/01/30(水) 23:56:12.42ID:GmcWmER+
[エンタープライズ号、航海日誌 第5016日]

emcc を使わずに wasm をソースレベルデバッグしたい場合、
JSファイルではなくて、wasm そのものの中に、その事をマークしなければならない。

そしてそれは、「 custom section "sourceMappingURL"」なるものの中に、
JSファイルで、//# sourceMappingURL=xxxx と書く場合の xxxx の部分
の文字列を入れることで行えるらしい。

ただし今のところ、この section だけを上手く書き換える方法が良く分かってない。
wasm-emscripten-finalize.exe を使えば、書き換えることは可能ではあるが、
wasm 本体のコード部分のバイナリも変わってしまうらしいので、アドレス値が
ずれてしまうので、結局、sourcemap が狂ってしまう。

だから、何とかして、この section だけに文字列を追加する方法を見出さなくて
はならない。
2019/01/31(木) 00:30:00.40ID:OGxiQZdZ
結論的に言えば、
・custom section は、id=0 の section で、割と簡単に作ることが出来る。
known section は、id >=1 になっているので、区別が付く。
custom section は、文字列で、好きな名前をつけることが出来る。
・wasm ファイル自体が、section を chunk 方式のように羅列している
 だけなので、意外と簡単に section の追加が出来るかもしれない。
 section は、入れ子になることはなく、単に global level で1次元配列のように
 直線的に羅列されているだけらしい。ただし、それぞれのsectionのサイズは
 可変長なので、配列ではなく、「chunk」である。
・ただし、text format の wast では、custom section を定義する方法が
 用意されていないようなので、binary 形式の wasm を直接修正する
 必要があると思う。
2019/01/31(木) 09:53:09.92ID:OGxiQZdZ
Emscripten を使わなくても、ブラウザ上の wasm で、Cソース上の break point
で停止させることに成功した。

なお、海外のサイトを検索しても、その報告例は見つからなかった。
2019/02/01(金) 17:28:19.91ID:WOdIBupf
wasm は、JS の WebAssembly.instantiate() 系の関数を上手く使うと、既に、
WebWorker スレッドのコンテキストにおいても実行する事が出来るらしい。

また、実験的な確認は取れてないが、JS の WebAssembly 関連の関数の仕様と
先日から調査した HEAP8[] などによる memoy の扱い方やグローバル変数や
スタック変数の確保の仕方、ポインタ変数の中身の意味などから総合的に判断すると、
別ファイルの*.wasm を複数 instance 化できてもおかしくない仕様になっている
と思う。

ちなみに、C の関数ポインタは、wasm でも使用できることを実験して確認した。
そして、wasm においては、「関数アドレス」ではなく、「関数番号」となる。
番号に対応した関数の「関数名(関数オブジェクト)」は、table なる wasm
内の section に配列的に並べられている。
そして、JSコードからも、そのテーブルの読み書き、追加が可能。

だから、動的に関数を追加して、動的リンクなども出来てもおかしくない仕様に
なっている。
2019/02/01(金) 17:38:50.44ID:WOdIBupf
wasm, wast において:

・call_indirect の引数は、関数アドレスではなく、関数番号となる。
 この番号は、table section のエントリへの index 番号となっている。

・store アドレス, 値
・load アドレス

の「アドレス」部分は、memory section の先頭からの offset 値に
なっている。memory section は、JS コードからも参照する事が出来て、
8, 16, 32 BIT の配列としてアクセスする事が出来る。名前は任意に
ついけられるが、HEAP8[], HEAP16[], HEA32[] という配列に「投影」
してアクセスする事が出来る。型が決まった配列に投影するやり方は、
TypedArray への投影として行う。一方、32BIT値などを、アラインを
気にせずに中途半端なアドレスを指定してアクセスするには、
DataView が便利である。なお、TypedArray へ投影する場合でも、
アラインがずれている変なアドレスを先頭アドレスにして 32BIT 値の
配列にすることも可能らしい。

なお、普通のJSでは、数値は、全て 64BIT double 型の不動小数点型である。
TypedArray では、ちゃんとBIT 数を指定した整数型としての配列を作る
ことが出来る。ただし、上の例では配列を作っているのではなく、配列へ
「投影」している。
2019/02/01(金) 22:39:58.03ID:q39qofSl
[用語解説]
エントリ = アセンブリレベルのデータにおいて時々使われる言葉。
      同じサイズのデータが並んでいるような場合に、各データが
      入っている「箱」、のような意味。
      C言語の配列における各要素が入っている小さな箱のようなイメージ。
     「room」「folder」などの言葉も大体同じ意味かもしれない。
29L
垢版 |
2019/02/01(金) 22:54:21.57ID:q39qofSl
[独断と偏見の見解]

辞書に置いては、英語版でも日本語版でも、「エントリ」や「インデックス」
の意味がはっきり言って「間違っている」。自分が読んできたコンピュータ系の
技術文書に置いては、

インデックス = 「index number」のように使われて、配列の「要素番号」
        配列の添え字の意味であり、それ以外の意味で使われることは
        まずない。BYTE  a[256]; に対して、a[idx] の idx がそれ。
        変数名としては、大体 idx か index。一方、id は、identifier の
        場合が多くて、識別子。意味も少し似ていて混同してもそんなに
        問題ないかも知れないが。英語圏に置いて、配列の添え字は、大体
        index number という言葉が使われる。subscript も使われる
        こともたまにある気もするが、そっちは「下付き文字」の意味で、
        ニュアンスが結構違うと思う。

エントリ = ネットの辞書にあるような、「データ入力」や「エントリ・モデル」の
      意味ではほぼ絶対に使われない。配列や行列やテーブルの要素の
      入っている箱のような意味。「データ入力」は、多分、「data input」
      ということが多いと思う、なんとなくだが。
2019/02/03(日) 18:21:17.31ID:gzQofkZX
Emscripten や、その付属ライブラリなしで malloc(), free() ( <--- dlmalloc ) を
使うことに成功した。dlmalloc と 自分のアプリで wasm 分けずに、 リンクして
単一のwasm で行ける。 wasm の起動処理も必要なビルトイン的なJS関数の準備も、
全部自前で書いた JS で行っている。
2019/02/03(日) 19:50:39.97ID:t4xt++Qj
>>29
>それ以外の意味で使われることはまずない
「まずない」というのはちょっと極端ですね…
今思いついたところでは、インデックスレジスター絡みのアドレッシングとか命令とか、はありうると思いますね
あと index には「指標」という意味がありますから、OS 等の動きや効率を計算して振る舞いを変えるための状況指示関数みたいなものを index と呼ぶ可能性もあります
32L
垢版 |
2019/02/04(月) 11:11:39.60ID:fEV2g5eo
>>31
結論から先に言っておくと、とても言いにくいことだけど、あなたの意見はおいらの見解とは合わない。

>今思いついたところでは、インデックスレジスター絡みのアドレッシングとか命令とか、
>はありうると思いますね

Intel CPU の IA32 の「アドレッシングモード」は、Mod/RM で指定する。メモリから
データを読み書きする場合には「間接アドレッシングモード」を使い、元々の意図
としては次のようになっている。ただし、アセンブリ言語の使い方はとても自由で、
絶対この意味で使わなくてはいけないというわけではなく、元々、Intel も別の意味での
使い方も想定している。だから、言葉の意味とは違った使い方がされていることとがある。
そしてそれは悪いことではない。だから注意が必要:

[base + index * scale + offset]

base = ベースレジスタ(配列の先頭アドレスに当たる)。base は基盤。だから、先頭アドレスの意味になる。
index = インデックスレジスタ(配列の添え字に当たる)
scale = 1,2,4,8 ; スケールファクタ(配列の要素のバイト数にあたる)
offset = オフセットアドレス(ベースアドレスを少しずらす目的か、または、逆にこっちをベースアドレスにする使い方がある)

C 言語で、TYPE arr[N]; と宣言すると、TYPE 型を要素が N 個集まった配列が定義できる。
上記の間接アドレスで、scale は、sizeof(TYPE) とする事が想定されている。つまり、
arr[index] ---> [&arr + index * sizeof(TYPE)] のように置き換わり、
scale = sizeof(TYPE); の場合に相当する。だから、この場合も、index は紛れもなく配列の添え字である。

ただし、scale=1 に設定することで、index の部分にベースアドレスを指定することも出来るように
なるので、実際のアセンブリ言語では、index が添え字であるという元々の意味を超え、さまざまな使われ
方がされている。しかし、それは、index の言葉の意味が「添え字」である、という事を否定すること
にはならない。
33L
垢版 |
2019/02/04(月) 11:25:05.10ID:fEV2g5eo
Z80 には、IX、IY という16BITレジスタがあり、
LD A,(IX + 4)
使い方が出来た。4 の部分は、8BIT の定数を指定する。
Z80のアドレス幅は16BITだったので、8BIT 値では、ベースアドレス
を指定することは出来ない。その意味では、IX は、配列の添え字ではなく、
先頭アドレスを指定するのがほぼ必須となっていた。

でもこれは、いまからずっと古い話で、どういう経緯かは分からないが、
index は、今では、99.9 % 位は、配列の添え字(文字の位置もここでは同義と
考える)という意味で使われるようになってきている。例えば、言語としては
C/C++ よりは新しい JS においても、indexOf() がある。これも文字の位置を
返す関数なので、配列の添え字と同一視する事が出来、index という言葉が、
やはり配列の添え字として使われていることが分かる。

最近では、配列とリンクリストの違いが分かってない人が増えているので、
index の意味を誤解する人が出てきているかもしれない。
34L
垢版 |
2019/02/04(月) 11:34:20.94ID:fEV2g5eo
>>1
>あと index には「指標」という意味がありますから、OS 等の動きや効率を計算して
>振る舞いを変えるための状況指示関数みたいなものを index と呼ぶ可能性もあります

Intel Manual や、Microsoft (MSDN Libydary など), JavaScript, Java, Ruby, Perl
などではそのような使い方がされることはないといっても過言ではない。
35L
垢版 |
2019/02/04(月) 11:36:44.96ID:fEV2g5eo
なお、誤解を与える前に書いておくと、これは、99%位、記憶に頼って書いている。
Mod/RM の部分は、100%脳内の記憶から書いた。
36L
垢版 |
2019/02/05(火) 01:17:05.71ID:1Lt6uOg9
>>6
[Wasm & Windows 共通 GUI Toolkit, with NWSC used]

http://nowsmartsoft.atwebpages.com/

↑ 別の無料サーバー(海外のもの) に置き直してみた。

[事情]
>>6 で借りてる無料サーバーは、サーバー(Xrea)自体が
 BitDefender Traffinc Light の BlackList に入ってしまっていて、「黄色」ランプ
 になっていたので気になっていた。過去に この Xrea サーバーのバナー広告がトロイ
 の木馬に感染してしまっていたらしい(当然だが、オイラとは全く関係ない)。 

・新しいサーバーは、BitDefender Traffinc Light の BlackList に入ってないので
 緑色のランプになっている。
2019/02/05(火) 15:47:24.76ID:1Lt6uOg9
Emscripten を使わずに、>>36 のビルドに成功。
分割コンパイル時の最後のリンク時間が速くならずに困っていたのが、
激速になった。また、出力される wasm、ランタイムの js、html のサイズが
小さくなり、ランタイムがシンプルになって何をやってるのかとても分かり
易くなった。ライブラリも何をやってるのか分かり易くなったしサイズも
激減したので、配布も楽になりそう。処理系もほぼ全てバイナリになったので
Python や node.js、Java などの処理系の配布も不要になった。
38L
垢版 |
2019/02/05(火) 18:27:56.95ID:1Lt6uOg9
>>37
ひきこもりのLが、早速、設置してみた。

[1]. Emscripten を使わず、nwsc と clang-toolset と nwstk と dlmalloc だけ(?)を使って作ったもの :

URL: http://nowsmartsoft.atwebpages.com/

index.html : 2KB
start.js  : 16KB (wasm の起動とJS側の関数類)
test.wasm : 67KB (wasm アプリ本体)

nwsc は、独自 C++ nex compiler で、llvm のフロントエンド。wasm 用の
独自拡張を持っており、Emscripten と同様の EM_ASM({・・・}, ・・・);
が使えるが、その場合、JS 関数を直接、JS ファイルに出力するので、
恐らく Emscripten より効率が良いと思う。

test.wasm は、wasm-opt.exe で最適化すれば、もっと小さく出来る。
start.js も minimize ツールを使えばもっと小さく出来る。
また、test.wasm は、今後、圧縮して配布することも可能だと思われる。

--------------------------------------------------------------------------------------
[2]. nwsc と Emscripten (emsdk, emcc, clang, binaryen, ライブラリなど) を使って作ったもの :

URL: http://nowsmartsoft.atwebpages.com/emcc

index.html  : 8KB
MainWnd.js  : 123KB (wasm の起動とJS側の関数類)
MainWnd.wasm : 104KB (wasm アプリ本体)

なお、Emscripten でも、もっと小さく作ることは可能かもしれない。また、今回は、-s ASYNCIFY=1 は使ってない。
39デフォルトの名無しさん
垢版 |
2019/02/07(木) 00:00:12.17ID:FsbblVW+
age
40デフォルトの名無しさん
垢版 |
2019/02/07(木) 17:57:22.68ID:fRacvqu0
https://i.redd.it/7vuxeeptx2f21.png

↑ Chrome 内で (試作品の) 独自 Windows System (?) を実行中のキャプチャ
画像。
41L
垢版 |
2019/03/11(月) 12:54:38.07ID:HTmv6ctw
>>1
自作 C++ compiler nwsc で、bsync, bwait, bresume, bcall なるものを実装し、
bsync 修飾された関数にはコンパイラが変形した特殊なコードを出力する
事で、JSのイベントループの制限を突破することに成功した。次のことが出来る
ようになった/なる:

1. イベントハンドラ実行中に、独自のイベントループを作ってそこで任意のイベントの発生を
 待機/処理する。メニュー・イベントのハンドラの中でハンドラを終了する事無く、
 独自のファイル入力ダイアログを出し、OK/CANCELボタンが押されるまで待機し、
 続けて必要な処理を行うこと。

2. CPUパワーや電力を消費する事無く、その場で待機する事ができる Sleep() 関数の実装。

3. getch(), getche(), (ポケコン)BASIC の pause, wait, input 相当のものの実装。

#なお、bsync などの語頭の「b」は、「async(非同期)」の a を b に変えたもの。
 JS の async, await より強力なので a の次を表す意味で b にした。
42L
垢版 |
2019/03/29(金) 10:50:18.05ID:sD1xGsa7
>>1
自作 wasm demo を更新した。
・Ctrl+ +, Ctrl + - での拡大縮小、Ctrl+Shift+I での開発者モードへの遷移(Chrome)が可能に。
・コンソール出力(textarea)へのコピペに対応。
・サーバーに置いてある jpg ファイルを読み込んで独自 Window 内への描画に対応。
 回転表示可能。
・demo1 : 2枚の Windowにedit widget のテスト。メニューあり。ブラウザ内にある
 独自Window のドラッグ移動とサイズ変更が可能。
・demo2 :2枚の jpg 画像を読み込んで表示するテスト。
・同じソースからビルドした Windows native 版も手元にある。
・Window も Widget 類も全部自前で描画しているのでタイトルバーの色や枠の太さなどは
 自由に変えられる。原則的に native 版と wasm版で pixel 単位で全く同じ見た目。

http://nowsmartsoft.atwebpages.com
http://nowsmartsoft.atwebpages.com/demo1/index.html
http://nowsmartsoft.atwebpages.com/demo2/index.html
43L
垢版 |
2019/03/31(日) 12:58:32.59ID:vDO0/VaM
>>1
wasmとcanvas 2Dを使った3D地形(?)のスクロールサンプルを作ってみた。

http://nowsmartsoft.atwebpages.com/demo_land/index.html

ご覧ください。思っていたよりはちょっと遅いかな。
WebGL使ったら速くなるかもしれない。
44デフォルトの名無しさん
垢版 |
2019/04/01(月) 14:17:41.70ID:QUlyRw/u
どうせWebGL使うんだったらwasm使う意味なくね
45L
垢版 |
2019/04/01(月) 14:30:39.86ID:YLhs0zdh
wasmがなぜ重要かは、まだ言わない。
46デフォルトの名無しさん
垢版 |
2019/04/01(月) 14:40:56.11ID:bzrp4n7u
naclとは別物なの?
2019/04/01(月) 15:00:24.18ID:RkAplvWW
>>46
wasm (= WebAssembly) は、NaCl (= Google Native Client)
とは別物。
48デフォルトの名無しさん
垢版 |
2019/04/01(月) 15:07:19.83ID:bzrp4n7u
PNaClを使ってたんやね
2019/04/01(月) 15:12:02.16ID:YLhs0zdh
Google Native Client は、WebAssemblyの普及に伴いそちらにリソースを
集中するため開発を終了し、2019年にChromeから削除されることが発表
された。
2019/04/01(月) 15:22:44.69ID:RkAplvWW
>>48

>>42 >>43」は、PNaCl ではなく、WebAssembly を使ってる。
2019/04/01(月) 17:34:37.66ID:RkAplvWW
>>1
どうも世界には、Java でも C# でもない共通プラットフォームを作りたがってる人たちがいて、
その中には、FireFox, Google, Apple が含まれるらしい。

WASI = WebAssembly System Interface

なるものの標準化が進められており、例えば、native のファイルシステムに直接アクセスできるようになり、
それによって wasm がブラウザ内部に留まらず、Javaのようなプラットフォーム非依存の共通アプリケーション
が作れる存在になることを目指しているらしい。


# 2019/03/27 の記事:
https://hacks.mozilla.org/2019/03/standardizing-wasi-a-webassembly-system-interface/
# 2019/03/28 の記事:
https://www.infoworld.com/article/3384920/mozillas-wasi-takes-webassembly-beyond-the-browser.html



なぜかタイムリーに Java への批判が出てきた。
「Java は安全な言語ではない」:
# 2019/03/28 の記事:
https://lemire.me/blog/2019/03/28/java-is-not-a-safe-language/
2019/04/02(火) 01:15:22.26ID:LpV8NoZ4
>>1
Adobe自身も、FlashからWebAssemblyに移行するらしい:
https://blogs.adobe.com/japan/201707adobe-flash-update/

>>50
アメリカの掲示板 Reddit での WASI のスレッド:
[Standardizing WASI: A system interface to run WebAssembly outside the web]
https://www.reddit.com/r/programming/comments/b65yn7/standardizing_wasi_a_system_interface_to_run/
2019/04/02(火) 02:11:54.11ID:N1DZco4a
何度もあらわれては消えていく"write once run anywhere"のコンセプト・・
はてさてどうなりますやら
54デフォルトの名無しさん
垢版 |
2019/04/02(火) 11:07:57.88ID:5+C+zQyU
wasabiならもっと流行るはず
2019/04/02(火) 13:50:43.70ID:ZD2r0ERn
>>53
C#も、XamarineもUnityもその思想をやろうとしてると思うけど。
2019/04/03(水) 01:36:20.38ID:UEgi/Llh
「C# Run Anywhere」でGoogleって、海外のサイトを見ていたら、
C#は設計上は、仮想マシン上で動くことになってるけど、MS公式の
Runtimeで、大体動くのは、大体WindowsとMacだけで、実質、
Windows向けだと書いている人がいた(それが本当かどうかは分からないけど)。
少なくとも、以下のようなことは大体正しいのではないかと思う。
・MSにとって、C#がマルチプラットフォームになることはマイナスである。
・MSはC#をRun anywhere にすることには力を入れてないか、目指していない。
57L
垢版 |
2019/04/03(水) 15:29:38.83ID:+15LYwzR
>>43
結論から言うと、ゲームに置いては、ブラウザ内アプリと native アプリのどちらで
組むかは、速度性能で選ぶ必要がなくなりそうだ。理由は以下の通り:

今回、試しに描画部分をWebGLに変えてみたら、劇的に高速になった。
詳しくは分からないが、恐らく native アプリで Direct3D を使った場合に匹敵するくらい
の速度が出てると思う。結果、多くのゲームに関してはブラウザ内アプリとnative アプリで
速度差がほとんど出ないと思われる。なぜなら、mainプログラムでは描画に関しては
全く何もやることが無いといっても過言ではないのに、大抵のゲームでは描画以外の
計算は物凄く軽いから。
人体の間接などを滑らかに描画するボーンの演算ですら、プログラマブルな Vertex Shader
により GPUで行えるし、パイプライン化されているので相当重い計算でも、描画速度には
ほとんど影響を与えない可能性が高い。
58L
垢版 |
2019/04/03(水) 18:27:34.57ID:+15LYwzR
>>1
一応、作ってみたものを公開しておくので見てね。

地形データの WebGL によるワイヤーフレーム描画のデモ:
http://nowsmartsoft.atwebpages.com/demo_land_WebGL/index.html

地形データの WebGL によるポリゴン描画のデモ:
http://nowsmartsoft.atwebpages.com/demo_land_Polygon/index.html


まだそんなに高速化は施してないので、もっと高速になる余地がある。
例えば、頂点データはフレーム描画毎にコピーしてしまっている。
頂点カラーも 0〜255 の BYTE 形式から、0.0〜1.0 の float 形式に
wasm のコードで変換している。それらは本来は不要なものだけど、
今回は修正せずに見切り発車的にそのまま公開した。

それと、実際にやってみると、時々ガタガタと止まった感じがするけど、
それは、JavaScript の GC (Garbage Collection) が時々起動してしまって
いるからだと思う。

wasm を使っていても、グラフィック描画のためにはどうしてもJavaScript
は使わざるを得ないので、いつのまにかこうなってしまっていた。もう
ちょっと工夫すれば、GC の発生を抑えることが出来るんではないかと思っている。
今回、WebGL を始めて使ったので、その際、ネットにあったサンプルをそのまま
使ってみている部分があり、その結果、OnDraw() 関数の中で TypedArray 配列
を new したりしてしまっている。それが一番の原因ではないかと思われる。
59デフォルトの名無しさん
垢版 |
2019/04/04(木) 10:51:29.71ID:4Pg7/9jZ
WebGL
https://tech.griphone.co.jp/2018/11/05/js-on-unity-webgl/
60L
垢版 |
2019/04/04(木) 16:12:58.84ID:LemJlt/3
>>1
Voxel space 風の3D表示をやってみたので見てね v(⌒▽⌒)У
http://nowsmartsoft.atwebpages.com/demo_land_Voxel/index.html
61L
垢版 |
2019/04/05(金) 16:28:39.72ID:xS705/9I
>>1
一応、スマホのタッチ入力によるWindowの移動やサイズ変更に対応してみたよ。
実機では一度も試してない(スマホ持ってない)ので動作報告あったらうれしいな:
http://nowsmartsoft.atwebpages.com/
2019/04/05(金) 19:37:10.55ID:IRsRTegS
すまん
正直広告がうざくて萎える
63L
垢版 |
2019/04/05(金) 19:50:46.66ID:xS705/9I
>>62
PCでテストしてたら広告が出てこなかったかが気づかなかったけど、
Chromeのスマホモードで見てみたら、非常に問題ある位置に広告が出て
来ることが分かって今、めちゃくちゃ対処に困ってるょ。
位置を変える方法が見つからない・・・。Ninja Analyzerのものなのか、
ZettaHosting (atwebpages) のものなのかも分からない。
2019/04/06(土) 02:27:57.47ID:/MkWaZI9
>>62
広告、消えたよ。
2019/04/06(土) 02:53:07.58ID:/MkWaZI9
広告、最初の導入ページには残ってるけど、各demoページでは消えてるらしい。
2019/04/06(土) 03:17:09.51ID:d3+s3AWp
レイトレーシングやってほしい
67L
垢版 |
2019/04/06(土) 12:27:52.58ID:c/dtyqqS
>>1
地形生成のアルゴリズムを変えて、山っぽくしてみたよ。
荒涼とした山肌に、心休まる緑が点在するょ:
http://nowsmartsoft.atwebpages.com/demo_Mountain/index.html

地形データは、起動後に自分で生成してるょ。
68L
垢版 |
2019/04/06(土) 12:55:17.11ID:c/dtyqqS
Windows に最初から入ってるブラウザの IE では残念ながら見られないので
FireFox か Chrome を入れてね。FireFox が速いみたい。
2019/04/06(土) 16:08:04.28ID:DWbJNRMu
ソースはいつ公開しますか?
2019/04/06(土) 16:11:15.39ID:d06Kh2dO
>>69
応援してくれる人が多そうなら公開するかなぁ。
2019/04/06(土) 16:20:00.28ID:c/dtyqqS
言い忘れてたけど、これは新しい言語 C++ nex のコンパイラ nwsc と
新タイプの統合開発環境のデモ的なものなので、そっちを応援してくれる
人が増えそうならデモや TOOLKIT(NWSTK) のソースを公開しようかな
と思ってる。
2019/04/06(土) 16:29:49.76ID:c/dtyqqS
ちなみに、おいらは引きこもりなのでお金が無いんだょ。
73デフォルトの名無しさん
垢版 |
2019/04/07(日) 16:35:02.31ID:e/tK/Nk6
>>1
海外の掲示板などでに出ていた Wasm が VM(Virtual Machine)として、
JVM (Java の VM) や Flash の VM より優れていると考えられている点の
内、今思い出せるものと書いておく:

1. JVM や FlashVM は、それぞれ一社のものだが、Wasm の VMは、
  FireFox, Chrome, Apple などの多数のベンダーの合議により
  決まった公開仕様である事。例えば、Googleが自分勝手に
 何かしようとしても、FireFox などがそれに逆らうことが出来る(?)
 ため、問題が生じにくい、と書いている人がいた。

2. 実際、第三者的な組織から、Lucet, wasmer, wasp, wasabi,
 binaryen(元々有ったが) など色々出てきているらしい。

3. そもそも、JVM は、設計が、ほぼ Java 専用になっていて、例えば、
  変数の型などのMeta情報が Java 専用だったり、GCを前提とした
  仮想コード、仮想マシンになっているらしい。その結果、
  FrontEnd に C/C++ などを含めた広く一般的な言語が対応
 するのは難しいらしい。つまり、一般的な言語の BackEnd
 としては無理があるらしい。

4. JVM は、セキュリティー上の問題がある、とされていた。
 なんでも、ブラウザと JVM の境界線上で問題が生じることが多いらしい。
 クラッカーは、ブラウザと JVM の間のセキュリティー上の約束事や
 (仕様上の)意思疎通の齟齬(?)を見つけて何かやってくるのか知れない。

5. JVM はブラウザの拡大率を変更しても追従しにくいが、wasm だと
 追従しやすいらしい。
74デフォルトの名無しさん
垢版 |
2019/04/07(日) 16:59:47.19ID:e/tK/Nk6
>>73
6. JVMを使うには、使いたい人が自分で JRE をインストールする必要があったが、
 wasm だと、IE以外の新しいバージョンの主要なブラウザなら全て最初から
 対応している事。そのため、多くの人に届きやすいプラットフォームである。

7. Java(Applet)やFlashは既に、数年後にはChromeからは実行できなくなる予定で
 あるが、wasm は逆に、Flash(Adobe) までもが backend として対応すると
 宣言している。
75デフォルトの名無しさん
垢版 |
2019/04/08(月) 18:03:38.12ID:pvsbwYPC
>>1
ウェブ・アプリをローカルで実行したい場合に参考になりそうなもの
・Google Gears
・PWA = Progressive Web Apps
・WASI = Wasm System Interface
・blob, fetch, XHR
2019/04/08(月) 18:17:36.29ID:N9bPT30p
>>75
・Electron, Chronium ---> ブラウザの枠を超えた Window が出せる。
・Chrome Apps (廃止)
77L
垢版 |
2019/04/21(日) 17:21:20.81ID:1Wk1O9hC
http://nowsmartsoft.atwebpages.com/

↑ demo1 の EditWidget が、MobileのOn-Screen Keyboardに対応して、
PCでも日本語の入力が出来るようになったよ。

「今まで出来なかったの?」って? ブラウザのせいだよ〜!
78デフォルトの名無しさん
垢版 |
2019/05/18(土) 16:05:19.62ID:dUyfgnsN
>>1
ブラウザ上だとタイトルバーとURLアドレス欄で画面に無駄が消費されてしまう問題は、
「WebView」のようにアプリの内部にブラウザを埋め込んでしまえばいい。
それを使えば、キャッシュされてしまう問題も回避できるかもしれない。
2019/05/18(土) 17:12:47.28ID:4C+see96
google「そう思ってDesktopPWAって枠組み用意しときました」
2019/05/18(土) 17:59:00.81ID:81A5W8ik
PWAの作り方は良く分からないけど、アプリの審査がいらないのは
子供達にも向いてるかもね。
2019/05/18(土) 18:07:19.99ID:dUyfgnsN
でも、https必須らしいので、年間維持費がかかりそう。
・登録料無料のhttpsを使うのには独自ドメインが必須らしい。
・サブドメン方式でhttps使う場合は探した限り無料で出来るレンタルサイトはない。
2019/05/18(土) 18:09:37.44ID:4C+see96
デスクトップPWA
https://developers.google.com/web/progressive-web-apps/desktop
日本語版ないからクロムの翻訳機能使ってくれ
2019/05/19(日) 01:51:24.70ID:Z8fjcguw
世の中なんでも結局は金金金か!!
84デフォルトの名無しさん
垢版 |
2019/05/19(日) 11:00:10.59ID:NVj9TkQF
ほんそれ
2019/05/19(日) 11:10:01.48ID:CRfL0LbB
github pagesあるやんけ
2019/05/19(日) 11:28:02.61ID:sA5/dcdL
netlifyあるやんけ
2019/05/19(日) 12:52:29.06ID:z0IbZyMD
https://yutakaaoki.github.io/
↑良く分からんけど、ひとまず https で wasm のデモ・ページ作ってみたで〜
2019/05/19(日) 17:06:00.28ID:+a0Gc7NS
wasm ていう単語見るたびにいつもこいつが頭に浮んでしまう
https://ja.wikipedia.org/wiki/%E3%82%8F%E3%81%95%E3%81%8A#/media/File:Wasao.jpg
2019/05/19(日) 17:57:24.92ID:pfNk1t/q
twitter の #wasm タグ、今年に入ってから急激に活発になってる気がする。
去年は数週間に一回の書き込み、みたいな感じだったようだけど、今月なんかは
数十分に一回の書き込み位になってる。求人広告まで沢山出だして、wasm技術者
を探す第一回目の会議(?)みたいなものまで出てきたらしい。
2019/05/19(日) 18:01:09.59ID:pfNk1t/q
ITの世界では、良く分からないところで誰かが商売に結び付けて大儲けし出す
事が多かったから、先に動こうとしてるんだろうか。クラウドとかも本当に
メリットがあるかどうかおいておいて、ブームのようにして大金が動いている。
2019/05/19(日) 19:04:28.84ID:pfNk1t/q
The web always wins. # ウェブはいつも勝つ
と書いてる人がいた。
面白い見方だな。
2019/05/19(日) 19:11:38.67ID:pfNk1t/q
「Wasmで最も重要なのは、Secutrityの面である」
と書いている。WasmはSandBox内で動作しているので安全だと。

なるほど、「Webがいつも勝つ」一つの原因は、安全性が高いことなのか・・・。
そういえばブラウザ上で動いている限り、まずウイルス感染しないな・・・。
そうか、スマホが流行る原因も、マシンのトラブルが少ないからかもしれないな。
PCだとOSが不安定になって使えなくなることが多いのと対照的。
なるほどなぁ・・・。
2019/05/19(日) 19:25:02.22ID:pfNk1t/q
https://byterot.blogspot.com/2019/05/why-webassembly-matters.html

ここにそのことが書いてあるよ。
94デフォルトの名無しさん
垢版 |
2019/05/20(月) 14:01:02.69ID:pxNnSyNl
上手くいけば、AppStore登録の月額利用料金が開発者にかからないでiPhone/iPad
ようのアプリが作れるかも知れない。
iOSでも、去年の3月くらいにSafariもPWAに対応したらしいし、Chromeも使える。
となると、ウェブアプリをWasmで作っておいて、PWAを使えば普通のアプリの
ようにHome画面にアイコンを登録できるし、実行時にアドレスバーも出さなく
できる。Safariで駄目な場合は、iOS用のChromeもある。
2019/08/11(日) 11:35:01.71ID:UiwR3IAb
wikiで宣伝はアカンでよ
96デフォルトの名無しさん
垢版 |
2019/09/12(木) 22:35:47.25ID:Uy9QyXie
>>40
トンでもねぇ色彩センスwww
さすがに草不可避wwwww
97デフォルトの名無しさん
垢版 |
2019/09/13(金) 10:13:11.78ID:wKEqF87n
NG かどうか試してみる
http://nowsmartsoft.atwebpages.com/
2019/11/18(月) 16:14:21.51ID:Vzii0sJA
C++をソースとするwasmとPWA(Progressive Web Application)化できる
ことを実際に確認することが出来た。Chrome+Win7の組み合わせで
wasmアプリをローカルにインストールできてデスクトップにアイコン
を作成することができる。アイコンをクリックすると、ある種の
nativeアプリの様な雰囲気で起動できる。
99デフォルトの名無しさん
垢版 |
2019/11/18(月) 16:14:54.06ID:Vzii0sJA
C++をソースとするwasmをPWA(Progressive Web Application)化できる
ことを実際に確認することが出来た。Chrome+Win7の組み合わせで
wasmアプリをローカルにインストールできてデスクトップにアイコン
を作成することができる。アイコンをクリックすると、ある種の
nativeアプリの様な雰囲気で起動できる。
100デフォルトの名無しさん
垢版 |
2019/11/18(月) 16:15:25.78ID:Vzii0sJA
age
101デフォルトの名無しさん
垢版 |
2019/11/18(月) 19:53:09.11ID:Vzii0sJA
https://yutakaaoki.github.io/pwa-wasm-demo1-B/

ここに wasmアプリが置いてあるが、Chromeで訪れると アドレスバーの右の方に
「インストール」という文字が現れ、しばらくすると、○で囲った + 記号に変わる。
そこをクリックすると、PWAとしてローカルPCにインストールできる。
または、右上の縦に3つの点があるボタンを押してみると、
『「PWA NWSTK」をインストール...』
というメニュー項目が出来ているので、そこをクリックしても同じ機能が働く。
2019/11/20(水) 09:18:48.73ID:Zp1gFICP
Mozilla、Fastly、Intel、Red HatがWebAssemblyをターゲットに「The Bytecode Alliance」
https://news.mynavi.jp/article/20191118-925267/
103デフォルトの名無しさん
垢版 |
2019/11/20(水) 12:43:45.81ID:vKT/00gf
>>101
https://yutakaaoki.github.io/
ここにおいてあるものは、全部PWAに対応してみた。
Windowsならインストールできると思う。
AndroidやiPhoneなどでも出来るか試して欲しい。
2019/11/20(水) 12:51:31.62ID:vKT/00gf
>>103
まだ本当の意味でのソースではないけど、
https://github.com/YutakaAoki/YutakaAoki.github.io
以下の
https://github.com/YutakaAoki/YutakaAoki.github.io/tree/master/demo1
などに index.htmlや、*.wasm, *.js, manifest.json などは置いてある。

wasmアプリの作り方、PWAの作り方、wasmとPWAの組み合わせ方、に興味のある人は
参考までに。
105デフォルトの名無しさん
垢版 |
2019/11/20(水) 13:48:41.27ID:pcdm34G4
で、これで何ができるの?
2019/11/20(水) 14:49:34.93ID:vKT/00gf
>>105
・セキュリティーが凄く強いアプリ。信用できないようなサイトからインストール
 しても、レジストリには読み書きできないし、システムフォルダや他のアプリの
 フォルダには、人間がマウスやキーボードなどから実際に指示しない限りは書き込めないし、
 読み込むことも出来ない。変な場所にインストールされたり、スタートアップ起動などに
 勝手にされることも無い。
・アプリの体験版をインストールすることなく、普段のウェブ閲覧の延長線上に
 試せるのでユーザーは遊び半分で気軽に試すことが出来る。また、掲示板などから
 リンクを張った先がすぐにアプリとなっている。その後、デスクトップや
 ホーム画面にアイコンを追加し、単独アプリの用に振舞うことが出来る。
・なぜか全てがウェブに移行するようになっており、「いつもウェブが勝つ」。
・iPhoneやiPad用のアプリが無料で開発出来る可能性がある。今までは、
 それらをターゲットに開発するには、Mac実機がどうしても必要となり、
 かつ、AppStoreに登録しないと配布することも出来なかったが、AppStoreは
 年会費も必要で、生涯にわたってずっとコストが掛かかり続けていた。
・ブラウザが互換性を保つので、PCで試して動けば、AndroidやiPhoneでも
 近い動作になる可能性が高い。
・Chrome, FireFox, Safari, Edge, Opera なども wasm に対応している
 (ただし、ツールキット側がテストはしておく必要はある。)。
2019/11/20(水) 15:00:00.13ID:AFHj5vY6
Java Appletと何が違うの?
2019/11/20(水) 15:00:41.97ID:vKT/00gf
>>106
【追加】
・画面が、Ctrl+ +, Ctrl+ -で好きなように拡大縮小できるので、近視や老眼などで
 目が悪い人でも好きな文字の大きさで読むことが出来る。それがWebアプリでも、
 PWAアプリ化したものでも出来る。
・ツールキットも含めてサイズがとても小さい。ブラウザさえ使える状態であれば、
 DLLやランタイムのインストールが全く不要。demo1は、*.htmlや*.js, *.wasm全て
 合わせて 150KB、demo-Mountainは、153KB。JavaランタイムもQtランタイムも
 MFCのDLLも何も要らない。
2019/11/20(水) 15:11:39.18ID:vKT/00gf
>>107
・Java Appletは、訴訟トラブルのせいか、ChromeもFireFoxが対応しなくなって
 しまった。
・wasm は、C++ が使えるので、GC を使わないプログラムが出来、
 メモリが多く使うウェブアプリを作ろうとした場合に、体感速度が非常に
 違ってくる。Javaだと、GCが走ると一分間停止するようなことがあった。
 wasm と C++ の組み合わせだと、このようなことが起きないので、
 プログラムした通りの一定の速度が維持できる。
・Java は、逆コンパイルするとほぼ元ソースに戻せてしまう性質があった。
 それを防ぐには曖昧化などが必要であり、手間や(ツール購入の)コスト
 が掛かった。曖昧化するためにコンパイル時間が増大した。
・Javaが有料化したという話がある。これについては諸説あるのでよく分からない。
2019/11/20(水) 15:14:47.33ID:vKT/00gf
>>109
・Java Applet より起動が速い。
2019/11/20(水) 15:18:23.10ID:vKT/00gf
>>110
・wasm内部からは、EM_ASM()構文などで自由にJavaScriptが使えるので、
 XHRやfetch()などを自由に使ったAjax流儀のプログラムが行える。
・簡単に HTML 要素と共存できる。
・ブラウザの画面を拡大したような場合に、JavaAppletだと追従するのが
 難しく、できないことはないがタイムラグが生じ易かった。
 Ctrl+ + での拡大も、JavaApplet 部分だけは置いていかれるようなことに
 なったので、対応したければ独自に工夫する必要があった。
2019/11/20(水) 15:54:16.93ID:vKT/00gf
>>111
・iOSでは、もともとJavaが使えないと聞いている。
・Androidは、基本がJavaではあるが、実際には、Google独自実装となってしまって
 おり、 Sun/OracleのJavaで昔からの標準の Swingなどを使ったものは動か
 せない。これが訴訟問題になった最も大きな原因の一つらしい。
2019/11/20(水) 19:15:30.47ID:vKT/00gf
>>108
ツールキットに用意されて無い機能を追加したい場合、JavaScript として書けば
よいのであらゆるプラットフォームへ迅速に対応できる。
他のツールキットの場合は、iOS/Andorid/Win/Mac/Linux など用にそれぞれ
書く必要がある。
2019/11/21(木) 15:21:55.41ID:0fDEV4Sz
PWAは、頻繁にアップデートしたいアプリに向いている。
2019/11/21(木) 16:02:31.75ID:0fDEV4Sz
PWA化後のデスクトップのアイコンが、物凄くいろいろなことをやっても古いまま
全く更新できなく立った。
どうしよう。
■ このスレッドは過去ログ倉庫に格納されています
5ちゃんねるの広告が気に入らない場合は、こちらをクリックしてください。

ニューススポーツなんでも実況