Flutter Web: Prerender ListView

Question

Я использую Flutter Web и хочу предварительно визуализировать ListView вместо создания виджетов по мере прокрутки пользователя, вы можете увидеть это поведение на моем тестовом сайте: https://auties00.github.io Это вызывает проблемы с производительностью, особенно mobile, пожалуйста, игнорируйте список, поскольку я тестирую несколько методологий для прокрутки до индекса ListView. Исходный код:

class _HomePageState extends State<HomePage> {
  final ScrollController _controller = ScrollController();
  final List<GlobalKey> _keys = [];

  @override
  Widget build(BuildContext context) {
    reset();
    _keys.clear();
    var size = MediaQuery.of(context).size;
    ScreenUtil.init(context, width: size.width, height: size.height);

    return Scaffold(
      body: Container(
          child: NotificationListener<OverscrollIndicatorNotification>(
              onNotification: (e) {
                e.disallowGlow();
                return false;
              },

              child: _buildBody()
          )
      ),
    );
  }

  Widget _buildBody(){
    return LayoutBuilder(
      builder: (context, constraints) {
        _initWebListeners(constraints);
        return ListView.builder(
          controller: _controller,
          physics: const AlwaysScrollableScrollPhysics(),
          itemBuilder: (var context, var index) {
            switch (index) {
              case 0: return WebNavigationBar(
                  key: GlobalKey()..addKeyToList(_keys),
                  keys: _keys
              );

              case 1:return WebAnnouncement(
                key: GlobalKey()..addKeyToList(_keys),
              );

              case 2: return WebPlayer(
                  key: GlobalKey()..addKeyToList(_keys),
                  link: 'https://i.imgur.com/VPTYKX2.mp4'
              );

              case 4: return WebIntroduction(
                key: GlobalKey()..addKeyToList(_keys),
              );

              case 6: return WebFeatures(
                key: GlobalKey()..addKeyToList(_keys),
              );

              case 8: return WebPricing(
                key: GlobalKey()..addKeyToList(_keys),
              );

              case 9: return WebFooter(
                key: GlobalKey()..addKeyToList(_keys),
              );
            }

            return WebDivider();
          },
          itemCount: 10
        );
      },
    );
  }
}

Answer 1

Попробуйте поместить все виджеты в столбец. Затем поместите столбец в список как один из дочерних. Это немного улучшает производительность.