Currently, I have a javascript application that heavily relies on jquery. It's not the most visually appealing, difficult to maintain, and definitely in need of a framework upgrade. That's why I'm in the process of migrating it to be compatible with Angular 2.
In my new Angular 2 setup, I have created two routes:
Route A: Features a component with a WebGL canvas Route B: Displays different data using another component
The challenge arises when the initialization of the webgl component takes longer than expected based on the user's device.
After navigating from Route A to Route B, and then back to Route A, Angular 2 keeps recreating and re-initializing the WebGL component... Ideally, I would like to reuse the existing component to prevent this unnecessary duplication.
Back in the jquery days, I could simply hide and show the canvas as needed.
My query is quite similar to this one:
Angular 2 keep route alive even when not navigated to it
However, the proposed solution of using CanReuse doesn't seem to work for me. This issue was highlighted here:
routerCanReuse and routerOnReuse is not called when route changes
As these methods are specifically meant for handling transitions between components of the same type.