¿Por qué no se pueden realizar operaciones de cálculo prolongadas en un método asíncrono?

Las operaciones de cálculo prolongadas en un método asíncrono que se ejecuta en el aislado principal (hilo de UI) bloquean la interfaz de usuario. Aunque el método asíncrono utilice Future o async/await, todavía se ejecuta en el mismo hilo. Mientras se realiza una tarea que consume muchos recursos, la UI no puede actualizarse, lo que lleva a que la aplicación se congele.

Para realizar operaciones prolongadas sin bloquear la UI, se debe usar:

• Aislados: Hilos de ejecución separados que no comparten memoria con el aislado principal. La comunicación entre aislados se realiza a través de puertos (SendPort, ReceivePort).
• Función Compute: Una envoltura conveniente para crear y gestionar aislados para cálculos pequeños.

import 'dart:isolate';
import 'package:flutter/foundation.dart';

// Función que realiza cálculos prolongados
int performHeavyComputation(int data) {
  // Simulación de cálculos prolongados
  int result = 0;
  for (int i = 0; i < 1000000000; i++) {
    result += i;
  }
  return result + data;
}

// Uso de compute para ejecutar en otro aislado
Future<int> heavyComputationInIsolate(int data) async {
  return compute(performHeavyComputation, data);
}

// Ejemplo de uso en StatefulWidget
class MyWidgetState extends State<MyWidget> {
  int computationResult = 0;

  Future<void> _startComputation() async {
    // Llamada a cálculos prolongados en otro aislado
    computationResult = await heavyComputationInIsolate(10);
    setState(() {
      // Actualización de la UI después de obtener el resultado
    });
  }

  @override
  Widget build(BuildContext context) {
    return Center(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Text('Resultado de los cálculos: $computationResult'),
          ElevatedButton(
            onPressed: _startComputation,
            child: const Text('Iniciar cálculo'),
          ),
        ],
      ),
    );
  }
}