From 9eae4d07c1e82cadc5cf2c6c057c795d3e2a28f9 Mon Sep 17 00:00:00 2001 From: Shpuld Shpuldson Date: Wed, 15 Jan 2020 15:17:05 +0200 Subject: [PATCH] add custom solution for virtual scrolling to ease ram and cpu use when scrolling for a long time --- src/components/conversation/conversation.js | 15 ++++++-- src/components/conversation/conversation.vue | 4 +- src/components/status/status.js | 5 ++- src/components/timeline/timeline.js | 39 +++++++++++++++++++- src/components/timeline/timeline.vue | 3 +- 5 files changed, 57 insertions(+), 9 deletions(-) diff --git a/src/components/conversation/conversation.js b/src/components/conversation/conversation.js index 08283fff..ad92a839 100644 --- a/src/components/conversation/conversation.js +++ b/src/components/conversation/conversation.js @@ -35,7 +35,8 @@ const conversation = { data () { return { highlight: null, - expanded: false + expanded: false, + height: '115px' } }, props: [ @@ -44,7 +45,8 @@ const conversation = { 'isPage', 'pinnedStatusIdsObject', 'inProfile', - 'profileUserId' + 'profileUserId', + 'hidden' ], created () { if (this.isPage) { @@ -102,6 +104,9 @@ const conversation = { }, isExpanded () { return this.expanded || this.isPage + }, + hiderStyle () { + return this.hidden ? { height: this.height } : {} } }, components: { @@ -112,7 +117,7 @@ const conversation = { const newConversationId = this.getConversationId(newVal) const oldConversationId = this.getConversationId(oldVal) if (newConversationId && oldConversationId && newConversationId === oldConversationId) { - this.setHighlight(this.originalStatusId) + this.setHighheightlight(this.originalStatusId) } else { this.fetchConversation() } @@ -121,6 +126,10 @@ const conversation = { if (value) { this.fetchConversation() } + }, + hidden (value) { + this.height = `${this.$el.clientHeight}px` + console.log('Element height:', this.height) } }, methods: { diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue index 2e48240a..ed06a32b 100644 --- a/src/components/conversation/conversation.vue +++ b/src/components/conversation/conversation.vue @@ -1,10 +1,11 @@