热门标签 | HotTags
当前位置:  开发笔记 > 前端 > 正文

列表动态显示固定行数和使用虚拟dom,哪一种的性能提高更多?

项目中有一个非常大的列表,数据量达到1000行,而且30秒要更新一次数据,导致页面非常的卡。最近在使用vue做优化,使用上了鼎鼎大名的虚拟dom,但是现在出来的效果并不是特别的理想。列表

项目中有一个非常大的列表,数据量达到1000行,而且30秒要更新一次数据,导致页面非常的卡。
最近在使用vue做优化,使用上了鼎鼎大名的虚拟dom,但是现在出来的效果并不是特别的理想。列表在更新时确实会比较快,但是由于dom还是很大,所以其他的操作依旧很慢,特别是重绘时间非常的长。
于是又想到了,利用滚动事件,每次获取固定数量的数据做展示,但是发现因为滚动时一直在做dom更新,加上虚拟dom的对比函数,滚动的效率特别的差。
想问下大家,这两者,到底哪一个的优化性能是比较好的,或者有什么方法能够最大优化经常更新的又很大的列表。





   



推荐阅读
  • 本文介绍了在Vue项目中如何结合Element UI解决连续上传多张图片及图片编辑的问题。作者强调了在编码前要明确需求和所需要的结果,并详细描述了自己的代码实现过程。 ... [详细]
  • vue使用
    关键词: ... [详细]
  • 本文讨论了为什么在main.js中写import不会全局生效的问题,并提供了解决方案。在每一个vue文件中都需要写import语句才能使其生效,而在main.js中写import语句则不会全局生效。本文还介绍了使用Swal和sweetalert2库的示例。 ... [详细]
  • 1.点击查看隐藏当前按钮和这个内容,显示另一个内容能。 ... [详细]
  • Html5-Canvas实现简易的抽奖转盘效果
    本文介绍了如何使用Html5和Canvas标签来实现简易的抽奖转盘效果,同时使用了jQueryRotate.js旋转插件。文章中给出了主要的html和css代码,并展示了实现的基本效果。 ... [详细]
  • 本文介绍了如何按需加载elementui的部分模块,以及如何设置覆盖某些属性。通过import引入Dialog模块,并使用Vue.component进行全局设置。同时使用Vue.use引入ElementUI和VueAxios模块。通过extends进行属性覆盖设置。 ... [详细]
  • 本文介绍了在使用vue和webpack进行异步组件按需加载时可能出现的报错问题,并提供了解决方法。同时还解答了关于局部注册组件和v-if指令的相关问题。 ... [详细]
  • 单点登录(vue) 的实现及原理解析
    本文主要介绍了单点登录(vue) 的实现及原理解析。单点登录是指一个账号可以在多个系统中登录的功能,通过点击系统图标进入其他系统,无需重复登录流程。文章详细解释了如何获取返回的数据、前端如何处理token、后台如何实现登录功能以及重定向到前端页面的地址等流程。前端工作包括开发一个新页面来接收后台返回的地址并处理token。通过token进行通信,实现系统首页的重定向。 ... [详细]
  • 智能消息服务数字短信使用FAQ
    本文介绍了智能消息服务数字短信的开通流程和操作步骤,包括开通数字短信的路径、申请流程、控制台操作以及API接口对接模式。同时还介绍了数字短信模板的创建规则和要求,包括审核状态的说明和建议。 ... [详细]
  • 网络请求模块选择——axios框架的基本使用和封装
    本文介绍了选择网络请求模块axios的原因,以及axios框架的基本使用和封装方法。包括发送并发请求的演示,全局配置的设置,创建axios实例的方法,拦截器的使用,以及如何封装和请求响应劫持等内容。 ... [详细]
  • 本文记录了在vue cli 3.x中移除console的一些采坑经验,通过使用uglifyjs-webpack-plugin插件,在vue.config.js中进行相关配置,包括设置minimizer、UglifyJsPlugin和compress等参数,最终成功移除了console。同时,还包括了一些可能出现的报错情况和解决方法。 ... [详细]
  • 本文介绍了如何使用vue-awesome-swiper组件,包括在main.js中引入和使用swiper和swiperSlide组件,以及设置options和ref属性。同时还介绍了如何在模板中使用swiper和swiperSlide组件,并展示了如何通过循环渲染swipes数组中的数据,并使用picUrl属性显示图片。最后还介绍了如何添加分页器。 ... [详细]
  • 网址:https:vue.docschina.orgv2guideforms.html表单input绑定基础用法可以通过使用v-model指令,在 ... [详细]
  • uniapp开发H5解决跨域问题的两种代理方法
    本文介绍了uniapp开发H5解决跨域问题的两种代理方法,分别是在manifest.json文件和vue.config.js文件中设置代理。通过设置代理根域名和配置路径别名,可以实现H5页面的跨域访问。同时还介绍了如何开启内网穿透,让外网的人可以访问到本地调试的H5页面。 ... [详细]
  • VueCLI多页分目录打包的步骤记录
    本文介绍了使用VueCLI进行多页分目录打包的步骤,包括页面目录结构、安装依赖、获取Vue CLI需要的多页对象等内容。同时还提供了自定义不同模块页面标题的方法。 ... [详细]
author-avatar
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有