Web版吉里吉里SDL2_JS_TJS_Interface_メモ.md

Web版吉里吉里SDL2 JS⇔TJS Interface メモ

Web版吉里吉里SDL2はJavascriptを呼び出せます。 足りない機能をJavaScriptで書けたりします。

仕組みとしてはEmscriptenの仕組みを呼び出す吉里吉里プラグインであり、実装は「krkrsdl2/src/plugins/kremscripten.cpp」にあります。

おことわり

これは@xyx0no646のチラシの裏です。内容は保証できません。

Call TJS from Javascript

Module.evalTJSからTJSを呼ぶことができます。

var result = Module.evalTJS('TJS式');

var platformName = Module.evalTJS('System.platformName');

Call Javascript from TJS

KirikiriEmscriptenInterface.evalJSからJavaScriptを呼ぶことができます。

var tjs = KirikiriEmscriptenInterface.evalJS('JavaScript式');

global.window = KirikiriEmscriptenInterface.evalJS('window');
global.window.alert('hello world'); //いかにもTJSのコードのように動作する

XP3ファイル内部のJavaScriptを読む

XP3ファイル内部にJavaScriptがある場合、それを読み込めます。

// test.jsを読む
KirikiriEmscriptenInterface.evalStorageJS('file://./data.xp3>test.js', '');

JavaScript上でXP3ファイルを扱う

xp3内部のファイルをJavaScriptコンテキスト上のUInt8Arrayにすることができます。
Blobのような扱いやすい形にも変換できます。

// test.oggをJavaScript世界のBlobとして持ってくる
var blob = new Blob([Module.getStorageUInt8Array("test.ogg")], {type: "audio/ogg"}));

メモリリークに注意

JavaScriptとTJSがくっついたかのようなコードが書けますが、実際には吉里吉里プラグインを通して通信しています。

JavaScriptのヒープメモリはブラウザが管理しており、TJS2のヒープメモリは吉里吉里が管理しているので
コールバックを使う場合は少し意識してください。

特にJavaScriptコンテキストからコールバックをつかってTJSのコードやオブジェクトをその都度生成して呼び出すことは避けてください。
繰り返し呼び出す場合はTJS側でグローバル変数などに置いておいてそれを呼び出すとメモリリークしません。

以下具体例です。

If you keep on creating new functions and passing them to JS you will possibly get a OOM situation. https://twitter.com/uyjulian/status/1440071481459838985

また、BlobURLを発行した場合は必ずrevokeObjectURLなどで後始末してください。
（これは通常のJavaScriptでも注意が必要ですが……）

参考

TJS<->JS interface information
https://gist.github.com/uyjulian/66bb0466136d04bc1920d55894edb8c0