Usage as pure-ish component

[timwis]

Hey @tbranyen, I just tweeted you but thought it might be better to chat here so other watchers of the lib can participate in the convo if interested.

I'd like to use hyperlist inside of a choo app, which uses bel/yo-yo to construct elements and - more importantly - nanomorph/morphdom to diff the DOM. It allows you to write pure render functions that take arguments and return an element, similar to react but without JSX and virtualdom, and without the need for classes.

So ideally you'd be able to run hyperlist repeatedly, passing it data, and always get back the same element. @yoshuawuyts created nanocomponent to wrap libraries like this. A main advantage of nanocomponent is that it leverages proxy nodes (better explained in this alternate library's readme).

I've wrapped hyperlist in nanocomponent and posted it as hyperlist-component, but I wanted to open the discussion here to see if (a) it makes sense to have it as a separate library, as opposed to making some changes upstream, and (b) if so, get your thoughts on its API.

[tbranyen]

Hi @timwis sorry it took me so long to respond, but I had this comment in my mind. Looks like you're asking for a way to improve this code area? So you can simplify it to something like the following?

return HyperList.create(container, opts).element;

Right now the element is assigned to a protected property called _element, and is only assigned when refresh is called. I could attach this as a public property element and I think that'd solve what you're asking?

[tbranyen]

When I wrote the previous comment it looks like I forgot to address the second part (the important part), which is the purity question. Doing the above repeatedly using create will most likely not work correctly. So we'd need to figure out a way to avoid needing to bounce between create and refresh.

[soyuka]

Maybe something like this?

var hyperlist = new HyperList(container, opts)

render(state) {
  return hyperlist.render(data) //returns container with correct nodes, it's like _renderChunk() here
}

I think it should be different then refresh (which is able to re compute heights). Still if we want to change the data-sets we might want to re-compute heights :/.