store last view in memory

Hi everyone. In my application (v24), I have a view with a grid of item loaded with different criterias. Then when I click on an item I display another view
with item detail. I would like, when I return on the previous view, display the same information in the grid. Is there a simple solution to do this
without store the criterias and reload the grid.
Before I used a dialog instead of a view for the item details, and when I closed the dialog, I had the previous view behind and I haven’t to reload anything.
Can you Have an idea ? Thank you

I don’t know if there is a nicer way using the router or view serialization, but you could create a parent view that has both your grid view and item edit view added to it, and then switch their visibility with setVisible.
I’d also be interested in a better solution though.

Depends if you want to store the view state (which consumes memory) or recreate the view contents on navigation

Given the title, I think it’s the former

Right. That’s easy to do with Spring, as you can just mark a view as @UIScoped and it will keep the state as long as the browser tab is alive. I’d generally recommend against it, though, as it does consume memory as mentioned above. For the recreation, check Don't let deep linking code clutter your UI logic | Vaadin

Also this one: Try Vaadin 23.2 Beta for Improvements in View-to-View Navigation | Vaadin

@vital-koala But if I understand it correctly, even with @UIScope you need to recreate your components from that stored state

And the same with the Blog posts, just that the state is stored in the URL

That’s possible but not really the easiest solution, especially with a Grid, you need some javascript hacks even just to scroll back to the correct index

No, with @UIScope the server-side state is stored. It doesn’t necessarily reflect perfectly back in the client if there’s information that’s not transmitted to the server (such as focused element or scroll position)

I’m looking in the docs, and there the @UIScope just holds some string which is then applied back to the component/view when constructing it:
So in case of a grid, that’d mean you’d have to store whatever columns you’re displaying, the index where the grid is scrolled, the selected items and other required state to rebuild the view. All encoded either in the URL or in your UIScoped/RouteScoped object. Or do you mean you can just store the whole Grid component in that Scope?

You can store the whole view’s state in that Scope

It’s easier to see if you have a form with many fields in it, for example

But if you have a Grid, it should still know about the columns, the selection, etc.

That’s pretty cool :+1:

But, again, if you are not careful, you can end up eating a lot of memory like that

Also, generally speaking, @RouteScope is a better choice than @UIScope because the former is more explicit, but it’s conceptually a bit more difficult to grasp

Thank you for your help. So If for you @RouteScope is a better choice, have you example or link that help to implement it ?