Now the whole app is a lot faster. I optimized the code in several places where components were getting re-rendered unnecessarily.
An important change to note is that the top-level "app-component" is now the only one allowed to deref @app. It derefs it once, then passes various pieces of the app state down to all the sub-components. A cool feature of reagent is that when it goes to re-render sub-components, it will check to see if the inputs to the components have actually changed. If not, they will not be re-rendered. So with this new strategy of managing the app state, that means that the sub components will only be re-rendered if and only if the relevant pieces of the app state have been changed. e.g. the buttons won't get re-rendered every time I check a checkbox. Previously, almost the entire app was getting re-rendered every time any part of the state changed.
After I fixed that, I was able to optimize certain other parts, such as the table. Now each individual row of the table is only re-rendered when its stat is actually changed. Also, each item component (in the lower right) is only re-rendered when that particular item is changed in the item-set.
Now the whole app is a lot faster. I optimized the code in several places where components were getting re-rendered unnecessarily.
An important change to note is that the top-level "app-component" is now the only one allowed to deref
@app
. It derefs it once, then passes various pieces of the app state down to all the sub-components. A cool feature of reagent is that when it goes to re-render sub-components, it will check to see if the inputs to the components have actually changed. If not, they will not be re-rendered. So with this new strategy of managing the app state, that means that the sub components will only be re-rendered if and only if the relevant pieces of the app state have been changed. e.g. the buttons won't get re-rendered every time I check a checkbox. Previously, almost the entire app was getting re-rendered every time any part of the state changed.After I fixed that, I was able to optimize certain other parts, such as the table. Now each individual row of the table is only re-rendered when its stat is actually changed. Also, each item component (in the lower right) is only re-rendered when that particular item is changed in the item-set.