What is "declarative data loading" in relation to Falcor, GraphQL and Resolver?

Question

I was reading Redux Without Profanity and the author says the following:

The trend towards declarative data loading favours this model, mainly as this is easier to work with. Newer React frameworks such as Falcor, GraphQL and Resolver also batch and dedupe requests automatically. It's also possible to implement using plain Redux actions combined with autoaction.

The author uses "declarative data loading" somewhat nonchalantly, so I assumed it must be a widely known and extremely obvious term. However I googled it and didn't find much. Unfortunately the author assume this to be obvious prior knowledge. Please help!

Could somebody provide a quick explanation and example juxtaposing "declarative data loading" and your average http/ajax dataloading from, say, a simple MEAN stack todo list?

Answer 1

The fundamental difference between declarative data loading and the http/ajax data loading is rooted in the difference between declarative and imperative programming. With declarative approach, you just mention what you need and that's all. On the othe hand, with imperative approach, you also need to tell the steps, i.e. how to get what you need.

Let's take a look at the following example of Relay's declarative data loading. It tells that for each faction, it wants these data: id, factionId, name, ships and also the data AddShipMutation wants for a faction. How the data are fetched is abstract.

fragments: {
  factions: () => Relay.QL`
    fragment on Faction @relay(plural: true) {
      id,
      factionId,
      name,
      ships(first: 10) {
        edges {
          node {
            id
            ${StarWarsShip.getFragment('ship')}
          }
        }
      }
      ${AddShipMutation.getFragment('faction')},
    }
  `,
},

For data loading with HTTP or AJAX, we have to specify how to get the data.

1. make a request
2. receive response
3. extract data from response
4. store the data

Hope this helps!