Есть ли способ оптимизировать время, затрачиваемое на загрузку многокомпонентных данных в приложении 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)