Is re-executing the render function locally a good practice?

[danielo515]

While using hyperhtml I found myself following this pattern:

function ParentComponent(){
   return bind(domNode)`
    <div>
        ${ChildComponent({ data })
    </div>
   `
}

function ChildComponent({ data }){
   wire(data, ':child-component')`
    <div>
        ${ data.map(Stuff) }
        ${Button({ onClick: () => ChildComponent({ data }) })
    </div>
   `

So, the child-component has the ability to render itself by calling the function with the same data, and if something within the data has changed it will re-render that parts. Not all components pass something to wire, some just do dumb wires, but some others do.
This is working flawlessly, and my understanding is that, as long as I pass the proper reference objects + id I will not get 'reference clashes' (it happened to me once, and it was very weird because I was using the same reference object for two components).
Is this some kind of anti-pattern? or is it OK on the hyperhtml world?

Thanks in advance.

[WebReflection]

differently from uhtml and lighterhtml, hyperHTML doesn't have a stack concept in core, meaning same reference object, with same ID, in two places, will simply move the same node in the last place that used such reference.

However, what I see here is a replica of what uland or neverland do, meaning there's nothing inherently wrong with your pattern, but hyperHTML has its own component system which, if not used, is sleeping code with no meaning, while those other libraries are born to provide this very same patern, and likely better at that, without you ever needing to reference explicitly anything.

I hope this answer helps 👋

[danielo515]

Yes @WebReflection , it helps. I'll take a look into neverland then. I started using hyperHtml and I was wondering when would I should switch to one of the smaller alternatives. Probably the time is now.

[WebReflection]

P.S. for an "as close as React" solution, I suggest checking kaboobie out too 👍

[danielo515]

thanks for the suggestion, but being as close to react as possible is not a requirement for me 😄