Recycler view equivalent

Hey guys,

We are building an App that loads news articles all at once. After it’s loaded we place it in a stackpanel, but then the memory overflows because the views are loaded even when not visible. How can we use a recycler view or listview that handles this problem?

In the documentation I found this: “At the root levels of your App, each element is only instantiated (created) once for the entire lifetime of the app. However, there are special UX nodes such as Each and attributes like ux:Template which can create multiple instances, lazy-instantiate and recycle components as appropriate.”

When I search for ux:Template in the documentation I find nothing. By the way, maybe you should make your documentation a bit more detailed.



I would like to see an answer to this as well



There is no such feature in the current version of Fuse (0.21), but it is a problem we have been doing a lot of research on.

From the user perspective it will likely be a simple switch on the Each tag to set a maximum number of live instances at any given time and it will automatically recycle based on prediction of what will be in view. However, API might change after we’ve attempted to implement it.

The only mechanism in Fuse that does some form of view recycling right now is the Navigator which (might) disposes views no longer in use.

Sorry for the wait - hence the beta tag :slight_smile:

BUMP - Is this implemented yet?

Hi Matt,

I was also curious about this, as I have an app with many, many images, where I expect the same problems.

Hi guys,

I can confirm that this is being worked on as we speak :slight_smile: No promises on release date, though, but as you can see we are pushing out releases every few weeks.

Hi guys,

Not 100% automatic yet, but from 0.26 you have the following features to play around with:

  • Adding and removing elements from an Observable mapped to a scrolling list will retain the scrollview’s visual position (not jump around). This means you can manually recycle views by adding more elements to the end of a list while removing from the beginning, or vice versa. This will effectively give you view recycling (and in the future, Each will be smarter so it actually reuses instances too).
  • Use the <Scrolled To="... trigger to know when to load more data.
  • Use the <Deferred> tag to spread initialization of views over multiple frames to avoid init stalls
  • Use the <WhileBusy> trigger to choose what happens while a view is not ready (e.g. outstanding Deferred initializations).

To use the new layout mode for ScrollView specifiy <ScrollView LayoutMode="PreserveVisual">. It is planned that this will become the default mode, but at the moment, for backwards compatibility reasons, it isn’t yet.

This is awesome, I’m still confused on how to use the new Scrolled class, could you guys some example code in the docs, I don’t understand what the ScrolledWhere type of To is. I would love some real world examples of Scrolled and WhileScrolled

@Edwin maybe this little pal over here might help, at least with Scrolled:

I’ll do my best to add self-explanatory comments to whenever applicable a bit later, but I just had to push it out as-is.

A video tutorial on the topic is in the pipeline. Recorded today, just needs some editing :slight_smile: keep an eye on twitter.

Here’s the video that Anders mentioned: