-
Notifications
You must be signed in to change notification settings - Fork 79
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
in patchElement, nextNode === lastNode is never true. #148
Comments
@rbiggs If your view function is memoized out some input (e.g., some props of the state), calling the function will not return a new object, but a reference to the last node object. In this scenario Here is a very crude example: let cachedRows = []
const RowsView = ({ state, actions }) => {
return state.rowData.map(({ id, label }, i) => {
cachedRows[i] = cachedRows[i] || {}
if (cachedRows[i].id === id && cachedRows[i].label === label) {
return cachedRows[i].view
}
const view = (
<tr key={id}>
<td>{id}</td>
<td>
<a onclick={actions.select(id)}>{label}</a>
</td>
<td>
<a onclick={actions.delete(id)}>
<span class="icon-remove" />
</a>
</td>
</tr>
)
cachedRows[i].id = id
cachedRows[i].label = label
cachedRows[i].view = view
return view
})
} |
There are no memoization out of the box, it could be slow if apply it to each node. It is up to you how to implement memoization and where to add it because it depends on the particular application. |
I'll introduce a new feature referred to as "lazy lists" or just lazy in Hyperapp (and maybe Superfine too) that will help automate some of the chore of doing this. Note this feature is heavily borrowed from Elm's Html.Lazy. |
Thank you, @frenzzy. That was faster than me! 🏄 |
nextNode === lastNode
inpatchElement
(line 275) to determine if these are equal will always be false. The reason--they are never equal even when the data is the same. This is because of howpatchElement
attaches elements to thevnode
before returning it.If you log out their values like this:
You'll see that these are never equal, even when rendering with the same data again and again. This means that
patchElement
has to parse them even when it will result in no change to the DOM. Seems inefficient. Not sure how this affects performance.===
since this will always return false. That would only work for primitive types like boolean, number, string. The best way to test for equality between two objects is to loop over their properties and compare those. That's a bit convoluted. A simpler way is to stringify the objects and compare the results, but that's also not foolproof due to child objects getting converted to[object Object]
.So, is that line necessary or not?
The text was updated successfully, but these errors were encountered: