diff --git a/dinky-web/src/global.less b/dinky-web/src/global.less
index 98ddc22951..5c13661ba7 100644
--- a/dinky-web/src/global.less
+++ b/dinky-web/src/global.less
@@ -259,8 +259,8 @@ ol {
 }
 
 .schemaTree {
-  min-height: 89vh;
-  max-height: 89vh;
+  min-height: 92vh;
+  max-height: 92vh;
 }
 
 .code-content-empty {
diff --git a/dinky-web/src/pages/DataStudio/LeftContainer/DataSource/index.tsx b/dinky-web/src/pages/DataStudio/LeftContainer/DataSource/index.tsx
index 59da4cd604..9a5dcedcb0 100644
--- a/dinky-web/src/pages/DataStudio/LeftContainer/DataSource/index.tsx
+++ b/dinky-web/src/pages/DataStudio/LeftContainer/DataSource/index.tsx
@@ -228,7 +228,7 @@ const DataSource = (props: any) => {
       <SchemaTree
         selectKeys={selectKeys}
         expandKeys={expandKeys}
-        style={{ height: toolContentHeight - 64 - 20 }}
+        height={toolContentHeight - 64 - 20}
         onNodeClick={handleTreeNodeClick}
         treeData={treeData}
         onExpand={handleTreeExpand}
diff --git a/dinky-web/src/pages/RegCenter/DataSource/components/DataSourceDetail/SchemaTree/index.tsx b/dinky-web/src/pages/RegCenter/DataSource/components/DataSourceDetail/SchemaTree/index.tsx
index fa9c55ac2e..fac85ebb9a 100644
--- a/dinky-web/src/pages/RegCenter/DataSource/components/DataSourceDetail/SchemaTree/index.tsx
+++ b/dinky-web/src/pages/RegCenter/DataSource/components/DataSourceDetail/SchemaTree/index.tsx
@@ -30,14 +30,14 @@ const { DirectoryTree } = Tree;
 type SchemaTreeProps = {
   treeData: Partial<any>[];
   onNodeClick: (keys: Key[], info: any) => void;
-  style?: React.CSSProperties;
+  height: number; // Calculate the height of the virtual scrolling container, required, otherwise it may cause page lag
   expandKeys: Key[];
   onExpand: (keys: Key[]) => void;
   selectKeys: Key[];
 };
 
 const SchemaTree: React.FC<SchemaTreeProps> = (props) => {
-  const { treeData, onNodeClick, style, expandKeys, onExpand, selectKeys } = props;
+  const { treeData, onNodeClick, height, expandKeys, onExpand, selectKeys } = props;
 
   const [searchValue, setSearchValue] = useState('');
 
@@ -67,10 +67,10 @@ const SchemaTree: React.FC<SchemaTreeProps> = (props) => {
             onChange={onSearchChange}
           />
           <DirectoryTree
+            height={height}
             expandedKeys={expandKeys}
             selectedKeys={selectKeys}
             onExpand={onExpand}
-            style={style}
             onSelect={onNodeClick}
             treeData={buildSchemaTree(treeData, searchValue)}
           />
diff --git a/dinky-web/src/pages/RegCenter/DataSource/components/DataSourceDetail/index.tsx b/dinky-web/src/pages/RegCenter/DataSource/components/DataSourceDetail/index.tsx
index 9007d75c68..b4b7d92298 100644
--- a/dinky-web/src/pages/RegCenter/DataSource/components/DataSourceDetail/index.tsx
+++ b/dinky-web/src/pages/RegCenter/DataSource/components/DataSourceDetail/index.tsx
@@ -185,6 +185,7 @@ const DataSourceDetail = (props: connect) => {
             onExpand={handleTreeExpand}
             onNodeClick={onSchemaTreeNodeClick}
             treeData={treeData}
+            height={innerHeight - 190}
           />
         </Authorized>
       </ProCard>