private void Reconfigure()
{
IDisposable oldpool;
using (var cfg = new ReactConfiguration())
{
Configure(cfg);
lock (this)
{
if (watcher != null)
{
watcher.StopNotify();
}
oldpool = (IDisposable)_ReactPool;
_ReactPool = cfg.GetReactPool();
watcher = cfg.Watcher;
Preprocessor = cfg.PreprocessorFunction;
Postprocessor = cfg.PostprocessorFunction;
if (watcher != null)
{
watcher.StartNotify(this.Reconfigure);
}
}
}
if (oldpool != null)
{
oldpool.Dispose();
}
}
internal JsEngine(JsEnginePool pool, int nr)
{
Contract.Assert(pool != null, nameof(pool) + " is null.");
Pool = pool;
SerialNumber = nr;
SetContext(null);
}
void IDisposable.Dispose()
{
if (BabelPool != null)
{
((IDisposable)BabelPool).Dispose();
}
BabelPool = null;
}
/// <summary>
/// Freeze the Babel <see cref="ScriptRepository"/> and create a <see cref="JsEnginePool"/> for JSX to JS compilation with Babel.
/// </summary>
/// <returns>A <see cref="JsEnginePool"/> with initialized Babel, ready for compiling JSX to JS</returns>
private JsEnginePool GetBabelPool()
{
LoadExternalScripts();
if (BabelPool == null)
{
BabelPool = new JsEnginePool(BabelRepository);
BabelPool.Name = "BabelPool";
}
return(BabelPool);
}
internal JsEnginePool GetReactPool()
{
LoadExternalScripts();
if (ReactPool == null)
{
ReactPool = new JsEnginePool(ReactRepository)
{
Name = "ReactPool"
};
}
return(ReactPool);
}
public static void SayHello()
{
Console.WriteLine("Hello from Core");
var JSX = "var HelloWorld = React.createClass({ render() { return (<div>Hello {this.props.name}!</div>); } });";
// preparation phase
var rt = new ReactRuntime(cfg => {
cfg.ScriptContentLoader = (s => s); // we load literals for now, not files.
cfg.AddJsx(JSX);
});
// runtime phase
using (var engine = rt.ReactPool.Engine)
{
var o1 = engine.Evaluate("ReactDOMServer.renderToStaticMarkup(React.createElement(HelloWorld, { name: \"Mike Meyers\" }))");
Console.WriteLine(o1);
var o2 = engine.Evaluate("ReactDOMServer.renderToString(React.createElement(HelloWorld, { name: \"Mike Meyers\" }))");
Console.WriteLine(o2);
var rr = rt.RenderToStaticMarkup("HelloWorld", new { name = "World using engine" }, engine);
Console.WriteLine(rr.render);
}
var sw = Stopwatch.StartNew();
var r = rt.RenderToStaticMarkup("HelloWorld", new { name = "World" });
sw.Stop();
Console.WriteLine("{0} in {1}", r.render, sw.Elapsed); // 1.6ms on my i7 machine
Console.WriteLine("Compiling {0} ...", JSX);
var babel = new ScriptLoader();
babel.AddUrl("https://unpkg.com/babel-standalone@6/babel.min.js");
babel.AddUrl("https://unpkg.com/babel-polyfill@6/dist/polyfill.min.js");
var babelRepository = babel.GetRepository();
babelRepository.AddAssetResource("ArrayConverter.js"); // function convertToJsArray(host)
babelRepository.AddAssetResource("JSX.js"); // function transformCode(code, url), function transformCode__2()
using (var babelPool = new JsEnginePool(babelRepository))
using (var e = babelPool.Engine)
{
var compiled = e.Evaluate("transformCode", JSX);
Console.WriteLine(compiled);
}
/* For JSX see https://gist.github.com/zpao/7f3f2063c3c2a39132e3 , https://github.com/babel/babel-standalone
* and https://github.com/facebook/react/issues/5497
* all these use babel-standalone and even the babl REPL Website https://babeljs.io/repl
* so we do too.
* We need the function transformCode(code, url) from the gist as well as the var babelOpts, see below
*/
var c = "\"use strict\"; var HelloWorld = React.createClass({ displayName: \"HelloWorld\", render: function render() { return React.createElement(\"div\", null, \"Hello \", this.props.name, \"!\"); } }); ";
var sl = new ScriptLoader();
sl.AddUrl("https://unpkg.com/react@15/dist/react.min.js");
sl.AddUrl("https://unpkg.com/react-dom@15/dist/react-dom.min.js");
sl.AddUrl("https://unpkg.com/react-dom@15/dist/react-dom-server.min.js");
var repository = sl.GetRepository();
repository.AddAssetResource("ArrayConverter.js"); // function convertToJsArray(host)
repository.AddScriptContent("var sm = 3; var square = ( a => a*a );", "Test");
repository.AddScriptContent(c, "HelloWorld");
using (var pool = new JsEnginePool(repository))
{
int n = 10;
var cd = new CountdownEvent(n);
ThreadPool.SetMinThreads(8, 200);
for (var i = 0; i < n; i++)
{
var ii = i;
ThreadPool.QueueUserWorkItem(
(o) =>
{
using (var e = pool.Engine)
{
e.Calc2(ii);
}
cd.Signal();
}, null);
}
cd.Wait();
Console.WriteLine("completed");
}
}
/// <summary>
/// Create a runtime with a static prefabricated <see cref="JsEnginePool"/>.
/// This is a low level method to create a runtime e.g. without loading ReactJS and/or Babel.
/// Runtimes created with this constructor can't be refreshed inline.
/// </summary>
/// <param name="reactPool">A <see cref="JsEnginePool"/> that can run ReactDOMServer methods, has ReactJS classes and our JS function PrepareReact/2.</param>
public ReactRuntime(JsEnginePool reactPool)
{
Contract.Assert(reactPool != null, nameof(reactPool) + " is null.");
_ReactPool = reactPool;
Configure = null;
}
