在这个练习中，/slow-a 和 /slow-b 路由的 load 函数中都有人为的延迟，这意味着导航到它们需要很长时间。
¥In this exercise, the /slow-a and /slow-b routes both have artificial delays in their load functions, meaning it takes a long time to navigate to them.
你无法总是让数据加载得更快 - 有时它超出了你的控制范围 - 但 SvelteKit 可以通过预测它们来加快导航速度。当 <a> 元素具有 data-sveltekit-preload-data 属性时，SvelteKit 将在用户将鼠标悬停在链接上（在桌面上）或点击链接（在移动设备上）时立即开始导航。尝试将其添加到第一个链接：
¥You can’t always make your data load more quickly — sometimes it’s out of your control — but SvelteKit can speed up navigations by anticipating them. When an <a> element has a data-sveltekit-preload-data attribute, SvelteKit will begin the navigation as soon as the user hovers over the link (on desktop) or taps it (on mobile). Try adding it to the first link:
<nav>
<a href="/">home</a>
<a href="/slow-a" data-sveltekit-preload-data>slow-a</a>
<a href="/slow-b">slow-b</a>
</nav>导航到 /slow-a 现在会明显更快。在悬停或点击时开始导航（而不是等待注册 click 事件）听起来可能没有太大区别，但在实践中通常可以节省 200 毫秒或更多。这足以成为缓慢和敏捷之间的区别。
¥Navigating to /slow-a will now be noticeably faster. Starting navigation on hover or tap (rather than waiting for a click event to be registered) might not sound like it makes much difference, but in practice it typically saves 200ms or more. That’s enough to be the difference between sluggish and snappy.
你可以将属性放在单个链接上，也可以放在包含链接的任何元素上。默认项目模板在 <body> 元素上包含属性：
¥You can put the attribute on individual links, or on any element that contains links. The default project template includes the attribute on the <body> element:
<body data-sveltekit-preload-data>
%sveltekit.body%
</body>你可以通过为属性指定以下值之一来进一步自定义行为：
¥You can customise the behaviour further by specifying one of the following values for the attribute:
"hover"（默认，在移动设备上回退到"tap"）¥
"hover"(default, falls back to"tap"on mobile)"tap"— 仅在点击时开始预加载¥
"tap"— only begin preloading on tap"off"— 禁用预加载¥
"off"— disable preloading
使用 data-sveltekit-preload-data 有时可能会导致误报 - 即，在预期导航的情况下加载数据，但导航并没有发生 - 这可能是不可取的。作为替代方案，data-sveltekit-preload-code 允许你预加载给定路由所需的 JavaScript，而无需预加载其数据。此属性可以具有以下值：
¥Using data-sveltekit-preload-data may sometimes result in false positives - i.e. loading data in anticipation of a navigation that doesn’t then happen — which might be undesirable. As an alternative, data-sveltekit-preload-code allows you to preload the JavaScript needed by a given route without eagerly loading its data. This attribute can have the following values:
"eager"— 预加载导航后的页面上的所有内容¥
"eager"— preload everything on the page following a navigation"viewport"— 预加载视口中显示的所有内容¥
"viewport"— preload everything as it appears in the viewport"hover"（默认）如上所述¥
"hover"(default) as above"tap"— 如上所述¥
"tap"— as above"off"— 如上所述¥
"off"— as above
你还可以使用从 $app/navigation 导入的 preloadCode 和 preloadData 以编程方式启动预加载：
¥You can also initiate preloading programmatically with preloadCode and preloadData imported from $app/navigation:
import { preloadCode, preloadData } from '$app/navigation';
// preload the code and data needed to navigate to /foo
preloadData('/foo');
// preload the code needed to navigate to /bar, but not the data
preloadCode('/bar');<h1>home</h1>