Image asset loading fundamentally broken

[palm.devi...@gmail.com]

I have noticed a problem where image asset loading is too slow to be useable.

In this simple example (below) when the image is loaded you can see an initial screen and then the image asset loads and appears on the screen.

I was expecting to see everything drawn in one go rather than seeing the asset being loaded

  Widget build(BuildContext context) {
    return Scaffold(
      body: Stack(
        children: [
          Positioned.fill(child: Image.asset(imagePaths[6], fit: BoxFit.cover)),
        ]
    )
    );
  }

When i run this I see a white screen and then see each asset load, the assets are small images, so size is not the issue

Any idea what i can do to make these images load faster? 

Even in release build its loading the asset so slow the user can see it load

[Eric Seidel]

Would you be willing to file a bug with more information?  flutter.io/support

Details such as

- What image is being loaded

- What phone

- What Flutter version

Could help someone to reproduce what you're seeing and hopefully fix the problem.

Thank you!

--
You received this message because you are subscribed to the Google Groups "Flutter Dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to flutter-dev...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[palm.devi...@gmail.com]

It's more of a general observation of how Flutter works which is why i kept the example simple.

It happens with all images large and small and all phones i tested on, so i think the behaviour is intentional.

Maybe because I am declaring Image.asset(imagePaths[6] in the building of the widget, this is when it will choose to load the asset
I'm trying to make it work so that when the screen appears for the first time the images are already there.

I tried to use precacheImage but didn't really understand how that works.

For instance if I have this code..

for (int index = 0; index < imagePaths.length; index++) {
 precacheImage(AssetImage(imagePaths[index]), context)
 .then((result) {
 print('$result');
 });

..to preload the assets, the result returned in then function is null, while I was expecting it to return a cached image object, but it actually returns null

What is the recommended way to preload images so that they are available and ready to draw when the build method is called?

[Eric Seidel]

Ah yes.  So Flutter does use web-like incremental image loading, as opposed to delaying the first paint until an image is fully loaded.

It's possible to do the latter.  So I guess what you're asking for is an example of loading images and delaying the app doing anything until they're fully loaded to draw?

Still seems worth filing a bug requesting such if possible.

--