Flutter中如何预加载渲染网页并持久化，实现即时访问与截图预览？

需求概述 #

• 首页展示在线文章列表，每个列表项附带网页截图预览
• 点击列表项可立即打开对应网页（无加载等待）

核心问题 #

无法实现网页预渲染：

1. 无法在不显示网页的情况下完成截图
2. 无法让用户点击时网页直接显示（无需重新加载）

失败的尝试 #

曾尝试通过非Widget类实例化InAppWebView，加载完成后截图并持久化组件，但因InAppWebView仅在Widget树中且屏幕可见时才会加载页面，导致网页从未加载，截图失败。

失败代码如下：

import 'dart:typed_data';
import 'package:flutter/material.dart';
import 'package:flutter_inappwebview/flutter_inappwebview.dart';
import 'package:screenshot/screenshot.dart';

class WebView {
  static final Map globalInstancesPool = {};

  static void dumpPool() {
    globalInstancesPool.clear();
  }

  late final InAppWebView widget;

  Image? previewScreenshot;

  void _takeScreenshot(Function? callback) {
    ScreenshotController screenshotController = ScreenshotController();
    screenshotController
        .captureFromWidget(
            Positioned(top: 0, left: 0, right: 0, bottom: 0, child: widget))
        .then((Uint8List captureBytes) {
      previewScreenshot = Image.memory(captureBytes);
      if (callback == null) return;
      callback(previewScreenshot!);
    });
  }

  WebView({required String url, Function? onScreenshotReady}) {
    widget = InAppWebView(
      initialUrlRequest: URLRequest(url: Uri.tryParse(url)),
      initialOptions: InAppWebViewGroupOptions(
          crossPlatform: InAppWebViewOptions(
        cacheEnabled: true,
        clearCache: false,
      )),
      onLoadStop: (a, b) {
        _takeScreenshot(onScreenshotReady);
      },
    );
  }

  factory WebView.newOrExisting(
      {required String url, Function? onScreenshotReady}) {
    if (globalInstancesPool.containsKey(url)) {
      return globalInstancesPool[url]!;
    }
    WebView newWebViewInstance =
        WebView(url: url, onScreenshotReady: onScreenshotReady);
    globalInstancesPool[url] = newWebViewInstance;
    return newWebViewInstance;
  }
}

也曾尝试将WebView放入Offstage组件，但页面仍无法加载。目前唯一接近可行的方案是将WebView设置为1x1像素极小尺寸显示，但出于性能考虑希望避免这种方式。

期望的最优方案 #

无需维护多个WebView组件，而是存储预渲染的页面本身，仅使用一个WebView，将预渲染页面“注入”其中。

这类功能是主流浏览器的常规特性：

• Chrome打开新标签页时，页面在后台加载渲染
• 非活跃标签页在内存中持久化，切换时立即显示
• iOS Safari展示标签页内容预览，与需求中的列表截图预览一致

核心需求 #

预加载多个网页并使其随时可用，这是主流浏览器的标准功能，求Flutter中的实现方案。

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