perf: 优化保存逻辑

027xiguapi · Apr 9, 2024 · 1e19f16 · 1e19f16
1 parent 74b86b8
commit 1e19f16
Show file tree

Hide file tree

Showing 6 changed files with 26 additions and 31 deletions.
diff --git a/packages/desktop/electron-builder.json5 b/packages/desktop/electron-builder.json5
@@ -12,8 +12,8 @@
   files: ['dist-electron', 'dist', '.env'],
   mac: {
     icon: 'build/icons/mac/icon.icns',
+    target: { target: 'dmg' },
     artifactName: '${productName}-Mac-${version}-Installer.${ext}',
-    target: ['dmg', 'zip'],
   },
   linux: {
     icon: 'build/icons/png',
@@ -25,7 +25,6 @@
     target: [
       {
         target: 'nsis',
-        arch: ['x64'],
       },
     ],
     artifactName: '${productName}-Windows-${version}-Setup.${ext}',

diff --git a/packages/desktop/package.json b/packages/desktop/package.json
@@ -14,7 +14,7 @@
   "scripts": {
     "dev": "vite",
     "build": "tsc && vite build",
-    "build:win": "electron-builder",
+    "build:win": "rimraf release && electron-builder",
     "preview": "vite preview",
     "pree2e": "vite build --mode=test",
     "e2e": "playwright test",
@@ -40,4 +40,4 @@
     "vite": "^5.1.5",
     "vite-plugin-electron": "^0.28.2"
   }
-}
+}
diff --git a/packages/web/src/components/recorderAudio/WaveSurferPlayer.tsx b/packages/web/src/components/recorderAudio/WaveSurferPlayer.tsx
@@ -48,8 +48,6 @@ const WaveSurferPlayer = (props) => {
     const data = await fetch(url);
     const blob = await data.blob();
 
-    // window.isOffline ? saveAs(url, `pear-rec_${+new Date()}.webm`) : saveFile(blob);
-    // window.isElectron ? saveFile(blob) : saveAs(url, `pear-rec_${+new Date()}.webm`);
     saveFile(blob);
   }, [wavesurfer]);
 

diff --git a/packages/web/src/components/recorderScreen/ScreenRecorder.tsx b/packages/web/src/components/recorderScreen/ScreenRecorder.tsx
@@ -32,7 +32,8 @@ const ScreenRecorder = (props) => {
   const recordedChunks = useRef<Blob[]>([]); // 存储录制的音频数据
   const recordedUrl = useRef<string>(''); // 存储录制的音频数据
   const [isRecording, setIsRecording] = useState(false); // 标记是否正在录制
-  const isSave = useRef<boolean>(false);
+  const [isSave, setIsSave] = useState(false);
+  // const isSave = useRef<boolean>(false);
   const [percent, setPercent] = useState(0);
   const [isLoad, setIsLoad] = useState(false);
   const ffmpegRef = useRef(new FFmpeg());
@@ -60,7 +61,6 @@ const ScreenRecorder = (props) => {
       if (outputStream.current == null) return;
       const opfsFile = await mp4StreamToOPFSFile(outputStream.current);
       type == 'gif' ? transcodeGif(opfsFile) : saveFile(opfsFile);
-      isSave.current = false;
     })();
   }, [outputStream.current]);
 
@@ -225,10 +225,11 @@ const ScreenRecorder = (props) => {
 
   // 停止录制，并将录制的音频数据导出为 Blob 对象
   async function handleStopRecord() {
-    isSave.current = true;
+    setIsSave(true);
     timer.reset();
     if (isRecording) {
       await mediaRecorder.current.stop();
+      setIsRecording(false);
     }
     worker.postMessage({
       status: 'stop',
@@ -277,8 +278,9 @@ const ScreenRecorder = (props) => {
 
   async function saveFile(blob) {
     try {
+      const fileName = `pear-rec_${+new Date()}.${type == 'gif' ? 'gif' : 'mp4'}`;
       const record = {
-        fileName: `pear-rec_${+new Date()}.${type == 'gif' ? 'gif' : 'mp4'}`,
+        fileName: fileName,
         fileData: blob,
         fileType: 'rs',
         userId: user.id,
@@ -289,11 +291,9 @@ const ScreenRecorder = (props) => {
       };
       const recordId = await db.records.add(record);
       if (recordId) {
+        setIsSave(false);
         if (window.isElectron) {
-          window.electronAPI.sendRsCloseWin();
-          type == 'gif'
-            ? window.electronAPI.sendViOpenWin({ recordId: recordId })
-            : window.electronAPI.sendVvOpenWin({ recordId: recordId });
+          saveAs(blob, fileName);
         } else {
           Modal.confirm({
             title: '录屏已保存，是否查看？',
@@ -337,7 +337,7 @@ const ScreenRecorder = (props) => {
           <SoundMuteRecorder isRecording={isRecording} />
         </div>
       </div>
-      {isSave.current ? (
+      {isSave ? (
         <Button type="text" loading>
           {t('recorderScreen.saving')}...
         </Button>

diff --git a/packages/web/src/pages/recorderFullScreen/index.tsx b/packages/web/src/pages/recorderFullScreen/index.tsx
@@ -8,6 +8,7 @@ import { useEffect, useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { BsFillStopFill, BsPause, BsPlayFill, BsRecordCircle } from 'react-icons/bs';
 import { db, defaultUser } from '../../db';
+import { saveAs } from 'file-saver';
 import ininitApp from '../../pages/main';
 import styles from './index.module.scss';
 
@@ -160,8 +161,9 @@ const RecorderScreen = () => {
 
   async function saveFile(blob) {
     try {
+      const fileName = `pear-rec_${+new Date()}.webm`;
       const record = {
-        fileName: `pear-rec_${+new Date()}.webm`,
+        fileName: fileName,
         fileData: blob,
         fileType: 'rs',
         userId: user.id,
@@ -172,8 +174,8 @@ const RecorderScreen = () => {
       };
       const recordId = await db.records.add(record);
       if (recordId) {
-        window.electronAPI?.sendRfsCloseWin();
-        window.electronAPI?.sendVvOpenWin({ recordId: recordId });
+        setIsSave(false);
+        saveAs(blob, fileName);
       }
     } catch (err) {
       message.error('保存失败');

diff --git a/packages/web/src/pages/shotScreen/index.tsx b/packages/web/src/pages/shotScreen/index.tsx
@@ -165,19 +165,15 @@ function ShotScreen() {
         copyImg(blob);
         if (window.isElectron) {
           window.electronAPI?.sendSsCloseWin();
-          window.electronAPI?.sendNotification({
-            title: '截图通知',
-            body: '截图完成',
-          });
-          isPin
-            ? window.electronAPI?.sendPiOpenWin({
-                recordId: recordId,
-              })
-            : window.electronAPI?.sendViOpenWin({
-                recordId: recordId,
-                width: bounds.width,
-                height: bounds.height,
-              });
+          if (isPin) {
+            window.electronAPI?.sendPiOpenWin({
+              recordId: recordId,
+              width: bounds.width,
+              height: bounds.height,
+            });
+          } else {
+            saveAs(blob, `pear-rec_${+new Date()}.png`);
+          }
         } else {
           Modal.confirm({
             title: '图片已保存，是否查看？',