我正在ASP中构建一个应用程序。. NET MVC和考虑使用backbone.js进行客户端交互等。
理想情况下，当页面加载时，我希望有所有现有的内容在服务器端预渲染，然后由backbone.js渲染的任何新内容。
当然，我真的不想写我的模板两次。
我正在考虑使用razor视图引擎对大部分应用程序进行模板化，然后对需要在服务器和前端之间共享的小区域使用mustache模板。
我的问题是，它的实际技术实现是什么样子的?
您能提供如何实现这一点的代码示例吗?
例如，您将使用哪个库在服务器上呈现模板，然后您将手动从模板文件中提取文本并将其注入javascript?
与其说是技术性的，不如说是功能性的，请看我在这里给出的包含服务器端和客户端呈现(使用Mustache)的功能流的答案
无障碍和所有这些JavaScript框架
hth,
目前我正在评估Razor客户端模板(GitHub)。它的版本是0.7.0，目前看起来有点脆弱。
它允许你引用单独的部分剃刀视图作为JavaScript模板。
作为商业产品的一部分，我们将进一步从我们的Razor部分输出Handlebars.js兼容的模板。
如果你想要一个restful MVC应用程序，我推荐ServiceStack。有一个后台服务栈，你可以在上面查看源代码。
我做了类似的事情(不使用mustache)，其中控制器将模型输出为json供骨干使用。
你有没有考虑过jQuery模板，在我们的项目中我们使用了它们，我发现它们非常有用。我们实际上使用了这个http://github.com/BorisMoore/jsviews，这是一个稍微优化版本的jquery模板渲染字符串。这里有很多demo。在服务器端，我们将所有模板放在一个局部视图中并渲染它。
首先，我们选择在MVC.net和WebApi中嵌入v8，并实现带有下划线或小胡子的模板，以保持完全相同的模板。
即使你有相同的模板，呈现逻辑也可能不同，你需要不断地重构模板、前端视图和后端视图。特别是当你在做restful api时。
我们最终选择了另一种解决方案，使用无头浏览器(PhantomJs)来呈现页面，为可访问性和seo需求提供非javascript替代方案。
这很容易实现，你需要在你的服务器上安装PhantomJs，添加一个javascript来完全渲染所有javascript交互的页面，并提供html输出。
您可以在这里找到一个使用示例:http://backbonetutorials.com/seo-for-single-page-apps/
这个例子是针对node.js的，但是用ASP
实现它很容易我们使用的幻影脚本是类似的:
//phantom-server.js
var page = require('webpage').create();
var system = require('system');
var lastReceived = new Date().getTime();
var requestCount = 0;
var responseCount = 0;
var requestIds = [];
var startTime = new Date().getTime();
page.onResourceReceived = function (response) {
if(requestIds.indexOf(response.id) !== -1) {
lastReceived = new Date().getTime();
responseCount++;
requestIds[requestIds.indexOf(response.id)] = null;
}
};
page.onResourceRequested = function (request) {
if(requestIds.indexOf(request.id) === -1) {
requestIds.push(request.id);
requestCount++;
}
};
// Open the page
page.open(system.args[1], function () {});
var checkComplete = function () {
// We don't allow it to take longer than 5 seconds but
// don't return until all requests are finished
if((new Date().getTime() - lastReceived > 300 && requestCount === responseCount) || new Date().getTime() - startTime > 5000) {
clearInterval(checkCompleteInterval);
console.log(page.content);
phantom.exit();
}
}
// Let us check to see if the page is finished rendering
var checkCompleteInterval = setInterval(checkComplete, 1);
也有提供相同结果的服务:http://prerender.io/