How does the navigation work when using instant loading?

[bradumbaugh]

Just saw that you've added an instant loading feature to make Material for MkDocs behave more like a single page app. So cool.

I'm excited to give this a whirl, but quick question first: when I click a link in a doc's content, or an item in the left nav, does the left nav stay persistent (scroll position, nodes that are open, etc.)? Or does the left nav reload to its default state for the new destination?

Thanks!

[squidfunk]

Instant loading replaces designated parts of the site without reloading the whole page. The logic is rather "dumb", so it will just replace the sidebar HTML with the new HTML and rebind all downstream event listeners (implemented through RxJS observables), thus the scroll position is lost if the sidebar was scrolled before.

In theory, this could be mitigated with some extra JavaScript, but I haven't found the need to do so, yet.

[bradumbaugh]

OK, thanks, makes sense. Just for context, it can be a little disorienting on docs sites in general (not just Material for MkDocs) when the nav changes around (resets the scroll, changes open nodes, etc) when content loads. It's not a major issue though, was just curious how it works in this case.

Is this feature running on the Material for MkDocs site?

[squidfunk]

I agree that there's always room for improvement and content shift is always something I'm trying to minimize.

Instant loading is currently not activated in the official docs, but many people use it already.

[bradumbaugh]

Cool. Appreciate this tool, thanks for all your work on it!

[sebas-intellegens]

I ran into the same issue (I think)
Just to confirm, the sidebar jumping up (i.e. resetting/rerendering) is still expected behavior when scrolling down it and clicking on a link?

[squidfunk]

Yes. This is already solved in Insiders but not ready for release:

• Automatically position the left navigation to the current page #2155