optimize: stop loading after followers/following page deactive

NaturalSelectionLabs · Oct 8, 2021 · e9b5d9d · e9b5d9d
1 parent 03b1193
commit e9b5d9d
Show file tree

Hide file tree

Showing 2 changed files with 50 additions and 28 deletions.
diff --git a/src/views/Followers.vue b/src/views/Followers.vue
@@ -70,6 +70,7 @@ export default class Followers extends Vue {
     rns: string = '';
     ethAddress: string = '';
     lastRoute: string = '';
+    isPageActive: boolean = false;
 
     async setupAddress() {
         const address = <string>this.$route.params.address;
@@ -92,23 +93,28 @@ export default class Followers extends Vue {
 
         if (rss3 && followersList) {
             for (const item of followersList) {
-                try {
-                    const profile = (await rss3.profile.get(item)) || {};
-                    this.followerList.push({
-                        avatar: profile.avatar?.[0] || config.defaultAvatar,
-                        username: profile.name || '',
-                        bio: profile.bio || '',
-                        address: item,
-                        displayAddress: this.filter(item),
-                        rns: '',
-                    });
-                } catch (e) {
-                    console.log(item, e);
-                }
+                this.followerList.push({
+                    avatar: config.defaultAvatar,
+                    username: '',
+                    bio: '',
+                    address: item,
+                    displayAddress: this.filter(item),
+                    rns: '',
+                });
             }
             setTimeout(async () => {
                 for (const item of this.followerList) {
-                    item.rns = (await RNSUtils.addr2Name(item.address)).replace(config.rns.suffix, '');
+                    if (this.isPageActive) {
+                        try {
+                            const profile = (await rss3.profile.get(item.address)) || {};
+                            item.avatar = profile.avatar?.[0] || config.defaultAvatar;
+                            item.username = profile.name || '';
+                            item.bio = profile.bio || '';
+                            item.rns = (await RNSUtils.addr2Name(item.address)).replace(config.rns.suffix, '');
+                        } catch (e) {
+                            console.log(item, e);
+                        }
+                    }
                 }
             });
         }
@@ -154,6 +160,7 @@ export default class Followers extends Vue {
     }
 
     async activated() {
+        this.isPageActive = true;
         await this.setupAddress();
         setTimeout(async () => {
             await this.setupTheme();
@@ -164,6 +171,10 @@ export default class Followers extends Vue {
             }
         }, 0);
     }
+
+    async deactivated() {
+        this.isPageActive = false;
+    }
 }
 </script>
 

diff --git a/src/views/Followings.vue b/src/views/Followings.vue
@@ -70,6 +70,7 @@ export default class Followings extends Vue {
     rns: string = '';
     ethAddress: string = '';
     lastRoute: string = '';
+    isPageActive: boolean = false;
 
     async setupAddress() {
         const address = <string>this.$route.params.address;
@@ -92,23 +93,28 @@ export default class Followings extends Vue {
 
         if (rss3 && followersList) {
             for (const item of followersList) {
-                try {
-                    const profile = await rss3.profile.get(item);
-                    this.followingList.push({
-                        avatar: profile?.avatar?.[0] || config.defaultAvatar,
-                        username: profile?.name || '',
-                        bio: profile.bio || '',
-                        address: item,
-                        displayAddress: this.filter(item),
-                        rns: '',
-                    });
-                } catch (e) {
-                    console.log(item, e);
-                }
+                this.followingList.push({
+                    avatar: config.defaultAvatar,
+                    username: '',
+                    bio: '',
+                    address: item,
+                    displayAddress: this.filter(item),
+                    rns: '',
+                });
             }
             setTimeout(async () => {
                 for (const item of this.followingList) {
-                    item.rns = (await RNSUtils.addr2Name(item.address)).replace(config.rns.suffix, '');
+                    if (this.isPageActive) {
+                        try {
+                            const profile = (await rss3.profile.get(item.address)) || {};
+                            item.avatar = profile.avatar?.[0] || config.defaultAvatar;
+                            item.username = profile.name || '';
+                            item.bio = profile.bio || '';
+                            item.rns = (await RNSUtils.addr2Name(item.address)).replace(config.rns.suffix, '');
+                        } catch (e) {
+                            console.log(item, e);
+                        }
+                    }
                 }
             });
         }
@@ -154,6 +160,7 @@ export default class Followings extends Vue {
     }
 
     async activated() {
+        this.isPageActive = true;
         await this.setupAddress();
         setTimeout(async () => {
             await this.setupTheme();
@@ -164,6 +171,10 @@ export default class Followings extends Vue {
             }
         }, 0);
     }
+
+    async deactivated() {
+        this.isPageActive = false;
+    }
 }
 </script>