From fe5244dab81d72a049532504dde6438bc892e02b Mon Sep 17 00:00:00 2001
From: sairaj mote <sairajmote3@gmail.com>
Date: Wed, 1 Sep 2021 15:17:45 +0530
Subject: [PATCH] graph rendering optimization

---
 index.html | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/index.html b/index.html
index 6b5011a..57625b5 100644
--- a/index.html
+++ b/index.html
@@ -630,10 +630,6 @@
                     case 'dashboard': 
                         renderRecentTransactions()
                         refreshBalance()
-                        if(accountChart){
-                            accountChart.destroy()
-                        }
-                        accountChart = renderChart()
                     break;
                     case 'notifications': 
                         if(pagesData.openedSubPages.includes(subPageId)){
@@ -1030,6 +1026,15 @@
             });
         }
 
+        const chartObserver = new IntersectionObserver(entries => {
+            entries.forEach(entry => {
+                if(entry.isIntersecting){
+                    accountChart = renderChart()
+                }else if(!entry.isIntersecting && accountChart){
+                    accountChart.destroy()
+                }
+            })
+        })
     </script>
     <script id="onLoadStartUp">
         const requestResponsePairs = {}
@@ -1053,6 +1058,7 @@
                 bank_app.launchApp(DummyCallBack, DummyCallBack)
                 .then(result => {
                     console.log(result)
+                    chartObserver.observe(getRef('account_chart_container'))
                     // create pairs of requestIDs and their respective responses for efficient lookup
                     const allResponses =  bank_app.viewAllResponses()
                     for(const key in allResponses){