-
Notifications
You must be signed in to change notification settings - Fork 341
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Provide a tool for pre-compiling templates #30
Comments
Yes, that could be a good idea, but it will probably need to wait until v1.0 has shipped. |
Is the compiled template available somewhere? In Rhino, you could do something like this: // Load jsrender
load( "jsrender.js" );
// Read template file
var template = readFile( "myTemplate.jsrender" );
// Compile template
jsviews.templates( "myTemplate", template );
// Access compiled template
var myCompiledTemplate = ; // ???
// Write compiled template to file
serialize( myCompiledTemplate, "myCompiledTemplate.js" ); |
There are are few samples showing different ways of accessing template objects (compiled templates) - depending on whether the template was compiled from a string, or a script block, etc. - under this folder: https://github.com/BorisMoore/jsrender/tree/master/demos/variants. Live demos here: https://github.com/BorisMoore/jsrender/tree/master/demos/variants. The simplest is approach is Then you can call the render method of the templateObject. |
I was a bit hasty with my previous example, but having said that this should work for anyone who is interested: // Load jsrender
load( "jsrender.js" );
var
// Read template file
template = readFile( arguments[ 0 ] ),
// Compile template
compiled = jsviews.templates( template ),
// Uneval compiled template to string
code = uneval( compiled ),
// Create file for compiled template code
out = new java.io.FileWriter( arguments[ 1 ] );
out.write( code, 0, code.length );
out.flush();
out.close();
quit(); Assuming you name this code
|
Even with my updated example, there are a couple changes that need to happen for the code to run. There are references to variables that no longer exist within
If those references were updated, this issue would be one step closer to a resolution. The only other munging I've had to do deals with quirks in Rhino that someone using Node would not have. |
@jeffrose: I just made a related comment on Issue 143. Basically, you should be able to put Also, I notice I missed your question above: // Access compiled template
var myCompiledTemplate = ; // ??? But you figured that |
@BorisMoore I am trying to avoid tying our use of JsRender to jQuery. That being said, I notice you're setting a It looks |
@jeffrose: RenderContent is used as the render method on any template, and also the renderContent of any registered tag, such as {{if}}. So you can get it from |
With the latest release of Chrome for windows, they are forcing manifiest version 2 now, which means template pre-compilation is needed (barring use of an iframe, and use of a sandbox) |
Not been able to get to this yet. Sorry, but I think it won't be something I can work out until after completing the current phase of significant updates to JsViews, heading for beta... But I will come back to it... I have some ideas around how to do it, and I agree that it is important. |
You can totally use jsRender to do templates in Node...I've been doing it using just one simple trick; instead of running it as is, declare an empty object and shim it in jsRender's anonymous function like so; var jsR = {}; Now you can render templates in Node with this awesome library all night long var msg = {"greeting" : "helloworld"} jsR.jsviews.templates({ console.log( jsR.jsviews.render.exampleTemplate( msg ) ) //logs: span helloworld /span Now you get to use jsRender in Node. game, set, match...if there is really enough demand, I would be happy to try and set this up as an npm package or something so you can just require() and shoot, let me know. |
Planned for V1 or V1.1. See also #164 |
+1 on this. I did a little lesscss and handlebars compiler (http://britesnow.com/html5/jcruncher) and would be happy to add jsrender support. Also, we would need a jsrender-runtime.js, very small, with just the "runtime" similar to handlebars-...runtime...js. (handlebars runtime is 3KB). |
Yes, sounds like a great plan... |
I think this would also be helpful for using jsRender with the Twitter https://github.com/twitter/typeahead.js/ plugin. It requires a precompiled template ("template" property) and a templating "engine" (see ENGINE below). I would love to use JsRender for this - but I might need to use Hogan in parallel since I can't figure out how to get the jsRender templating engine to work with this. Template Engine Compatibility Any template engine will work with typeahead.js as long as it adheres to the following API: // engine has a compile function that returns a compiled template // compiled template has a render function that returns the rendered template Check out Hogan.js if you're looking for a compatible mustache templating engine. |
@gtwilliams03: Can you simply wrap jsrender:
The template already has a render method... ADDED LATER In fact, (see http://stackoverflow.com/questions/25237610/how-to-use-twitter-typehead-js-with-jsrender-compile-function), because the templates() method works has no dependency on its context (this pointer), this can be done even more simply:
Or you can even extend
Yet another alternative would be not to set the engine, but to use a suggestion template as in https://twitter.github.io/typeahead.js/examples/#custom-templates:
|
Boris: Simple and elegant - just like your whole jsRender system. It worked like a charm and now I am using jsRender with the Twitter typehead.js plugin. |
@gtwilliams03: @mikmarkify I added some updated approaches to using JsRender with Twitter typehead, above. |
@BorisMoore Thank you for your endless efforts to help us all out! I am copying in a sample of what I am using with Twitter typeahead.js which has worked very will and implements jsRender directly (I tried to slim down lots of stuff that was specific to my project to make this a pretty generic example): [This code updated by BorisMoore based on discussion below] var jsRender = {
compile: $.templates
};
$("#txtTypeahead").typeahead({
limit: 15,
remote: {
url: "/Home/Lookup?term=%QUERY",
maxParallelRequests: 2,
beforeSend: function (jqXhr, settings)
{
var temp = String($("#txtTypeahead").val());
if (temp.length > 3)
{
$("#txtTypeahead").addClass("LoadingBackground");
return true;
} else
{
return false;
}
},
complete: function ()
{
},
filter: function (data)
{
$("#txtTypeahead").removeClass("LoadingBackground");
// filter the returned data
var ret = [];
if (data != null && data.length > 0)
{
for (var i = 0; i <= data.length - 1; i++)
{
var item = data[i];
ret.push({
value: item.Matter,
data: [item.Matter, item.Title],
hasData: item.Matter != null || item.Title != null
});
}
} else
{
ret.push({ value: "", data: [], hasData: false });
}
return ret;
},
cache: true,
},
template:
"<div style=\"font-weight:bold\">"
+ "{{if hasData}}{{:value}}{{else}}No records located.{{/if}}"
+ "</div>",
engine: jsRender
}); |
@gtwilliams03: Thanks. What is your
Is that what you have? BTW (FWIW) you could also write:
or
|
@BorisMoore Here is what I had in my project: var jsRender = {
compile: function (template) { return $.templates(template); }
}; And thank you for the simplified template format! (Of course, I should have known that...) |
@BorisMoore I changed the statement above to your suggestion, and it worked just fine: var jsRender = {
compile: $.templates
}; |
Great thanks - I updated the code in your comment higher up to include those changes - so folks don't need to read the whole thread... |
Browserify transform and {{clientTemplate}} support and full Node JsRender support are now available. JsRender is now available natively as a Node module. See https://www.npmjs.com/package/jsrender and https://github.com/BorisMoore/jsrender-node-starter |
Is it possible to make a tool available for precompiling templates (using node, for instance)?
This could be integrated in an assets builder setup or using tools like Guard.
I'm hoping this could improve performance under production.
Thanks for considering the idea.
The text was updated successfully, but these errors were encountered: