images not unloading from memory?

I’ve got a feeling that images loaded from http & <ImageFill Url="{url}" /> are not unloaded from memory after the url is changed or the imaged is no longer on screen/needed… my app always crashes around 50/60 images

Demo CountPages alpha

Here is the demo app:

			var Observable = require('FuseJS/Observable');
			preURL = Observable("");
			imgURL = Observable("");
			nxtURL = Observable("");
			pictureLoaded = Observable("");

			imgURLno = 1920;
			nxtURLno = 0;
			preURLno = 0;
			loadSum = 2;

			setInterval(function() {
				loadSum = loadSum + 1
				imgURLno = imgURLno + 1; nxtURLno = imgURLno + 1; preURLno = imgURLno - 1;
		  		imgURL.value = ""+imgURLno+"/?random"
		  		nxtURL.value = ""+nxtURLno+"/?random"
		  		preURL.value = ""+preURLno+"/?random"
		  		pictureLoaded.value = "total photos in memory "+loadSum+" ?";
			}, 5000); // width="1080" height="1921" ios img //url...

			module.exports = {
				preURL : preURL, imgURL : imgURL, nxtURL : nxtURL, pictureLoaded : pictureLoaded

		<Text Alignment="TopCenter" FontSize="17" Value="main photo" Margin="0,80,0,0"/>
		<Rectangle Width="170" Height="200" Alignment="Top" Margin="0,100,0,0">
				<ImageFill Url="{imgURL}" StretchMode="UniformToFill" MemoryPolicy="UnloadUnused" />

	 	<Text Alignment="TopCenter" FontSize="17" Value="pre photo" Margin="0,380,200,0" Opacity="1"/>
		<Rectangle Width="70" Height="100" Alignment="Top" Margin="0,400,200,0">
				<ImageFill Url="{preURL}" StretchMode="UniformToFill" MemoryPolicy="UnloadUnused" />

	 	<Text Alignment="TopCenter" FontSize="17" Value="next photo" Margin="0,380,-200,0" Opacity="1"/>
		<Rectangle Width="70" Height="100" Alignment="Top" Margin="0,400,-200,0">
				<ImageFill Url="{nxtURL}" StretchMode="UniformToFill" MemoryPolicy="UnloadUnused" />

		<Panel Height="10%" Color="#0008" Alignment="Bottom">
			<Text Alignment="Center" FontSize="17" Value="{pictureLoaded}" Color="#fff"/>

how do i unload the images?

I got this bug too :frowning:

The MemoryPolicy='UnloadUnused' waits 60s before it unloads resources. This is also a lower-limit, it uses a staggering algorithm so you might have more in memory for a while. If you are replacing images very often you’ll likely need to lower this. You can create new policies of your own:

<MemoryPolicy ux:Global="MyUnload" UnloadInBackgroud="true" UnusedTimeout="5" UnpinInvisible="true"/>

That’s the same asUnloadUnused but with a lower timeout.

@edA-qa mort-ora-y

hi even with <MemoryPolicy ux:Global="MyUnload" UnloadInBackground="true" UnusedTimeout="0.5" UnpinInvisible="true"/> it crashes

are you also using the MyUnload (or whatever you named yours) MemoryPolicy? Here is an example on how to apply it to an image. Simply creating a MemoryPolicy won’t do anything until it’s used.

Hi Jake yes I’m using the myunload on the img memorypolicy

Sorry that it doesn’t work. I’ll have to take a look at the mechanism and figure out what may be going wrong.

I’m having a problem reproducing the issue in the general case. I see a minor leak over hundreds of images, but nothing that could explain a rapid crash.

I’ll attempt to look directly at your example now.

I found a problem with how memory is being handled. Somehow the images are being freed, but there is still memory lingering somewhere. On iOS this memory is not part of the actual app’s memory, yet somehow counting against it anyway, and not being freed.

The defect is in how ImageFill.WrapMode="Repeat" works. Since you don’t need this, as your images are stretched, you can do WrapMode="ClampToEdge" as a workaround. That appears to fix the memory issue.

We’ll get a proper fix into an upcoming version.

The upcoming release should include a fix for this memory leak. I tested it on my iPhone let it run to 950 images without issue.

So further performance fixes to ImageFill will also come in a subsequent version.

Great thanks for the work :smiley: