I am creating a nextjs application and in that I have a very specific use case.
I have embedded an external website in my application using iframe.
The problem is when a user navigates away from that page (page containing the iframe), the entire DOM gets removed from the browser. This leads to high loading time when a user revisits that page.
Is there a way to create an exception so that the DOM persists event after navigating away from that page? Or is there a better way to use iframe so that it can also make use of server-side rendering?
As far as I know, by default, when you navigate away from a page in a Next.js app, the entire DOM for that page is indeed removed, including any iframes. This is part of Next.js’s client-side routing behavior.
You could us keepAlive for the <Link> component . This can help maintain the state of a component even when navigating away from it. However, this is primarily designed for React components and may not work as expected with iframes.