SuperAPI AI 工具集

fast-link

前端与建站

查看项目

更新于 10-19 21:00

技能介绍

Fast Link 是一款以提前导航为目标的链接加速方案,它把符合条件的主鼠标按下(pointerdown)作为导航触发点,而不是等待完整的点击(click)事件。由于页面跳转更早开始,用户在松开鼠标前就有可能进入目标页面,从而获得更快的响应感。

用途方面,Fast Link 适用于那些「按下即视为确认」的普通站内链接导航场景,主要面向 Next.js 与 React 项目。官方提供 @fast-link/next、@fast-link/react 等包,可用于集成、迁移、排障与代码审查等任务。它并不替代浏览器或框架的原生激活逻辑,而是围绕指针按下时机做增强。

主要能力包括:对区域内符合条件的链接统一启用提前导航;支持按链接设置单独选项;支持 data-no-fast-link 在锚点或其按下起点后代上退出提前导航;支持用 enabled={false} 禁用某个区域对其普通链接的处理;支持配置导航区域、守卫、基础路径与路由器归属等。它同时明确划定了不加速的范围:触摸、触控笔、键盘激活、带修饰键的点击、下载、外部 URL、非 _self 目标、纯哈希链接,以及嵌套控件上的按下,都保持正常路径。确认、购买、破坏性操作、表单以及拖拽收藏行为敏感的链接,也应保留原生交互。

使用方式上,建议先检查相关包的 manifest、锁文件条目、链接组件、路由配置与处理器,确认所选包的公开导出、peer 依赖与运行时要求,并以实际安装版本为准。随后沿别名、导出桶与共享包追踪目标链接到实际渲染的锚点与处理器,找出已有的 Fast Link 组件、区域、hook 与策略,优先复用已有集成而不是重复添加。Next.js 目标应先阅读其 Next.js 集成说明再选择导入;普通 DOM 或其他 React 消费者则应先阅读 Core 与 React 适配器文档,再在 createFastLink 与 useFastLink 之间选择。自定义 React 适配器需要把 ref 与 onClickCapture 两个绑定转发到同一个 DOM 元素,并把调用方的捕获处理器传入 hook、将其绑定最后展开。

适用场景主要是同源、可提前提交的站内导航;即使 URL 同源,也不能仅凭来源判断路由器归属。实施前应明确导入路径、Fast Link 原语、路由归属与必要的退出项,并用源码证据解释选择;对契约不明的链接保持原生行为。验证时应覆盖鼠标导航在按下时开始且后续点击不重复导航、键盘与修饰激活保持正常、守卫与退出及禁用链接在区域内仍有效、历史与滚动和基础路径符合要求、自定义 ref 与控制器在选项变更和卸载时正确清理等;有条件时应在真实应用中检查关键导航,因为仅靠 mock 路由测试不足以证明生产路由行为。