{
  "synthetic": true,
  "execution": "Teaching record only; no live integration tested",
  "slug": "third-party-widget-performance-budget",
  "group": "embed",
  "title": [
    "Price a widget’s loading cost before adding it",
    "新增组件前，先核对加载成本"
  ],
  "intro": [
    "A chat or review widget can look small while adding scripts, frames and main-thread work. Commission an isolated before/after comparison with a stated business benefit and a fallback. File size alone cannot tell a buyer whether interaction became slower.",
    "聊天或评价组件看着很小，却可能增加脚本、框架及主线程工作。采购前应做隔离前后对照，写清业务用途和回退；文件体积不能单独说明交互是否变慢。"
  ],
  "facts": [
    [
      "Google’s web.dev guidance describes third-party JavaScript costs including network requests and main-thread parsing/execution that can delay interaction.",
      "Google web.dev说明第三方JavaScript包含网络、解析及执行成本，可能延迟交互。",
      "https://web.dev/articles/optimizing-content-efficiency-loading-third-party-javascript"
    ]
  ],
  "columns": [
    [
      "Synthetic controlled observation",
      "Baseline → widget",
      "Review meaning"
    ],
    [
      "合成受控观察",
      "基线到组件版",
      "复核意义"
    ]
  ],
  "example": [
    [
      [
        "Transferred script bytes",
        "80 KB →260 KB",
        "+180 KB; compression/cache context required"
      ],
      [
        "传输脚本字节",
        "80KB到260KB",
        "增加180KB；须说明压缩与缓存"
      ]
    ],
    [
      [
        "Main-thread task duration in chosen trace",
        "120 ms →310 ms",
        "+190 ms in this sample; not an INP score"
      ],
      [
        "所选轨迹主线程任务耗时",
        "120ms到310ms",
        "本例增加190ms，不是INP分数"
      ]
    ],
    [
      [
        "Chosen project budget",
        "Additional script≤150 KB",
        "Example exceeds budget by 30 KB"
      ],
      [
        "本项目示例预算",
        "额外脚本不超150KB",
        "本例超30KB"
      ]
    ],
    [
      [
        "Widget fails to load",
        "Static contact link retained",
        "Business path remains available"
      ],
      [
        "组件加载失败",
        "保留静态联系链接",
        "商业路径仍可用"
      ]
    ]
  ],
  "steps": [
    [
      "Agree the task the widget solves, the owner and a synthetic or authorised isolated test page. Keep content, browser, network, cache state and device conditions comparable.",
      "约定组件用途、负责人及合成或获准隔离测试页，内容、浏览器、网络、缓存及设备条件保持可比。"
    ],
    [
      "Measure several runs with the widget enabled and disabled. Record distributions and trace evidence for loading and interaction; do not substitute a single Lighthouse score for all user experience.",
      "分别开关组件做多轮测量，记录加载及交互分布与轨迹，不能用一次Lighthouse分数代替全部体验。"
    ],
    [
      "Compare against the agreed budget and functional benefit. Evaluate supported delayed-loading or a click-to-load facade on the isolated page, including its accessibility and failure behaviour.",
      "对照预算及功能价值，在隔离页评估供应商支持的延迟或点击加载，并检查可访问性和失败路径。"
    ]
  ],
  "result": [
    "The filled arithmetic finds a 30 KB budget overrun, but it does not claim a 190 ms real-world regression or any effect on enquiries. The final procurement decision needs repeated comparable observations and functional evidence. A facade is a candidate design, not automatic permission to change a production page.",
    "填好的算例显示超预算30KB，但不声称真实用户慢了190毫秒或询盘受影响。采购决定须有多次可比观察及功能依据；点击加载只是候选设计，不自动批准修改生产页。"
  ],
  "accept": [
    "Require a reproducible setup, repeated measurements, business-function checks and a working failure path. If there is no reliable baseline, state performance impact unknown.",
    "须可复现设置、多次测量、功能核对及可用失败路径；没有可靠基线时明确影响未知。"
  ],
  "limit": [
    "All measurements and budgets here are synthetic. No production performance repair, homepage change, new tracker or third-party script was executed.",
    "这里测量及预算全部合成；没有执行生产性能修复、首页修改、新追踪或第三方脚本。"
  ]
}