在页面加载时将服务器端HTML转换为Javascript MVC的最佳方法是什么？

Question

我正在尝试构建一个快速而肮脏的Javascript库，使它非常容易与初始服务器生成的HTML页面一起工作，然后在Javascript中执行进一步的操作。

我的问题是大多数Javascript MVC解决方案在那里，框架和模式，依赖于从服务器返回的HTML中分离数据。这里的论点是，这对于构建和构建一个完整的web应用程序更有效。

然而，它们减慢了页面加载速度，使搜索引擎和其他非javascript客户端无法使用您的网站。

而不是找出一种在服务器端运行JS来预生成页面的方法，我想用让JS在页面加载时读取DOM并由此创建其初始对象状态。

我正在使用Django，我的计划是制作在Jinja和稍微修改的Handlebars版本中都能工作的模板。

这样我可以在服务器端和JS中使用相同的代码呈现模板。我在这里唯一缺少的部分是如何使它使JS可以在页面加载时构建它的对象表示。

这是我现在对模板的想法:

<div class="post" js-model="post.id" js-value="{{ id }}">
    <div class="post-header">
        <span js-model="post.author.username" js-value="{{ author.username }}">
            {{ author.username }}
        </span>
        <img src="{{ author.avatar }}" js-model="post.author.avatar" js-value="{{ author-avatar }}">
    </div>
    <p js-model="post.content" js-value="{{ content }}">
        {{ content }}
    </p>
    <div js-model="post.date" js-value="{{ date }}" class="post-footer">
        {{ date }}
    </div>
</div>

我的Javascript将读取这个并生成这个对象的内部表示。

我可能想得太多了，用Angular做点什么可能会更好，但我希望得到一些反馈，看看别人是怎么想的。

Answer 1

最近确实有很多人在思考这些问题。

AirBnB的人想出了Rendr

Artsy想出了Ezel

他们都不成熟，他们都可以从更多的思想贡献中受益。

而且，两者都使用Backbone和Node可能不是巧合。与Backbone相比，在服务器上使用像Angular或Ember这样的框架可能会非常困难。如果你要在服务器上用JS渲染，使用JS服务器会更有意义。

Answer 2

Angular是一个很好的选择，它肯定会让你的生活更轻松(在我看来)。

如果你需要让你的页面成为爬虫，你必须使用像PhantomJS这样的东西来构建你的"页面"快照供爬虫使用。

这里有一个angular模块来帮助你:https://github.com/steeve/angular-seo

关于AJAX应用程序和爬虫的更多信息:https://developers.google.com/webmasters/ajax-crawling/