01 / 应用
一个信号。多种用途。
// 分析
意图,而不只是点击
记录放弃的靠近与犹豫,而不只是动作。
// 揭示
渐进式揭示
用户一朝某处移动,就打开预览或提示框。
// 性能
预取链接
在用户点击前预取导航链接。
// 自适应 UI
辅助瞄准
在用户靠近目标时放大目标或将其移近。
01
01
测量
带噪声的轨迹
02
02
估计
可能的目的地
03
03
准备
在到达之前
02 / 在线演示
移向一张卡片——看它如何被预取。
importance
cost
onIntent 数据流0 次触发
// 移向一张卡片以触发信号…
product shot
女装
product shot
男装
product shot
童装
product shot
鞋履
product shot
箱包
product shot
配饰
product shot
运动
product shot
牛仔
product shot
外套
product shot
美妆
product shot
家居
product shot
特卖
product shot
电子产品
product shot
手表
product shot
珠宝
product shot
家具
product shot
礼品
product shot
旅行
03 / 感受差异
同样的点击。无需等待。
一个页面等待网络请求,另一个则在用户移动轨迹期间被获取。
本次会话节省的时间
0 ms
/product/quilted-jacket
/product/quilted-jacket
04 / 与众不同
不是可见性,不是悬停,而是意图。
其他方法要么太晚,要么浪费资源。
1.37
Fetch:Click 比率
useIntentTarget
构建自定义组件
React · Next
适用于最流行的框架
MIT
开源,不收集数据
| 方案 | intent-link | ForesightJS | instant.page | Next.js prefetch | Guess.js |
|---|---|---|---|---|---|
| 时机 | 到达之前 | 沿轨迹 | 悬停时 | 进入视口时 | 预先计算 |
| 选择性 | 目的地 | 目的地 | 一个 | 所有可见项 | 最佳猜测 |