feat(ui): optimize the bundle size page (#671)

web-infra-dev · Jan 10, 2025 · 514f9e7 · 514f9e7
1 parent 110e46b
commit 514f9e7
Show file tree

Hide file tree

Showing 33 changed files with 837 additions and 728 deletions.
diff --git a/examples/modern-minimal/modern.config.ts b/examples/modern-minimal/modern.config.ts
@@ -26,7 +26,6 @@ export default defineConfig({
         {
           disableClientServer: !process.env.ENABLE_CLIENT_SERVER,
           features: ['bundle', 'plugins', 'loader'],
-          mode: 'brief',
         },
       ]);
     },

diff --git a/examples/rsbuild-minimal/package.json b/examples/rsbuild-minimal/package.json
@@ -21,7 +21,7 @@
     "semver7": "npm:[email protected]"
   },
   "devDependencies": {
-    "@rsbuild/core": "^1.1.1",
+    "@rsbuild/core": "^1.1.3",
     "@rsbuild/plugin-react": "^1.0.7",
     "@rsdoctor/core": "workspace:*",
     "@rsdoctor/rspack-plugin": "workspace:*",

diff --git a/examples/rsbuild-minimal/rsbuild.config.ts b/examples/rsbuild-minimal/rsbuild.config.ts
@@ -33,7 +33,7 @@ export default defineConfig({
             },
           },
           port: 9988,
-          mode: 'brief',
+          // mode: 'brief',
         },
       ]);
     },

diff --git a/packages/components/src/components/CodeViewer/viewer.tsx b/packages/components/src/components/CodeViewer/viewer.tsx
@@ -1,9 +1,7 @@
-/* eslint-disable financial/no-float-calculation */
 import React from 'react';
 import { SDK } from '@rsdoctor/types';
 import Editor, { OnMount } from '@monaco-editor/react';
 import { isNumber } from 'lodash-es';
-import { CodepenCircleOutlined } from '@ant-design/icons';
 import type { editor } from 'monaco-editor';
 import { getOriginalLanguage, getSelectionRange } from '../../utils';
 import { DefaultEditorConfig } from './config';
@@ -64,12 +62,6 @@ export const CodeViewerWithDrawer: React.FC<CodeViewerProps> = (props) => {
   return (
     <TextDrawer
       text=""
-      buttonProps={{
-        size: 'small',
-        icon: <CodepenCircleOutlined />,
-        type: 'default',
-      }}
-      buttonStyle={{ padding: `0 4px` }}
       drawerProps={{
         destroyOnClose: true,
         title: `Code of "${props.path}"`,

diff --git a/packages/components/src/components/FileTree/css.svg b/packages/components/src/components/FileTree/css.svg
diff --git a/packages/components/src/components/FileTree/html.svg b/packages/components/src/components/FileTree/html.svg
diff --git a/packages/components/src/components/FileTree/image.svg b/packages/components/src/components/FileTree/image.svg
diff --git a/packages/components/src/components/FileTree/index.scss b/packages/components/src/components/FileTree/index.scss
@@ -19,7 +19,7 @@ $treeNodePrefixCls: '#{$treePrefixCls}-treenode';
       height: 24px;
       margin: 0;
       padding: 0 4px;
-      font-size: 12px;
+      font-size: 14px;
       font-weight: 400;
       color: rgba(0, 0, 0, 0.85);
       box-sizing: border-box;
@@ -76,5 +76,5 @@ $treeNodePrefixCls: '#{$treePrefixCls}-treenode';
 .file-icon {
   display: inline-block;
   padding: 2px 0;
-  margin-left: 7px;
+  margin-left: 8px;
 }
diff --git a/packages/components/src/components/FileTree/js.svg b/packages/components/src/components/FileTree/js.svg
diff --git a/packages/components/src/components/FileTree/unkown-file.svg b/packages/components/src/components/FileTree/unkown-file.svg
diff --git a/packages/components/src/components/Form/keyword.tsx b/packages/components/src/components/Form/keyword.tsx
@@ -58,9 +58,9 @@ export const KeywordInput: React.FC<KeywordProps> = ({
         style={{ width: width ? width - labelWidth : 250 }}
         placeholder={placeholder}
         onChange={(e) => {
-          clearTimeout(timer);
+          if (timer) clearTimeout(timer);
           const v = e.target.value.trim();
-          setTimeout(() => {
+          timer = setTimeout(() => {
             setFilename(v);
           }, delay);
         }}
-Original file line number
+Diff line change
@@ Expand Up / @@ -26,7 +26,6 @@ export default defineConfig({ @@
             {
               disableClientServer: !process.env.ENABLE_CLIENT_SERVER,
               features: ['bundle', 'plugins', 'loader'],
-              mode: 'brief',
             },
           ]);
         },
@@ Expand Down @@