perf: CSS content-visibility + containment 优化长对话渲染性能

- .message-block 添加 content-visibility: auto 跳过屏幕外消息渲染
- .messages-flow / .messages-area 添加 contain: layout style 隔离布局
- 减少长对话 DOM 重排开销,解决横向 resize 时的级联卡顿
This commit is contained in:
JOJO 2026-06-10 01:08:47 +08:00
parent d24e00b9b3
commit 6255efc594

View File

@ -100,6 +100,7 @@
padding-bottom: 20px;
min-height: 0;
position: relative;
contain: layout style;
}
.messages-area.messages-area--stick {
@ -113,6 +114,7 @@
margin: 0 auto;
display: flex;
flex-direction: column;
contain: layout style;
}
.messages-bottom-spacer {
@ -451,6 +453,8 @@
.message-block {
margin-bottom: 24px;
min-width: 0;
content-visibility: auto;
contain-intrinsic-size: auto 300px;
}
.message-block.message-block--sub-agent-notice {