乐观反馈

尚无可操作样本；插图为编辑示意。产品中仍需验证真实失败率是否足够低以支撑乐观展示、回滚文案与重试路径在各类错误下是否清楚、乐观标记对读屏用户是否可感知，以及在弱网或高延迟环境下乐观与真实状态收敛是否会造成闪烁或不一致。

{
  "states": [
    "idle",
    "optimistic",
    "confirmed",
    "rolled-back"
  ],
  "a11y": [
    "乐观状态与确认后状态的差异不能只靠颜色表达，需辅以文字或图案标记",
    "回滚发生时应通过实时区域播报失败原因，不应静默移除内容"
  ],
  "motion": "乐观内容以轻微淡入或直接出现呈现，避免夸张动效；启用减少动态效果时直接出现，回滚同样直接呈现而非快速闪烁"
}

{
  "id": "optimistic-feedback",
  "type": "micro",
  "name": {
    "zh": "乐观反馈",
    "en": "Optimistic Feedback"
  },
  "aliases": [
    "Optimistic UI",
    "Optimistic Update",
    "乐观更新"
  ],
  "granularity": "state",
  "intents": [
    "inform",
    "reduce-interruption"
  ],
  "tags": [
    "乐观更新",
    "即时反馈",
    "回滚",
    "感知性能",
    "预期结果"
  ],
  "definition": "在服务器确认之前，界面立即呈现操作预期会成功的结果；请求返回后再与实际结果对齐，若失败则回滚到之前状态并给出清楚的说明与重试路径。",
  "boundary": "乐观反馈呈现的是尚未确认的预期结果，不同于骨架屏或不确定进度指示——那些承认自己在等待、不冒充结果；也不同于状态消息——状态消息只报告已经发生的真实结果，而乐观反馈是在结果发生之前先行展示。它用对不确定性的诚实换取感知速度，因此只适合失败率低、恢复代价小的操作。",
  "signature": [
    "点击或提交后，界面在没有网络往返延迟的情况下立即显示预期的成功状态",
    "该状态在视觉上标记为尚未确认（例如虚线轮廓或小型进行中标记），与已确认内容可区分",
    "请求返回后无缝收敛为真实结果，或在失败时明确回滚并说明原因与重试方式"
  ],
  "when": [
    "操作失败率很低，且失败后可以安全地撤销或重试",
    "感知速度对该交互很重要，等待服务器确认会打断操作的连续感",
    "失败后的恢复代价很小，用户不会因短暂的错误呈现而受到实质损失"
  ],
  "when_not": [
    "操作不可逆、涉及资金或具有法律后果，错误的乐观展示可能造成真实损失",
    "失败率较高或结果高度不确定，冒充成功会反复误导用户",
    "用户需要如实看到系统正在等待或处理，而不是被暗示已经完成（此时骨架屏或进度指示更合适）"
  ],
  "tradeoff": "乐观反馈让界面显得即时响应，避免用户在等待中失去操作的连续感；但它牺牲了对不确定性的如实呈现，一旦请求失败且回滚处理不清楚，用户会对界面的可信度产生怀疑。",
  "comparison": {
    "focus": "让用户在请求完成前就感受到操作已经生效，以维持交互的连续性",
    "mechanism": "本地立即渲染预期结果，请求返回后与真实结果对齐，失败则回滚并提示",
    "cost": "需要为每一类操作单独设计回滚路径与失败文案，否则冒充的确定性会在出错时反噬信任"
  },
  "sources": [
    {
      "id": "nng-response-times",
      "title": "Nielsen Norman Group · Response Times: The 3 Important Limits",
      "url": "https://www.nngroup.com/articles/response-times-3-important-limits/",
      "claim": "0.1 秒是让用户感觉系统即时反应的上限，此时除了直接显示结果外不需要额外反馈；超过约 1 秒，用户会察觉延迟并失去操作的连续感，这是乐观反馈试图掩盖的等待窗口。",
      "checkedAt": "2026-09-15",
      "archive": {
        "lookupUrl": "https://web.archive.org/web/20260915*/https://www.nngroup.com/articles/response-times-3-important-limits/",
        "status": "available",
        "checkedAt": "2026-09-16T03:50:36.309Z",
        "jobId": "spn2-a445b35eeb0d266caa0107c5f3694ef90bec60e8",
        "url": "https://web.archive.org/web/20260916035201/https://www.nngroup.com/articles/response-times-3-important-limits/",
        "timestamp": "20260916035201"
      }
    },
    {
      "id": "nng-progress-indicators",
      "title": "Nielsen Norman Group · Progress Indicators Make a Slow System Less Insufferable",
      "url": "https://www.nngroup.com/articles/progress-indicators/",
      "claim": "文章主张对等待时间保持坦诚透明以降低用户的不确定感，并明确反对用花招掩盖延迟或伪装系统比实际更快；这构成了乐观反馈必须谨慎使用、且失败时必须如实回滚说明的依据。",
      "checkedAt": "2026-09-15",
      "archive": {
        "lookupUrl": "https://web.archive.org/web/20260915*/https://www.nngroup.com/articles/progress-indicators/",
        "status": "available",
        "checkedAt": "2026-09-16T05:46:58.176Z",
        "jobId": "spn2-9f1cb6ee0ec1afcc2efcbc9c16a74dd503faf511",
        "url": "https://web.archive.org/web/20260916054722/https://www.nngroup.com/articles/progress-indicators/",
        "timestamp": "20260916054722"
      }
    },
    {
      "id": "react-use-optimistic",
      "title": "React · useOptimistic",
      "url": "https://react.dev/reference/react/useOptimistic",
      "claim": "useOptimistic 在异步操作完成前立即渲染预期状态，操作成功后该乐观状态与真实状态在同一次渲染中收敛；若操作失败，界面会自动回退到失败前的真实状态，属于技术层面对乐观更新与失败回滚机制的权威定义。",
      "checkedAt": "2026-09-15",
      "archive": {
        "lookupUrl": "https://web.archive.org/web/20260915*/https://react.dev/reference/react/useOptimistic",
        "status": "pending",
        "checkedAt": "2026-09-16T04:00:57.443Z",
        "error": "status-request-failed",
        "jobId": "spn2-e5a7f1fe895c3929e49237c7b13c849c95220ebb"
      }
    }
  ],
  "relations": [
    {
      "target": "status-message",
      "kind": "composes_with",
      "condition": "请求最终返回确认或失败结果",
      "reason": "乐观反馈先展示预期结果，真实结果确认或失败后再由状态消息补充报告，两者衔接才能让用户始终知道当前状态的真实性。",
      "basis": "editorial"
    },
    {
      "target": "determinate-progress",
      "kind": "alternative",
      "condition": "任务是否值得为了速度感而冒充尚未确认的结果",
      "reason": "确定进度条如实呈现正在进行且尚未完成的过程；乐观反馈则直接展示预期已完成的结果，二者是对同一等待问题的两种相反回答。",
      "basis": "editorial"
    },
    {
      "target": "error-prevention",
      "kind": "conflicts_when",
      "condition": "操作不可逆、代价高或需要谨慎确认",
      "reason": "错误预防原则要求在结果不确定时避免让用户承担后果；乐观反馈先斩后奏地展示成功，与需要提前拦截错误的场景相冲突。",
      "basis": "editorial"
    },
    {
      "target": "skeleton",
      "kind": "alternative",
      "condition": "是否愿意让界面承认自己仍在等待内容",
      "reason": "骨架屏诚实地展示尚未加载的占位结构；乐观反馈则跳过等待感，直接展示预期内容，二者对不确定性的处理方式相反。",
      "basis": "editorial"
    }
  ],
  "rules": [
    {
      "when": "决定是否对某个操作使用乐观反馈",
      "instruction": "只在该操作失败率很低、且失败后可撤销或重试代价很小时使用；不得用于不可逆、涉及资金或法律后果的操作。",
      "strength": "must",
      "basis": "editorial"
    },
    {
      "when": "乐观展示的操作最终请求失败",
      "instruction": "必须把界面明确回滚到失败前的状态，并给出简明的失败说明与重试路径，不能悄悄丢弃或留下不一致的界面状态。",
      "strength": "must",
      "basis": "editorial"
    },
    {
      "when": "设计乐观状态的视觉呈现",
      "instruction": "让尚未确认的乐观内容在视觉上与已确认内容保持可区分（如轮廓、透明度或小型进行中标记），避免用户误以为结果已经最终确定。",
      "strength": "recommend",
      "basis": "editorial"
    }
  ],
  "requirements": [],
  "behavior": {
    "states": [
      "idle",
      "optimistic",
      "confirmed",
      "rolled-back"
    ],
    "a11y": [
      "乐观状态与确认后状态的差异不能只靠颜色表达，需辅以文字或图案标记",
      "回滚发生时应通过实时区域播报失败原因，不应静默移除内容"
    ],
    "motion": "乐观内容以轻微淡入或直接出现呈现，避免夸张动效；启用减少动态效果时直接出现，回滚同样直接呈现而非快速闪烁"
  },
  "demo": null,
  "version": "0.1.0",
  "editorialStatus": "drafted",
  "demoCapabilities": [],
  "implementationNote": "尚无可操作样本；插图为编辑示意。产品中仍需验证真实失败率是否足够低以支撑乐观展示、回滚文案与重试路径在各类错误下是否清楚、乐观标记对读屏用户是否可感知，以及在弱网或高延迟环境下乐观与真实状态收敛是否会造成闪烁或不一致。",
  "image": {
    "src": "/images/optimistic-feedback.webp",
    "alt": "虚构的 FIELDNOTES 列表中，一条刚添加的新条目已经出现在应有位置，带有淡淡的虚线轮廓和一个小型进行中圆点，列表其余部分保持实线、正常显示。"
  },
  "searchTerms": [
    "optimistic update",
    "immediate feedback",
    "rollback",
    "perceived performance",
    "optimistic"
  ]
}