'How to reduce Firestore reads - Flutter?

  • I built an E-commerce app using Firebase/Firestore and I am using Stream Builder or Future Builder and facing high Firestore reads.

  • When I press on Hot-Reload all Stream Builders in the app rebuild (I am using the print method to track the rebuilding).

  • The hot-reload rebuilds the previous screen widget (Includes Stream Builder or Flutter Builder), after Navigator.push.

I need to reduce Firestore high reads and avoid many rebuilds.

Can someone help me to fix it?

Example:

class _SliderView extends StatefulWidget {
  const _SliderView({
    required this.slidersItems,
    Key? key,
  }) : super(key: key);

  final Future<List<SliderModel>> slidersItems;

  @override
  State<_SliderView> createState() => _SliderViewState();
}

class _SliderViewState extends State<_SliderView> {
  final CarouselController _carouselController = CarouselController();
  int currentIndex = 0;
  int nextPage = 0;
  late int offersLength;

  @override
  void initState() {
    super.initState();
  }

  @override
  void dispose() {
    _carouselController.stopAutoPlay();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return FutureBuilder<List<SliderModel>>(
      future: widget.slidersItems,
      builder: (context, snapshot) {
        print("## Home - Slider Viewer ##");
        if (snapshot.data != null) {
          return SizedBox(
            width: double.infinity,
            child: Stack(
              children: [
                NotificationListener<OverscrollIndicatorNotification>(
                  onNotification: (scroll) {
                    scroll.disallowIndicator();
                    return false;
                  },
                  child: CarouselSlider.builder(
                    carouselController: _carouselController,
                    options: CarouselOptions(
                      viewportFraction: 1.0,
                      height: ScreenSize.screenHeight,
                      autoPlay: snapshot.data!.length > 1 ? true : false,
                      onPageChanged: (val, reason) {
                        setState(() {
                          currentIndex = val;
                        });
                      },
                    ),
                    itemCount: snapshot.data!.length,
                    itemBuilder: (context, index, eall) {
                      // ProductModel productModel =
                      //     ProductModel.fromJson(fetched.data());
                      // SliderModel sliderModel = SliderModel.fromMap(fetched.data());
                      // sliderModel.itemPriceWithDiscount == 0.0
                      //     ? sliderModel.prodPrice.toString()
                      //     : sliderModel.itemPriceWithDiscount.toString();

                      return GestureDetector(
                        onTap: () {
                          // Navigator.pushNamed(
                          //   context,
                          //   Routes.productDetails,
                          //   arguments: productModel,
                          // );
                        },
                        child: SizedBox(
                          width: ScreenSize.screenWidth!,
                          child: snapshot.data![index].itemImageUrl == null ||
                                  snapshot.data![index].itemImageUrl!.isEmpty
                              ? const Center(
                                  child: CustomLogo(size: 133),
                                )
                              : CachedNetworkImage(
                                  width: double.maxFinite,
                                  imageUrl: snapshot.data![index].itemImageUrl
                                      .toString(),
                                  fit: BoxFit.cover,
                                  placeholder: (context, url) {
                                    return const CustomProgressIndicator();
                                  },
                                  errorWidget: (context, url, error) {
                                    return const Center(
                                      child: CustomLogo(),
                                    );
                                  },
                                ),
                        ),
                      );
                    },
                  ),
                ),
                Positioned(
                  bottom: 10,
                  child: BuildIndicators(
                    itemIndex: snapshot.data!.length,
                    currentIndex: currentIndex,
                  ),
                ),
              ],
            ),
          );
        } else {
          return const CustomProgressIndicator();
        }
      },
    );
  }
}


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source