Persistent / Global Components

[TheAlexLichter]

Is your feature request related to a problem? Please describe.

As an educator, I want to show a demo of a running script, e.g. a 3D Scene rendered via TresJS throughout my slides.
The scene should not reload when slides are switched and instead stay the same (or, if I control it via props, even do something else).

Same could be applied to iframes that are shown in a 2-column layout during a presentation.

Originally, @toddeTV hit this issue when creating slides around 3D and Vue.

Describe the solution you'd like

It would be great to have a way to keep these components alive somehow, so they do not re-render when the slides are changed.

Describe alternatives you've considered

• Teleports + global-top.vue - doesn't work, no matter if deferred or not. Maybe a pattern from https://github.com/marchantweb/nuxt-adaptive-teleport could be applied but would still cause issues with TresJS/3D content.
• global-top.vue w/o teleports - works for all types of content but is even hackier 😂
• layouts -> same problem!

Related

(Somewhat) #2041