at the moment i'm trying to load images from google firebase. To load image and show them in my app worked. But I found out that the images will be loaing very slow.

I need about 3 seconds to display a simple network picture. My internet has a good connection.

Here my code where i loading the image:

child: FutureBuilder<dynamic>(
            future: loadImages(), // async work
            builder: (BuildContext context, AsyncSnapshot<dynamic> snapshot) {
              switch (snapshot.connectionState) {
                case ConnectionState.waiting:
                  return Text('Loading....');
                default:
                  if (snapshot.hasError)
                    return Text('Error: ${snapshot.error}');
                  else
                    return Image.network(snapshot.data);
              }
            },
          ),
        ),
      ),

Future loadImages() async {
  Reference ref = FirebaseStorage.instance
      .ref()
      .child("images/product/product_images/")
      .child('productImage_1631118157638_KuymkIGLXUTl0nMw8RENcdEqXUo2');

  return await ref.getDownloadURL();
}

The code just display one image from my firebase storage.

Here a example image:

My question:

It's possible to load faster a image from firebase storage or has firebase a limit of time to load image? And why is my image loading so slow but in other app not (DeviantArt)? Have you any idea how i can solve this question?

Many thx (:

CodePudding user response：

I answered similar questions here Getting download URLs from FirebaseStorage and here Firebase Storage Flutter Displaying images takes too long to load.

In your current solution, your code has to first ping the storage bucket, verify security rules, and then return the download URL to the client which you can then use to download and render the image. This overhead can be removed altogether by storing the downloadURL in your db (such as a Firestore document) and rendering directly from there, which is common practice.

Your images are pretty small, so the payload size shouldn't be much of an issue.

Other factors that could be causing slow download time is the location of your storage bucket in relation to the end user, so you may want to consider moving the location of the storage bucket or using a CDN that can host your images in a geographic location close to where your app users are.

Another option would be to download and cache your images ahead of time so you can render them as soon as requested by the user.

The reason why other apps appear to render their images faster is because they use a combination of compression, caching, CDNs, among other techniques.