Question

I want to build a website using derbyjs. The website has articles.

Every article has title (short text) and text (a lot of text) fields.

Page /articles is a page where I can see titles of all articles.

Clicking on article opens /articles/<article_id> where I can see the text of the clicked article.

In usual server-side framework the client would get only html. It's nice and simple. But in derby, as I understand, we get data and html separately and then pushing data to html on client.

So, my questions:

1) How to make /articles load only titles, but not texts of articles? (in other words, load only data we need for the current page and no more)

2) When I click on some article, html changes immediately, right? But text of the clicked article loads not immediately (because it was not loaded before). So what should client see? Blank page which will be filled with text, when data for the article will be loaded?

Was it helpful?

Solution

1) Because of implementation of ShareJS at the moment there is only possible to subscribe(fetch) at minimum to the whole document. It means that you can not get from server just title of the article. Workarounds:

  • You can make method in Express router, which would return list of id + title. And you can make XMLHttpRequest request from client (as usual) to get it and put to client model.
  • You can split collections. First for titles, second for texts
  • Maybe there are more

2) In this example html will start render only after article is loaded to client:

app.get('/articles/:id', function(page, model, params, next) {
  // let's load the article
  model.subscribe('/articles/' + params.id, function(err) {
    // article is loaded now let's start to render html
    page.render('article');
  });
});

In this example html will start render before article is loaded, and after article is loaded html will be filled with data (if you use {} and not {{}} in template):

app.get('/articles/:id', function(page, model, params, next) {
  // let's load the article
  model.subscribe('/articles/' + params.id, function(err) {
    // article is loaded and html is filled with data
  });
  // Still no article, let's render page without data
  page.render('article');
});
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top