Creating dynamic route for chat app

I have built an almost amazing chat app, the problem however, is that each time i click a user to chat with using this route
var routes = [
{
path: ‘/’,
url: ‘./index.html’,
},
{
path: ‘/chat/:name/:id/:userid/:phone/:pix/:email’,
url: ‘./pages/chat.html’,
}

i have to load an ajax content of old chats. This means that i also have to load this everytime a user clicks a similar link.
What i want is that the page should be created dynamically and ready for use the next time the page is visited. I want old chats to remain so its available when user has not closed the app.

how do i go about this.
right now the page is refetch for every click instead of just visiting the page once its been visited before.

I dont know if am making any sense. please help

You need to use a router component instead of plain html page Router Component | Framework7 Documentation and keep the logic in that page component, where you can also cache initial request, e.g. in some local or global variable, or use store Store | Framework7 Documentation