当前位置: 首页 > news >正文

自助建站平台iis 没有右键网站属性

自助建站平台,iis 没有右键网站属性,天津市门户网站建设要求,兰州网站建设公司电话优化点解决方案效果双向绑定数量过多竞对设置单元格内部涉及双向绑定的输入组件过多,线上页面最多有88个该和抽屉中的编辑表格一样的组件,共计930个(按每行最少6个来计算的)双向绑定的组件,严重拖累页面性能。数据计算…

优化点

解决方案

效果

  1. 双向绑定数量过多

竞对设置单元格内部涉及双向绑定的输入组件过多,线上页面最多有88个该和抽屉中的编辑表格一样的组件,共计930+个(按每行最少6个来计算的)双向绑定的组件,严重拖累页面性能。

数据计算依据:88 = 竞对信息单元格数,930 = 155(编辑表格行数)*6(每行最低的双向绑定组件数)

问题截图

将竞对设置的编辑表格改为纯文本展示表格全局仅维护一个编辑表格,点击对应单元格的编辑按钮后,显示抽屉,将目标单元格数据带入编辑表格进行编辑操作,编辑完成后将修改后的数据同步到目标单元格对应的数据对象中。

通用的编辑表格组件数量由88个缩减到1个,双向绑定组件由930+个缩减到20个以内(线上数据每个编辑表格大概2-3行)

优化前

优化后

M3 Mac

进入页面后13s后可以进行页面交互

感官卡顿时间:6s

滚动会有明显卡顿

进入页面后6s后可以进行页面交互

感官卡顿时间:1s

滚动无卡顿

Windows测试机

页面崩溃无法打开

刷新后13s后可以进行页面交互

感官卡顿时间:5s

滚动无卡顿

2. 高并发重复请求​

这是在子组件请求接口,没有做接口缓存,导致调用N次请求。

缓存后,不切换城市只请求一次。

3. 树型选择器渲染函数时间复杂度高

线上场景组织节点数为5377个,当选择父级节点时,树型选择器renderTag方法使用了O(n2)的查找父节点遍历方法。

该renderTag方法在初始化、点击选择框、选择值、选择框失焦等多个事件中都会触发。

问题截图:

使用Map进行缓存,将函数时间复杂度降为O(n)

              // 优化前:filter+some 二层嵌套循环 时间复杂度为O(n2)const allTagList = data.filter((item) => {// 如果 item 有父节点,检查父节点是否选中if (item.parentId) {// 查找时间为O(n)return !data.some((dataItem) => dataItem.id === item.parentId);}// 如果 item 没有父节点,直接选中return true;});
// 优化后:Map直接读数时间复杂度为O(n)
const allTagList = data.filter((item) => {// 如果 item 有父节点,检查父节点是否选中if (item.parentId) {// 使用 Map 的 has 方法,时间复杂度 O(1)return !selectedIdMap.has(item.parentId);}// 如果 item 没有父节点,直接选中return true;});

优化前

优化后

M3 Mac

点击全选果蔬组织

JS逻辑层执行时间4046ms

页面卡顿时间:6s

点击选择果蔬中心全选

JS逻辑层执行时间 6ms

页面卡顿时间:2s

Windows测试机

点击全选果蔬组织,页面崩溃

点击选择果蔬中心全选

页面卡顿时间:4s

感官卡顿计时方式

  1. 开始计时:使用计时器,点击全选果蔬按钮后开始计时

  2. 结束计时:页面可以随意滚动交互

感官卡顿时间 = 结束时间点-开始时间点

JS逻辑计时方式

在renderTag问题函数的开始结束位置获取时间戳,在函数执行完毕后打印两者差值。

JS逻辑层执行时间 = 点击全选果蔬按钮后控制台输出的最长renderTag执行时间

4. 写法优化。

使用Set (n1)查找

避免模版直传方法渲染,替换为计算属性

http://www.dtcms.com/a/566776.html

相关文章:

  • 阿里云域名备案网站建设方案书上海未成年人思想道德建设网站
  • 站长工具一区拍卖网站模版
  • 县城网站怎样做经验中国114建材网
  • 婚介所网站开发费用电脑网页游戏平台
  • 优秀网站设计案例分析室内设计专用软件
  • html网站的设计做网站项目实例
  • 设计网站建设公司厦门网站建设厦门
  • IIC 通讯详解——以 OSI 模型分析 物理层、数据链路层和应用层
  • 如何在百度云上建设网站thinkphp集成wordpress
  • 济南正规的网站制作wordpress文章省略
  • 链表类力扣刷题总结
  • 网站建设工作室怎么开茂名网站开发公司
  • 衡阳建设学校官方网站广东省住房和城乡建设厅证件查询
  • 厦门做网站seo的网站应该如何进行优化
  • 白山商城网站建设wordpress默认原始图片
  • 做质量计量的网站有哪些博乐建设工程信息网站
  • 【Transformer系列(2)】注意力机制、自注意力机制、多头注意力机制、通道注意力机制、空间注意力机制超详细讲解
  • 东莞网站建设推广方案网站主题设计特色
  • 代做毕业设计网站有哪些网络整合营销推广
  • 嵌入式笔记系列——IIC
  • 网站维护一年一般多少钱视频链接生成器
  • wordpress网站好用吗专业的营销型网站定制
  • 离线推广网站规划书电子商务网站开发相关技术
  • 直接保存pandas DataFrame的内容到Excel文件中
  • excel T检测时[检验类型]参数设置的方法
  • 网站尾部做淘宝客可以有高佣金的网站
  • 成都网站建设四川推来客网络石家庄+外贸网站建设公司
  • 网站开发人员岗位wordpress调查插件
  • Python判断语句
  • 网站如何做微信登录网站顶部代码