V2EX = way to explore V2EX 是一个关于分享和探索的地方
Sign Up Now For Existing Member Sign In
请不要在回答技术问题时复制粘贴 AI 生成的内容
This topic created in 1981 days ago, the information mentioned may be changed or developed.
需求很简单，一个 50 行左右的简单表格，每行有三四个文本框可以编辑，做了表列锁定，用的饿了么 UI，用户说 IE11 卡，按理说都是这几年买的电脑，win10 也装了，IE11 性能怎么也不可能这么差
分析过程略，直接给结果，我们来做题
每行 4 个文本框，50 行，那么一页就有 200 个文本框
因为饿了么的列锁定是 2 个重叠表格实现的，也就是同样的文本框渲染了 2 次，所以一页现在就有 400 个文本框
关键来了，IE11 下，饿了么的 input 会计算自己的高度（我们知道，老一点的浏览器在获取计算长宽这样的属性时会把所有缓存的东西算一下得到正确值），这样一次 patch 需要 20-30ms
所以这 400 个文本框的总耗时会超过 10 秒，虽然性能分析模式慢一些，但是实际上也要 6 秒以上了
 | 1 ke1vin Nov 24, 2020 说得跟 chrome 就不会卡一样，没记错的话 Element UI 的 input 进来就会执行一个触发重绘的函数 |
 | 大概这就是大佬吧 |
 | 3 aaronlam Nov 24, 2020 之前做过一个公司的内部系统也是表格，也是 Element-UI，但是我的表格有 10-20 个列，并且有编辑模式，编辑模式下有些列还需要转为 Input 和 Select 组件。然后以至于在 IE 下奇卡无比，但是在 Chrome 和 Firefox 就表现良好。后面把表格折腾成了虚拟滚动才算是解决卡顿问题，但是体验感觉就没有原来的真实滚动来的好。IE 的性能真的不能直视。。 |
 | 4 secondwtq Nov 24, 2020 Safari 就不会有这个问题（ |
 | 5 PopRain Nov 24, 2020 via Android 以前用 IE 打开谷歌的在线电子表格感觉不出性能问题，这个列更多 |
 | 7 wdhwg001 Nov 24, 2020 没有苹果的 WebKit 项目的话，那就是你现在能用的最好的浏览器了。 |
 | 10 ragnaroks Nov 24, 2020 做法没问题,问题出在一次计算居然要 20ms 以上,1ms 都足够大型游戏刷写十几次 |
 | 11 loading Nov 24, 2020 via Android 从 ie5.5 走过来的表示:习惯了。 |
| 12 loading Nov 24, 2020 via Android  1 现在更快的计算机，代码性能问题很容易被掩盖，现在的手机性能能登多少次月了，如果让现在的人去写，可能都不能离地。 |
 | 13 eitomomobaohua Nov 24, 2020 @murmur Edge 是 Chrome 内核啊，Chrome 也是 Webkit 的分支 |
 | 15 no1xsyzy Nov 24, 2020 @eitomomobaohua 老 Edge 不是 Chromium 内核 |
 | 16 xiyuesaves Nov 24, 2020 @eitomomobaohua edge 转成 Chromium 内核也只是今年年初的事情啊,在此之前用的是自研 EdgeHTML |
| 18 wdhwg001 Nov 24, 2020 via iPhone @murmur 但是它们之中只有火狐有在推行标准，最大的贡献就是逼着 IE 实现了完整的 CSS3 支持，但是直到 WebKit 普及之前，JScript 和 ActiveX 都是浏览器的金标准。 |
 | 20 ruanimal Nov 24, 2020 @wdhwg001 WebKit 的 HTML 及 Javascript 代码源自 KDE 的 KHTML 及 KJS 库的一个分支, 别把苹果抬那么高 |
 | 22 sandman511 Nov 24, 2020 不懂就问，表列锁定是什么意思 |
 | 23 murmur OP @sandman511 就是固定几列，后面的列可以随便拖动，比如你看人员信息表，我就把姓名这列固定 |
 | 24 Lemeng Nov 24, 2020 ie 主要比较轻便，实用性确实差 |
 | 25 BarZu Nov 24, 2020 惊讶，现在做的系统竟然还要支持 IE 。。。我都是指定用户用哪个浏览器的[手动狗头] |
 | 26 Torpedo Nov 24, 2020 IE 的问题是就是持续维护迭代的太少了 IE6 的问题就是从业界领先，到业界毒瘤 IE11 后面就是 edge 、chrome edge 了。 本身代码还是可以，关键看投了多少人持续迭代维护 |
 | 27 royzxq Nov 24, 2020 都是指定用户使用 chrome 70+的 |
| 28 royzxq Nov 24, 2020 另外为什么会有 200 个文本框呢... 每一个表格节点都渲染了一个文本框？ |
 | 29 redtea Nov 24, 2020 via iPhone IE 已死 |
 | 31 JJstyle Nov 24, 2020 做过类似的需求，但是我们的项目要求用 chrome 才能打开，进首页就已经拦截了，哈哈哈 |
 | 32 Dogergo Nov 24, 2020 Element Ui 数据表格，尤其是列固定的情况下性能贼差，曾经在一个项目中用过，layui 会好上很多，虽然不知道 layui 的具体实现是什么样的，没有具体研究。 |
 | 33 darknoll Nov 24, 2020 IE 的问题有啥可分析的，强制用户使用 chrome 呗 |
 | 34 jmyz0455 Nov 24, 2020 五年前吧好像，兼容 IE 的一个工单系统，那时候欧朋火狐还是自研引擎的时代，包括微软自家的 Edge 。做出来之后，其他浏览器都是非常完美的。IE11 就是无法正常使用树控件，要求不高数据也不多，就是异步加载然后展示更多，老是在加载的时候卡，要么是展开的时候卡，换了好多插件都不行，晕。 |
| 35 eitomomobaohua Nov 24, 2020 @no1xsyzy 不好意思，我给忘了 233 |
| 36 eitomomobaohua Nov 24, 2020 @xiyuesaves 我错了，你不说我都忘了... |
 | 43 ofooo Nov 24, 2020 所以这就是产品设计问题啊。50 个问题，一气输入完，万一刷新一下没了。。。。。 用户不得气死？得是什么用户，才会一气输入 50 个问题啊。。。。是产品的儿子么 |
 | 44 dumbass Nov 24, 2020 via iPhone 编辑表格用弹窗实现呢，会不会减少不必要的渲染 |
 | 46 autoxbc Nov 25, 2020 @wdhwg001 #18 其实 Opera 也在积极推动标准，当年 W3C 的 CSS 专家组很多是 Opera 的雇员，CSS 测试套件 Acid2 只有 Opera 能通过 |
 | 49 imn1 Nov 25, 2020 400 个文本框……不知道怎么接话 |
Select Language