Hacker News Reader

Comment by aviraldg | Hacker News Reader

Related query: I've just started with some JS MVVM frameworks, and I was wondering if any of them can "reverse bind" ie. enable you to render part of your templates on the server and utilise data from that based on a template to recreate models. The idea is to make the initial load snappy and to help with SEO (only one or two web crawlers actually execute JS afaik)

View on HN

If there is a particular data model that you want, there's no shame in just passing it directly inside the container of the view. Given a Handlebars template on the server like:

    <div class="profile-widget" {{#if serverEnv}}data-model="{{jsonStringify profileModel}}"{{/if}}>
        <span class="name">{{name}}</span>
        <span class="phone">{{phone}}</span>
    </div>

They can share the same template with some minor conditional statements. The JavaScript could simply load any model(s) required from the JSON in the data attribute and re-render the view in "enhanced mode".

It comes in handy for progressive enhancement.

DerbyJS, Metor, or you can extend Backbone Views to read a model from the DOM on initialization if the model is empty (granted you'd have to custom code the DOM-reading parts for each model that you plan on loading this way)

Airbnb is working on something similar as well using Node+Backbone but it's not available yet. They said they're planning on open sourcing it eventually but we'll have to wait a few months. http://nerds.airbnb.com/weve-launched-our-first-nodejs-app-t...

I believe almost all of them have this capability. I know angular has templates and you can put dynamic data in those templates. The dynamic data can be loaded from anywhere. I'm not aware of any MVVM that doesn't allow you to do this, unless I misunderstand what you are saying.

I guess I wasn't clear enough.

You're talking about data -> template binding. I'm talking about the reverse, where some data (as a model) is recovered from a partial server-side render of the page, based upon the "patterns" described in the templates.

For example, if Angular did this (I don't think it does), it could traverse the generated HTML and compare it with the original template to figure out what's what.

I haven't explored what your describing, but I'm using a different solution. I'm adding backbone to an existing project and added some server side code that outputs the current model object as json in a <script> tag in the html page. This is passed to a new backbone model instance.

You can pass the initial data as a json object directly with the server response.

I'm using Rails, and https://github.com/gazay/gon gem does it for you nicely.

Reply on news.ycombinator.com