性能优化|轮询日志,日志量很大时渲染耗的性能比较多

53 阅读1分钟

轮询接口查询实时日志,日志量很大又想看到全部日志时渲染耗的性能比较多,造成页面甚至浏览器、电脑卡顿,怎么优化?

策略一、虚拟滚动 元素是动态高度时用DynamicScroller,注意元素要是对象格式。

<DynamicScroller ref="scroller" class="scroller" :items="filteredItems" :min-item-size="32" :max-items="10000" :emit-update="true" > <template v-slot="{ item, index, active }"> <DynamicScrollerItem :item="item" :data-index="index" :active="active" :size-dependencies="[ item.content ]" class="scroller-item" > <p v-html="item.content"></p> </DynamicScrollerItem> </template> </DynamicScroller>