Flutter实现延迟与图片预缓存并行，完成后再路由页面

你只需要把延迟等待和图片预缓存改成并行执行，用Future.wait()来等待所有任务完成，就能实现「最短等待3秒，预缓存耗时更长则等预缓存结束再跳转」的需求。

修改后的代码如下：

void delayAndRoute() async {
  // 启动延迟任务（不用立刻await，让它先跑）
  final delayTask = Future.delayed(const Duration(milliseconds: 3000));
  
  // 启动所有图片的预缓存任务（并行执行，而非逐个等待）
  final precacheTasks = [
    precacheImage(AssetImage("assets/images/01.gif"), context),
    precacheImage(AssetImage("assets/images/02.gif"), context),
    precacheImage(AssetImage("assets/images/03.gif"), context),
  ];

  // 等待延迟任务 + 所有预缓存任务全部完成，再执行路由跳转
  await Future.wait([delayTask, ...precacheTasks]);

  Navigator.pushReplacement(
    context,
    MaterialPageRoute(
      builder: (context) => const Login(),
    ),
  );
}

代码说明： #

• 延迟任务和预缓存任务会同时启动，不再串行等待
• Future.wait()会等待传入的所有Future执行完毕，才会继续往下走
• 原来的预缓存是逐个await（串行加载），现在改成并行加载所有图片，还能进一步缩短预缓存的总耗时

内容的提问来源于stack exchange，提问作者Ram Gupta