What if we would have tooling that makes it very easy to have decentralized data render in the frontend.

The following example has a lot LDflex and RDF specific syntax:

  await ebooks.preload('schema:name', 'schema:genre/schema:name')
  for await (const ebook of ebooks) {
    console.log(await ebook['schema:name'] + '')
   console.log(await ebook['schema:genre/schema:name'] + '')
    for await (const genre of ebook['schema:genre/schema:name']) {
      console.log('-- ' + await genre + '')
    }
  }

A prototype that has more syntax React developers are used to (I have this working in a proof of concept):

html`
      <ul class="ebooks">${ebooks.unfold(ebook => html`
        <li class="ebook">
          <h3 class="ebook-title">${ebook['schema:name']}</h3>

          <h4>Keywords</h4>
          <ul class="keywords">${ebook['schema:keywords'].unfold(keyword => html`
            <li>${keyword['schema:name']}</li>`)}
          </ul>

          <h4>Authors</h4>
          <ul class="authors">${ebook['schema:author'].unfold(author => html`
            <li>
              ${author['schema:name']}
            </li>`)}
          </ul>
        </li>`)}
      </ul>
  `

I am working on a prototype to use LDflex with uHTML. I made a LDflex handler 'unfold' that does next() on the async iterator and then calls a callback, and then calls next again and so on. The callback should have a render function in it. That way a list grows in small steps, render() gets called in between untill the list is fully populated.

In the background the preload() method is called. I am curious though how to return new pathData elements that are coming from the cache. A trick needs to be done with the paths to make the preloading trick work because in my proof of concept I have to rewrite the paths from ['schema:genre']['schema:name'] to ['schema:genre/schema:name'].

Talking about it, it would be helpful if we would have two new tools.

• A mapish handler that calls a throttled render after each new item, possibly with a pause method.
• A handler that abstracts away the preload call.

Here is a illustration for mapish handler:

Is there something like this on the road map? Possible for React?