Controller not updating UI in good time to display appropriate progress - flutter

Question

In a personal flutter project am working with Getx state management whereby am fetching data from a parse server to then save it to my local db on the app. Everything works fine in the backend in terms of fetching the data and later saving it locally as you can see in my controller class below.
However once I get the data from the server I want to display my custom progress but the ui is frozed with the circular progress and when it unfreezes the activity that was to update the progress is done at 99%. Am using Drift a wrapper around Sqlite.
class ProgressController extends GetxController {
String classid = '';
int progressValue = 0;
List<Student>? students = [];
MyDatabase? db;
#override
void onInit() {
super.onInit();
}
#override
void onReady() {
super.onReady();
}
#override
void onClose() {
super.onClose();
}
/// Get the list of students from the server
Future<List<Student>?> fetchStudentsData() async {
bool isConnected = await hasReliableInternetConnectivity();
if (isConnected) {
final EventObject eventObject = await httpGet(
client: http.Client(),
url: '${ApiConstants.students}?where={"class":$classid}&order=studentid&limit=1000',
);
try {
if (eventObject.id == EventConstants.requestSuccessful) {
final StudentsResponse jsonResponse = StudentsResponse.fromJson(
json.decode(eventObject.response),
);
students = jsonResponse.results;
if (students!.isNotEmpty) {
saveStudentsData();
} else {
showToast(
text: "No data was found",
state: ToastStates.error,
);
}
}
} catch (exception) {
students = null;
}
} else {
showToast(
text: "You don't seem to have reliable internet connection",
state: ToastStates.error,
);
students = null;
}
update();
return students;
}
/// Save students data to the local db
Future<void> saveStudentsData() async {
for (int i = 0; i < students!.length; i++) {
int progress = (i / students!.length * 100).toInt();
if (progress > progressValue) {
progressValue = progress;
update();
}
db!.saveNewStudent(students![i]);
}
update();
Get.offAll(() => HomeView());
}
}
class ProgressView extends StatelessWidget {
final ProgressController controller = Get.put(ProgressController());
#override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: Container(
margin: const EdgeInsets.all(30),
child: GetBuilder<ProgressController>(
builder: (controller) => FutureBuilder<List<Student>?>(
future: controller.fetchStudentsData(),
builder: (BuildContext context,
AsyncSnapshot<List<Student>?> snapshot) {
if (snapshot.hasData) {
if (snapshot.data!.isNotEmpty) {
return LineProgress(
progressSize: 100,
progressVl: controller.progressValue,
borderColor: Colors.black,
progressColor: AppColors.primaryColor,
backgroundColor: AppColors.secondaryColor,
);
} else {
return const Text('You are not connected to the internet');
}
} else if (snapshot.hasError) {
return const Text('An unexpected error occured');
} else {
return const CircularProgress();
}
},
),
),
),
),
);
}
}
My ui in the save view is as shown in the 2 frames below
The first frame is when fetching data from the server and the second is when the data has been received and saved to the db. It simply freezes until when it's done.