Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

does hyperapp's virtual dom support keyed children? #132

Closed
yelouafi opened this issue Mar 6, 2017 · 8 comments
Closed

does hyperapp's virtual dom support keyed children? #132

yelouafi opened this issue Mar 6, 2017 · 8 comments

Comments

@yelouafi
Copy link

yelouafi commented Mar 6, 2017

Looked at the source (https://github.com/hyperapp/hyperapp/blob/master/src/app.js#L280-L284) and it seems like element's children are only patched by position.

@liadbiz
Copy link

liadbiz commented Mar 6, 2017

@yelouafi yeah, not supported yet...
see also #129

@jorgebucaran
Copy link
Owner

jorgebucaran commented Mar 6, 2017

@yelouafi Correct. I am not sure I can keep the 1kb promise if we implement keyed children too.

On the other hand, hyperapp 0.7.0 already performs "better" than React; this is a local run of js-framework-benchmarks up to date for 0.7.0.

screen shot 2017-03-06 at 21 32 21

All virtual DOM engines are basically fast.

Related:

@zaceno
Copy link
Contributor

zaceno commented Mar 6, 2017

This PR is not to support keyed children, but goes a bit of the way to solve the same problem:

#135

Specifically, it frees you a little from the positional-only updating of dom nodes, by letting you specify some elements that should be inserted, rather than replacing an existing dom node (in a potentially long chain of unnecessary dom operations)

@zaceno
Copy link
Contributor

zaceno commented Mar 6, 2017

@jbucaran: gotta ask about the benchmark table: how did you make that (a tool I could download, or did you put it together yourself?) I thought it would be interesting to check the performance effects of using the _insert flag of PR 135.

@leeoniya
Copy link

leeoniya commented Mar 6, 2017

@zaceno
Copy link
Contributor

zaceno commented Mar 7, 2017

Thanks @leeoniya!

@yelouafi
Copy link
Author

yelouafi commented Mar 7, 2017

@jbucaran
It's more about preserving identity. This can be an issue when you have state in the real DOM that's not in sync with virtual DOM (eg user input, focus, scroll position, animation ...). When you replace that node with a new one all that state goes away (which can lead to undesirable UI effects). Keys prevent this by letting the lib track when old stateful nodes has moved elsewhere.

@leeoniya leeoniya mentioned this issue Mar 7, 2017
@jorgebucaran
Copy link
Owner

Closing in favor of #141 🔥

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

5 participants