diff --git a/.eslintrc.cjs b/.eslintrc.cjs
index d6c9537..2c49f18 100644
--- a/.eslintrc.cjs
+++ b/.eslintrc.cjs
@@ -8,11 +8,15 @@ module.exports = {
   ],
   ignorePatterns: ['dist', '.eslintrc.cjs'],
   parser: '@typescript-eslint/parser',
-  plugins: ['react-refresh'],
+  plugins: [
+    'react-refresh',
+    'eslint-plugin-react-compiler',
+  ],
   rules: {
     'react-refresh/only-export-components': [
       'warn',
       { allowConstantExport: true },
     ],
+    'react-compiler/react-compiler': 'error',
   },
 }
diff --git a/bun.lockb b/bun.lockb
index 2d28702..8888cc8 100644
Binary files a/bun.lockb and b/bun.lockb differ
diff --git a/package.json b/package.json
index 4a847d8..745b5be 100644
--- a/package.json
+++ b/package.json
@@ -29,13 +29,16 @@
     "swiper": "^11.1.3"
   },
   "devDependencies": {
+    "@types/bun": "^1.1.2",
     "@types/react": "npm:types-react@beta",
     "@types/react-dom": "npm:types-react-dom@beta",
     "@typescript-eslint/eslint-plugin": "^7.9.0",
     "@typescript-eslint/parser": "^7.9.0",
     "@vitejs/plugin-react": "^4.2.1",
-    "eslint": "^8.57.0",
+    "babel-plugin-react-compiler": "^0.0.0-experimental-592953e-20240517",
+    "eslint": "^9.0.0",
     "eslint-plugin-react": "^7.34.1",
+    "eslint-plugin-react-compiler": "^0.0.0-experimental-c8b3f72-20240517",
     "eslint-plugin-react-hooks": "^4.6.2",
     "eslint-plugin-react-refresh": "^0.4.7",
     "typescript": "^5.4.5",
diff --git a/src/components/Prompt.tsx b/src/components/Prompt.tsx
index ebdd83c..78525fb 100644
--- a/src/components/Prompt.tsx
+++ b/src/components/Prompt.tsx
@@ -29,7 +29,7 @@ interface PromptProps {
   setCurrentImages: React.Dispatch<React.SetStateAction<Image[]>>
   dialogAction: React.Dispatch<DialogAction>
   langMode: 'zh' | 'en'
-  status: React.MutableRefObject<string>
+  status: React.RefObject<string>
   children: JSX.Element
   geneMode: 'textToImage' | 'imageToImage'
   fileRef: React.RefObject<HTMLInputElement | null>
diff --git a/src/components/Widgets/ImageSelector.tsx b/src/components/Widgets/ImageSelector.tsx
index ad7cd8f..46e2568 100644
--- a/src/components/Widgets/ImageSelector.tsx
+++ b/src/components/Widgets/ImageSelector.tsx
@@ -23,7 +23,7 @@ function ImageSelector({ ref, geneMode, dialogAction }: ImageSelectorProps) {
     }
     callback()
     // 防抖处理
-    let timer: number
+    let timer: Timer
     const newCallback = () => {
       clearTimeout(timer)
       timer = setTimeout(callback, 200)
diff --git a/vite.config.ts b/vite.config.ts
index e1527fa..df44c04 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -3,7 +3,13 @@ import react from '@vitejs/plugin-react'
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [react()],
+  plugins: [react({
+    babel: {
+      plugins: [
+        ['babel-plugin-react-compiler', {}],
+      ],
+    },
+  })],
   build: {
     // 修改编译目标后记得同步修改 check.ts 中的版本号
     target: ['chrome108', 'edge108', 'firefox101', 'safari15.4'],