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