GridView inside ListView are not lazily built?

I'm trying to have Many GridViews inside a ListView to make a photo gallery. However, the GridViews do not lazily load. Whenever the ListView tries to build a GridView, it forces the GridView to build all items even if the GridViews have hundreds of items. Is there a way to make GridView load lazily instead?

Here is the code

ListView.builder(
  itemCount: _mediaContainerList.length,
  itemBuilder: (context, index) {
    return Container(
      child: MediaByDate(mediaList: _mediaContainerList[index]),
      margin: EdgeInsets.only(top: 20),
    );
  },
  physics: const BouncingScrollPhysics(),
);

Inside the MediaByDate, I build the GridViews as follow

GridView.builder(
          itemCount: widget.mediaList!.length,
          physics: NeverScrollableScrollPhysics(),
          gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
            crossAxisCount: pictureCount,
            crossAxisSpacing: 2,
            mainAxisSpacing: 2,
          ),
          itemBuilder: (BuildContext context, int index) {
            MediaEntity entity = widget.mediaList![index];
            print("build $index");
            return entity.isVideo
                ? VideoContainer(
              entity: entity,
            )
                : MediaPickerImageContainer(
              entity: entity,
            );
          },
        ),
  ),

The print("build $index"); result is

build 0
build 1
...
build 429
build 430

If I remove the ListView, it only print

build 0
build 1
...
build 22
build 23