Expose sidebar hover preload functionality?

[markH5]

I've noticed that the rspack-doc website's sidebar has a hover preload feature, I think this improves the UX.
I'm wondering if there are any plans to expose this functionality in Rspress?

It would be even better if hover preload could be provided for the "Previous Page" and "Next Page" navigation links as well.

In any case, thank you for your excellent work on this project!

[Timeless0911]

It is implemented by the matchRoutes api provided in @remix-run/router, see

rspress/packages/theme-default/src/components/Sidebar/utils.ts

Lines 45 to 51 in 1f8078a

	export const preloadLink = (link: string) => {
	const match = matchRoutes(routes, link);
	if (match?.length) {
	const { route } = match[0];
	route.preload();
	}
	};

.

[Timeless0911]

It would be even better if hover preload could be provided for the "Previous Page" and "Next Page" navigation links as well.

Awesome idea. Are you interested in implementing this feature?

[markH5]

in my PC, it looks as expected. (nodejs v23.7.0 pnpm 10.2.0)

I just haven't tested whether it works properly under node 18 as suggested in CONTRIBUTING. There are always problems installing pnpm with corepack.

// packages/theme-default/src/components/PrevNextPage/index.tsx
import { Link } from '@theme';
import { useLocaleSiteData } from '../../logic';
import styles from './index.module.scss';
import { preloadLink } from '../Sidebar/utils';

interface PrevNextPageProps {
    type: 'prev' | 'next';
    text: string;
    href: string;
}

export function PrevNextPage(props: PrevNextPageProps) {
    const { type, text, href } = props;
    const { prevPageText = 'Previous Page', nextPageText = 'Next Page' } = useLocaleSiteData();
    const pageText = type === 'prev' ? prevPageText : nextPageText;
    const linkClassName = type === 'prev' ? styles.pagerLink : `${styles.pagerLink} ${styles.next}`;
   
    return (
        <Link href={href} className={linkClassName} onMouseEnter={() => preloadLink(href)}>
            <span className={styles.desc}>{pageText}</span>
            <span className={styles.title}>{text}</span>
        </Link>
    );
}

[Timeless0911]

It’s okay, you can directly submit a PR.