Dealing with reference comparing - Using resources as component props and in dependency arrays

[joepio]

In the template, I'm currently using a key attribute / property in the App.tsx component, because if I don't the component will not properly update after a resource is loaded. I think this is because React checks if the reference of the object is the same, instead of doing a deep comparison of the object values - and will notice that it is exactly the same as before.

solutions

Use store.subscribe to keep track of usage for each value

• Seems very expensive

Create a new Object (thus, a new reference) when updating a Resource

• Add a .clone() function to resource, call that in store.addResource().