Images not loading ... memory cache issue? Try disk caching? about nukeui HOT 10 CLOSED

Hi,

Could you please provide a sample where I could reproduce it? I think it might have to do with the SwiftUI view lifecycle.

By default, Nuke uses HTTP cache. If it's not configured on the server side, it's not going to work. You can also switch to aggressive disk caching if you'd like. More info here : https://kean.blog/nuke/guides/caching

from nukeui.

I’ll have to pull together the data manually since I’m using CloudKit. To test with aggressive disk caching, can I simply pass this to the pipeline modifier of LazyImage?

ImagePipeline { $0.dataCache = try? DataCache(name: "com.myapp.datacache") }

would be great if you had a simple example.

from nukeui.

It's best to instantiate it this following way and you can also change a shared pipeline if that's what you want:

ImagePipeline.shared = ImagePipeline(configuration: .withDataCache)

It completely disables HTTP cache.

from nukeui.

It's best to instantiate it this following way and you can also change a shared pipeline if that's what you want:

ImagePipeline.shared = ImagePipeline(configuration: .withDataCache)

It completely disables HTTP cache.

Hi @kean,

Thank you for the details. I've added ImagePipeline.shared = ImagePipeline(configuration: .withDataCache) to the didFinishLaunchingWithOptions to configure it globally; however, the images are still not loading for all instances.

I'll have to try to whip up a sample app. Is there another way to setup the ImagePipeline rather than in the App delegate that might be better?

Thank you.

from nukeui.

Is there another way to setup the ImagePipeline rather than in the App delegate that might be better?

You can do it any way you'd like. The UI components support passing a custom pipeline. So if you want to create a local pipeline instead of using a shared one, you can do that. For example:

LazyImage(source: url)
    .pipeline(yourCustomPipeline)

from nukeui.

Ok, I tried using the shared in the app delegate, and by adding it to the LazyImage(source: url) directly to no avail. I'm not really doing anything special. I have a list populated from an NSFetchRequest, using:

List {
                    ForEach(filteredListings, id:\.self) { listing in
                        LargeListItem(listing: listing, pipeline: pipeline)
                            .listRowSeparator(.hidden)
                    }
            }

I'll see if I can reproduce this with a barebones project and images statically defined in a class. Have you tested with very large lists?

from nukeui.

Ok, I whipped up a minimal reproducible project to test with. I am also noticing in the sample project that the image overlap issue occurs more frequently. Please see attached.
ListImageIssue.zip

from nukeui.

Just an update on the issue on my end:

I added some trace statements and found that the images that fail to load do not have their corresponding onAppear method called in the LazyImage.swift definition. The images that do appear, naturally, have the order of (ImageRequest created)->(onAppear called)->(model.load called)->(ImageResponse etc.)

For the sake of testing with newer threading in Swift 5.5, I tried using task on the ZStack rather than onAppear(perform:, to no avail (it's literally exhibiting the same behavior as onAppear):

            .task{ 
                onAppear()
            }

I've also tried removing the ZStack that wraps the content, which also doesn't seem to have any impact. It might be worth noting, I am seeing similar behavior with the same project I attached using AsyncImage, so I wonder if this is a bad bug in SwiftUI, which maybe you can help report with FeedbackAssistant. I also tested the task on the LazyImage(source:) in the code attached "ListImageIssue.zip", and the task does not get called for the List items that do not display the images.

So it seems this might be a bug in SwiftUI itself. I'm testing this same code with AsyncImage, and it looks like images are also struggling to load; however, the tasks do get called for the images that fail to appear. I am attaching the AsyncImage
ListImageIssueAsyncImage.zip
project here if you want to take a look. Interestingly, the images that fail to load with the AsyncImage type, are failing because they are canceled, so I am curious if there is a related issue.

from nukeui.

Have you tested with very large lists?

I tested it quite extensively in the Nuke Demo. This code is also used by at least a few apps and it seems to be working ok, at least in the common scenarios.

Thanks for sharing the sample. I looked into it and there seems to be something wrong with the layout – the frames of the views are overlapping. I think that might be causing the issue. I would suggest looking into the layout.

.frame(minHeight: mediaHeight, maxHeight: mediaHeight, alignment: .center)

This in particular doesn't seem right. I would suggest specifying hard frame sizes and trying a different alignment mode.

from nukeui.

Please try with the latest Nuke and NukeUI versions. There were a couple of related fixes.

I'm going close it because I believe it has to do with the layout issues pointed out earlier and the same issue applies to AsyncImage.

from nukeui.