Есть ли способ оптимизировать время, затрачиваемое на загрузку многокомпонентных данных в приложении django + react?

У меня есть приложение, которое имеет бэкенд на базе django rest framework и фронтенд на базе react. Как обычно, пользователь имеет возможность редактировать данные, которые он первоначально предоставил. Данные также содержат фотографию профиля пользователя. Представление обновления работает нормально, но я заметил, что если пользователь пытается обновить свой профиль, то для получения ответа от бэкенда react frontend требуется до 5-8, а иногда и 27 секунд.

Вопрос

Есть ли способ уменьшить это время или какой-либо метод оптимизации производительности?

Я также размещаю свой код, если я делаю что-то неправильно.

реактивная часть

export const editTeacherDetail = async (detailsData, photo) => {
  console.log("detailsData before in main api = ", detailsData);
  console.log("photo before in main api = ", photo);

  let formData = new FormData();
  formData.append("name", detailsData.name.toUpperCase());
  formData.append("state", detailsData.state);
  formData.append("adhaar_number", detailsData.adhaar_number);
  formData.append("current_profession", detailsData.current_profession);
  formData.append("phone", detailsData.phone);
  formData.append("location", detailsData.location.toUpperCase());
  formData.append("full_address", detailsData.full_address.toUpperCase());
  formData.append("date_of_birth", detailsData.date_of_birth);
  formData.append("gender", detailsData.gender.toUpperCase());
  formData.append("name_of_school", detailsData.name_of_school.toUpperCase());
  formData.append("experience", detailsData.experience);
  formData.append("teach_for_no_days", detailsData.teach_for_no_days);
  formData.append("subject", detailsData.subject.toUpperCase());
  formData.append("teach_class", detailsData.teach_class);
  formData.append("home_tuition", detailsData.home_tuition);
  formData.append("fees", detailsData.fees);
  formData.append("home_tuition_fees", detailsData.home_tuition_fees);
  formData.append("shift", detailsData.shift.toUpperCase());
  formData.append("board", detailsData.board.toUpperCase());

  if (typeof photo !== "string") {
    formData.append("profile_photo", photo);
  }

  try {
    console.log("formData = ", formData);

    let response = await axiosInstance.put(`/teacher/edit-detail/`, formData);
    console.log(response);
    return response;
  } catch (error) {
    if (error.response) {
      ToastNotification(
        "We are facing some problems. Please try again later",
        "error"
      );
      return error.response;
    } else if (error.request) {
      console.error(error.request);
      return error.request;
    } else {
      console.error(error);
    }
  }
};

часть джанго

@api_view(['PUT'])
@permission_classes([IsAuthenticated])
@parser_classes([MultiPartParser, FormParser])     
def edit_teacher_detail(request):
  
   data = request.data
   
   if data is not None:
     
     queryset = TeacherDetail.objects.get(user = request.user)
     
     serializer = TeacherDetailUpdateSerializer(instance=queryset, data = data)
     
     try:
       if serializer.is_valid():
         serializer.save()
         return Response({'message':"details edited"} ,status=status.HTTP_200_OK)
       else:
         print(serializer._errors)
         return Response({'message': serializer._errors}, status=status.HTTP_400_BAD_REQUEST)
     except Exception as e:
       print(e)
       return Response({"message": str(e)},status=status.HTTP_500_INTERNAL_SERVER_ERROR)
     
     
   
   else: 
      return Response({'message':'no query recieved'}, status=status.HTTP_400_BAD_REQUEST)

Вернуться на верх