我編寫了一段可以運行的代碼，但它不是杰作。它存在巨大的性能問題。我該如何處理呢？問題我的組件的性能存在問題：發送多張圖片很慢，當我發送5張圖片時，大約需要1-2分鐘。我如何確保照片僅在提交期間上傳到 Cloudinary？因為，例如，當用戶選擇照片 A，然后環顧四周并選擇照片 B 時，照片 A 和 B 都會上傳到云端。問題在將文件傳輸到 Cloudinary 時禁用添加相冊的按鈕是個好主意嗎？請幫助我解決這兩個問題，我想確保應用程序順利運行。太感謝了。const AddAlbum = () => {  const [fileUrl, setFileUrl] = useState();  // MultipleFiles  const [multipleFileUrl, setMultipleFileUrl] = useState([]);   // cloudnary upload api endpoint  const api_cloudinary =    "https://api.cloudinary.com/v1_1/cloudinary_name/image/upload";    // file upload  const handleSingleFileUpload = async (files) => {      const formData = new FormData();    formData.append("file", files[0]);    formData.append("upload_preset", "preset_number");    // send cloudinary image and presets info    const res = await fetch(api_cloudinary, {      method: "POST",      body: formData,    });    const file = await res.json();    console.log(file);    const fileUrl = await file.eager[0].url;    setFileUrl(fileUrl);  };  console.log(fileUrl);  // upload many files cloudnary  // For now max amount of files is 20  const handleMultipleFileUpload = async (files, amount) => {    const formData = new FormData();    for (let i = 0; i <= files.length; i++) {      let file = files[i];      formData.append("file", file);      formData.append("upload_preset", ""preset_number"");      const res = await fetch(api_cloudinary, {        method: "POST",        body: formData,      });      const cloudinaryFiles = await res.json();      console.log(cloudinaryFiles);      setMultipleFileUrl(cloudinaryFiles);    }  };  const handleSubmit = async (e) => {    e.preventDefault();    console.log(      `      Album name:${albumName}      color:${color}      Background Image: ${fileUrl}      files:${multipleFileUrl}      `    );  };