From 6255efc59474d6f0a5d52a605e69a34a2d7bb06c Mon Sep 17 00:00:00 2001
From: JOJO <1498581755@qq.com>
Date: Wed, 10 Jun 2026 01:08:47 +0800
Subject: [PATCH] =?UTF-8?q?perf:=20CSS=20content-visibility=20+=20containm?=
 =?UTF-8?q?ent=20=E4=BC=98=E5=8C=96=E9=95=BF=E5=AF=B9=E8=AF=9D=E6=B8=B2?=
 =?UTF-8?q?=E6=9F=93=E6=80=A7=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- .message-block 添加 content-visibility: auto 跳过屏幕外消息渲染
- .messages-flow / .messages-area 添加 contain: layout style 隔离布局
- 减少长对话 DOM 重排开销，解决横向 resize 时的级联卡顿
---
 static/src/styles/components/chat/_chat-area.scss | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/static/src/styles/components/chat/_chat-area.scss b/static/src/styles/components/chat/_chat-area.scss
index 95a66b8..b6070c7 100644
--- a/static/src/styles/components/chat/_chat-area.scss
+++ b/static/src/styles/components/chat/_chat-area.scss
@@ -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 {