[airflow] branch memoize-dag-run-bar created (now e650f75)

[bb...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

bbovenzi pushed a change to branch memoize-dag-run-bar
in repository https://gitbox.apache.org/repos/asf/airflow.git.


      at e650f75  Reduce rerendering of component

This branch includes the following new commits:

     new e650f75  Reduce rerendering of component

The 1 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails.  The revisions
listed as "add" were already present in the repository and have only
been added to this reference.

[airflow] 01/01: Reduce rerendering of component

[bb...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

bbovenzi pushed a commit to branch memoize-dag-run-bar
in repository https://gitbox.apache.org/repos/asf/airflow.git

commit e650f75a63e165b357a382bceae75660035b81d3
Author: Brent Bovenzi <br...@gmail.com>
AuthorDate: Thu Mar 10 14:02:54 2022 -0500

    Reduce rerendering of component
    
    Memoize component with a custom compare function to reduce rerenders
---
 airflow/www/static/js/tree/dagRuns/Bar.jsx | 15 ++++++++++++++-
 1 file changed, 14 insertions(+), 1 deletion(-)

diff --git a/airflow/www/static/js/tree/dagRuns/Bar.jsx b/airflow/www/static/js/tree/dagRuns/Bar.jsx
index a0fa5b1..21f99a3 100644
--- a/airflow/www/static/js/tree/dagRuns/Bar.jsx
+++ b/airflow/www/static/js/tree/dagRuns/Bar.jsx
@@ -109,4 +109,17 @@ const DagRunBar = ({
   );
 };
 
-export default DagRunBar;
+// The default equality function is a shallow comparison and json objects will return false
+// This custom compare function allows us to do a deeper comparison
+const compareProps = (
+  prevProps,
+  nextProps,
+) => (
+  JSON.stringify(prevProps.run) === JSON.stringify(nextProps.run)
+  && prevProps.max === nextProps.max
+  && prevProps.index === nextProps.index
+  && prevProps.totalRuns === nextProps.totalRuns
+  && prevProps.containerRef === nextProps.containerRef
+);
+
+export default React.memo(DagRunBar, compareProps);