replica

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

stardust:replica — same-design migration

stardust:replica — 同设计迁移

Same pages, same content, same design — new platform.
replica
migrates a site to AEM Edge Delivery (or just re-platforms its front end) keeping the current design near pixel-perfect: the target spec IS the captured current state, the only permitted deltas are the entries of an explicit inconsistency register, and every archetype must pass a measured source-fidelity gate against the live site before anything ships.
Two properties make this a different animal from the redesign pipeline:
  1. No creative decisions. The direction step is mechanical promotion of the captured spec —
    stardust:direct
    is never invoked. Every judgment call in a replica run is a measurement-policy call, not a taste call.
  2. Recreation, not copying. Archetypes are authored as clean semantic HTML/CSS from captured content + values lifted from the source site's own CSS — never DOM copies, never ported page-level stylesheets. Fidelity is proven by instruments, not asserted by construction.
Validated end-to-end (aesop.com home, 2026-07-03): 8.31% → 2.93% → 1.31% pixel diff in 3 measured iterations, height Δ 0, content-diff "findings: none" (198/198 nodes). Every fix came off the instruments, never off eyeballing.
页面相同、内容相同、设计相同——仅更换平台。
replica
可将网站迁移至AEM Edge Delivery(或仅重构其前端),同时保持当前设计接近像素级完美:目标规范即为捕获的当前状态,唯一允许的差异需记录在明确的不一致性登记册中,且所有原型在发布前必须通过针对线上站点的可量化源保真度校验门
本流程与重新设计流水线有两大核心区别:
  1. 无创意决策。方向环节仅为对捕获规范的机械推广——绝不调用
    stardust:direct
    replica
    流程中的所有判断均为测量策略决策,而非审美决策。
  2. 重写而非复制。原型基于捕获的内容及从源站点自身CSS提取的值,以语义化纯净HTML/CSS编写——绝不复制DOM,绝不移植页面级样式表。保真度由工具验证,而非主观断言。
已通过端到端验证(aesop.com 首页,2026-07-03):经过3次可量化迭代,像素差异从8.31% → 2.93% → 1.31%,高度差Δ为0,内容差异检测“无发现”(198/198个节点)。所有修复均来自工具检测结果,而非人工目测。

Inputs

输入参数

  • <URL>
    — required. The site to migrate.
  • --breakpoints <list>
    — optional. Gate breakpoints, default
    1440,360
    . Mobile is NOT free: the validation run's 1440-tuned prototype measured 24% at 360. Each breakpoint gets its own gate pass.
  • --register <file>
    — optional. User-supplied inconsistency items to seed the register (see Phase 2). Without it and without an audit, the register is empty — a pure replica.
  • <URL>
    — 必填。待迁移的网站地址。
  • --breakpoints <list>
    — 可选。校验门断点,默认值为
    1440,360
    。移动端并非无需校验:针对1440分辨率优化的原型在360分辨率下的校验通过率仅为24%。每个断点需单独通过校验门。
  • --register <file>
    — 可选。用户提供的不一致性条目,用于初始化登记册(见第2阶段)。若未提供该文件且未执行审计,则登记册为空——即纯复刻迁移。

Setup

环境搭建

  1. Run the master skill's setup (
    ../stardust/SKILL.md
    § Setup): context loader, state read.
  2. Verify Playwright is importable from the project root (extract needs it; so do the gate scripts).
  3. Install the gate's pixel deps in the project:
    npm i -D playwright pixelmatch pngjs --no-save --legacy-peer-deps
    . Same trap as diff's prereq 0: a
    --no-save
    install is PRUNED by any later real
    npm i
    — re-probe before every gate run (
    node -e "import('pixelmatch').then(()=>process.exit(0))"
    ).
  4. Copy scripts into the project and run them from there, not from the plugin: this skill's
    scripts/
    (stitch-shot.mjs, pixel-compare.mjs) AND the whole
    ../diff/scripts/
    dir (the diff scripts import diff-profiles.mjs, and ALL live-target hardening — including stitch-shot's — lives in its live-session.mjs; stitch-shot resolves it from
    scripts/diff/
    next to
    scripts/replica/
    , so keep the two dirs siblings).
  1. 运行主技能的搭建流程(
    ../stardust/SKILL.md
    § Setup):上下文加载、状态读取。
  2. 验证Playwright可从项目根目录导入(提取流程及校验门脚本均需依赖它)。
  3. 在项目中安装校验门所需的像素依赖:
    npm i -D playwright pixelmatch pngjs --no-save --legacy-peer-deps
    。 与差异校验的前置要求0存在相同陷阱:使用
    --no-save
    安装的依赖会被后续任何正式的
    npm i
    操作清除——每次运行校验门前需重新检测(
    node -e "import('pixelmatch').then(()=>process.exit(0))"
    )。
  4. 将脚本复制到项目中并从项目目录运行,而非从插件目录:本技能的
    scripts/
    目录(stitch-shot.mjs、pixel-compare.mjs)以及整个
    ../diff/scripts/
    目录(差异脚本会导入diff-profiles.mjs,且所有线上目标站点的加固逻辑——包括stitch-shot的逻辑——均存于其live-session.mjs中;stitch-shot会从
    scripts/diff/
    目录解析该文件,该目录需与
    scripts/replica/
    同级)。

Procedure

执行流程

Five phases. Phases 1 and 5 delegate to existing skills unchanged; phases 2–4 are owned by
replica
.
共分为5个阶段。第1阶段和第5阶段直接调用现有技能,无需修改;第2至第4阶段由
replica
专属处理。

Phase 1 — EXTRACT (delegate to
stardust:extract --prep
)

阶段1 — 提取(委托给
stardust:extract --prep

Invoke
stardust:extract <URL> --prep
, unchanged. Prep mode is required — replica consumes the full migration inventory, not the discovery cap:
  • stardust/current/pages/<slug>.json
    — per-page structure + content (verbatim source of every string the prototypes will carry).
  • stardust/current/assets/screenshots/
    — per-page captures (ground truth for recreation, alongside the gate's own stitched shots).
  • stardust/current/assets/
    — fonts (network-intercepted woff2), logo, media.
  • stardust/current/PRODUCT.md
    ,
    DESIGN.md
    ,
    DESIGN.json
    — the descriptive current state (Phase 2 promotes these verbatim).
  • state.json.pages[].type
    — page types (each becomes one archetype).
  • DESIGN.json.extensions.modules[]
    — module candidates (become blocks).
Bounded/single-page entry (one-page or pilot runs).
--prep
is the site-wide contract; it is NOT the only way in. When the ask is "replicate just this page" — or the user wants to pilot one archetype before committing to a full migration — invoke
stardust:extract <URL> --single
(or
--pages <slug,...>
for a short list) instead. This is a first-class entry, not an improvisation: the recreation phase needs, per page, the captured page JSON (verbatim content), the per-page screenshot (ground truth), and the captured fonts — all of which a bounded extract provides; the source-CSS harvest and per-breakpoint computed styles come from Phase 3's CSS lifting either way. What a bounded run skips is the prep-only inventory (page typing, module detection), which is only needed when Phase 5 fans out to siblings — a pilot that later grows to site scope re-runs Phase 1 with
--prep
. A bounded run also skips the descriptive synthesis: crawl.mjs alone writes
pages/<slug>.json
, screenshots, and
_crawl-log.json
— it does NOT produce
current/PRODUCT.md
/
DESIGN.md
/
DESIGN.json
, so Phase 2's verbatim promotion has nothing to promote. On this path Phase 2 takes the bounded promotion branch instead (
reference/preserve-direction.md
§ 1a): replica synthesizes a minimal descriptive target spec from the captured page JSON + the Phase-3 CSS lift, marked
provenance: bounded-single
.
Extract's failure modes apply as-is (bot-management headed fallback, consent handling, no-synthesis rule). If extract had to fall back to headed Chrome, expect the gate captures to need the same treatment.
调用
stardust:extract <URL> --prep
,无需修改。必须使用Prep模式——
replica
需消耗完整的迁移清单,而非仅发现能力:
  • stardust/current/pages/<slug>.json
    — 每页的结构+内容(原型将完全复用其中的所有字符串)。
  • stardust/current/assets/screenshots/
    — 每页的截图(作为重写的基准,与校验门的拼接截图配合使用)。
  • stardust/current/assets/
    — 字体(通过网络拦截获取的woff2格式)、Logo、媒体资源。
  • stardust/current/PRODUCT.md
    DESIGN.md
    DESIGN.json
    — 当前状态的描述文件(第2阶段将直接复用这些文件)。
  • state.json.pages[].type
    — 页面类型(每种类型对应一个原型)。
  • DESIGN.json.extensions.modules[]
    — 组件候选(将成为可复用区块)。
限定范围/单页面入口(单页或试点运行)
--prep
是全站迁移的标准流程,但并非唯一入口。当需求为“仅复刻此页面”——或用户希望先试点一个原型再决定是否进行全站迁移——时,调用
stardust:extract <URL> --single
(或针对少量页面使用
--pages <slug,...>
)。这是一等入口,而非临时方案:重写阶段每页需捕获的页面JSON(内容完全复用)、每页截图(基准)、捕获的字体——限定范围的提取流程均能提供;源CSS提取及各断点计算样式则由第3阶段的CSS提取逻辑处理。限定范围运行会跳过仅Prep模式提供的清单(页面分类、组件检测),这些仅在第5阶段扩展至同类页面时才需要——若试点后续扩展为全站迁移,需重新运行第1阶段并使用
--prep
限定范围运行还会跳过描述性合成:仅crawl.mjs会生成
pages/<slug>.json
、截图及
_crawl-log.json
——不会生成
current/PRODUCT.md
/
DESIGN.md
/
DESIGN.json
,因此第2阶段的直接复用无文件可复用。在此路径下,第2阶段将采用限定范围复用分支
reference/preserve-direction.md
§ 1a):
replica
会基于捕获的页面JSON + 第3阶段的CSS提取结果合成最小化的描述性目标规范,并标记
provenance: bounded-single
。切勿混合分支:若
current/PRODUCT.md
存在,则直接复用。
提取流程的失败模式保持不变(反爬虫机制的有头浏览器 fallback、同意弹窗处理、无合成规则)。若提取流程不得不 fallback 到有头Chrome,则校验门的截图也需采用相同处理方式。

Phase 2 — PRESERVE DIRECTION (mechanical — never invoke
stardust:direct
)

阶段2 — 保留方向(纯机械操作——绝不调用
stardust:direct

Full contract:
reference/preserve-direction.md
. Summary:
  1. Promote
    stardust/current/PRODUCT.md
    ,
    DESIGN.md
    ,
    DESIGN.json
    verbatim to the project root as the target spec. No divergence roll, no re-direction, no Mode A/B — the current state IS the target. Bounded entry (
    --single
    /
    --pages
    ): those files don't exist
    — take the bounded promotion branch instead (
    reference/preserve-direction.md
    § 1a): synthesize a minimal descriptive spec from the captured page JSON
    • the Phase-3 CSS lift (palette, type ramp, container, buttons — exactly the values the lift produces anyway), provenance
      bounded-single
      . Never mix the branches: if
      current/PRODUCT.md
      exists, promotion is verbatim.
  2. Write
    stardust/direction.md
    recording preserve mode: what was promoted, from where, provenance (verbatim
    --prep
    promotion vs
    bounded-single
    synthesis), and the register pointer. This is what tells downstream skills "the direction step happened".
  3. Build the inconsistency register at
    stardust/replica/inconsistency-register.md
    — the ONLY permitted design deltas, the "almost" in almost-pixel-perfect. Sources:
    stardust:audit
    design findings (run audit only if the user wants improvement candidates) and/or user-supplied items (
    --register
    ). Every entry needs captured evidence + the minimal change + a status. Empty register = pure replica — that is a valid and common outcome, not a failure.
Anything not in the register is out of scope for change. When a recreation choice would "improve" something not registered, it is a fidelity bug.
完整规范:
reference/preserve-direction.md
。摘要:
  1. 复用
    stardust/current/PRODUCT.md
    DESIGN.md
    DESIGN.json
    ,直接复制到项目根目录作为目标规范。无分歧记录、无方向调整、无A/B模式——当前状态即为目标状态。限定范围入口(
    --single
    /
    --pages
    ):这些文件不存在
    ——需采用限定范围复用分支(
    reference/preserve-direction.md
    § 1a):基于捕获的页面JSON + 第3阶段的CSS提取结果(调色板、字体层级、容器、按钮——即提取流程生成的所有值)合成最小化描述性规范,标记来源为
    bounded-single
    。切勿混合分支:若
    current/PRODUCT.md
    存在,则直接复用。
  2. **编写
    stardust/direction.md
    **记录保留模式:复用的文件、来源、来源类型(直接复用
    --prep
    结果 vs
    bounded-single
    合成)、登记册指针。该文件用于告知下游技能“方向环节已完成”。
  3. 构建不一致性登记册,路径为
    stardust/replica/inconsistency-register.md
    ——这是唯一允许的设计差异,即“接近像素级完美”中的“接近”。来源:
    stardust:audit
    的设计发现结果(仅当用户希望获取优化候选时才运行审计)和/或用户提供的条目(
    --register
    )。每个条目需包含捕获的证据+最小变更内容+状态。空登记册=纯复刻迁移——这是有效且常见的结果,并非失败。
未记录在登记册中的任何变更均超出范围。若重写时选择“优化”未登记的内容,属于保真度缺陷。

Phase 3 — RECREATE (one archetype per page type)

阶段3 — 重写(每种页面类型对应一个原型)

Full method:
reference/recreation-procedure.md
. For each page type in the inventory, author
stardust/prototypes/<slug>-proposed.html
(+ per-page CSS) as clean semantic HTML/CSS from three sources, in this order:
(a) Captured page JSON content — verbatim. Headings, body, CTAs+hrefs, alt text, metadata from
current/pages/<slug>.json
. The migrate content-preservation rules (
../migrate/reference/content-preservation.md
) apply from the first line: no rewording, no fabrication. (b) Exact values lifted from the source site's own CSS. Fetch the live stylesheets; lift container max-widths, the type ramp, button specs, section paddings, radii, shadows, hero heights, the container model. Fidelity values come from the original site's CSS, not the eye — this converts 3–4 guess-and-screenshot loops into one. (c) The captured screenshot as ground truth for everything CSS doesn't name (composition, image crops, paint effects).
This is recreation, not redesign — do NOT delegate to impeccable craft. Impeccable's redesign gates (critique, anti-template, divergence) do not apply; the source-fidelity gate (Phase 4) replaces them entirely. A "tastefully improved" section is a failing section.
Fonts: use the same public source when available (extract's intercepted woff2 for open/self-hostable faces). For licensed commercial kits: never rehost on the new domain — pick a metric-matched substitute, keep the brand family name first in the font stack so a licensed drop-in later wins, and surface the substitution to the user. (Prior art: heathrow §3.7.)
CSS-portation is the per-section fallback only — paint-level effects not recoverable from computed styles, JS-hydrated commerce widgets, video or animated heroes. Port the minimal source rules for that section, scoped; never page-level. Criteria in
reference/recreation-procedure.md
§ Fallback.
完整方法:
reference/recreation-procedure.md
。针对清单中的每种页面类型,编写
stardust/prototypes/<slug>-proposed.html
(+ 页面专属CSS),采用语义化纯净HTML/CSS,来源分为三类,优先级如下:
(a) 捕获的页面JSON内容——完全复用。标题、正文、CTA及链接、替代文本、元数据均来自
current/pages/<slug>.json
。迁移内容保留规则(
../migrate/reference/content-preservation.md
)从第一行起即生效:不得改写、不得编造内容。 (b) 从源站点自身CSS提取的精确值。获取线上样式表;提取容器最大宽度、字体层级、按钮规格、内边距、圆角、阴影、Hero区域高度、容器模型。保真度值来自原站点CSS,而非人工目测——这将3-4次猜测+截图循环简化为一次操作。 (c) 捕获的截图作为基准,用于处理CSS未定义的所有内容(布局、图片裁剪、绘制效果)。
本流程为重写,而非重新设计——绝不委托给创意优化流程。创意优化的重新设计校验门(评审、反模板、分歧)不适用;源保真度校验门(第4阶段)完全替代这些校验。“经过审美优化”的区块属于不合格区块。
字体处理:若有公开可用的相同源,则使用该源(提取流程拦截的woff2格式字体,适用于开源/自托管字体)。对于授权商业字体包:绝不在新域名下重新托管——选择匹配字体 metrics 的替代字体,将品牌字体名称置于字体栈首位,以便后续可直接替换为授权字体,并向用户说明替代情况。(参考案例:heathrow §3.7。)
CSS移植仅作为区块级 fallback——适用于无法从计算样式恢复的绘制级效果、JS hydrated 电商组件、视频或动画Hero区域。仅移植该区块所需的最小源规则,并添加作用域;绝不移植页面级样式表。判断标准见
reference/recreation-procedure.md
§ Fallback。

Phase 4 — SOURCE-FIDELITY GATE (the heart — measured, per breakpoint)

阶段4 — 源保真度校验门(核心环节——可量化、按断点校验)

Full contract:
reference/source-fidelity-gate.md
. Run per archetype, per breakpoint (default 1440 AND 360), live URL as source vs served prototype:
bash
PROTO="http://localhost:8791/<slug>-proposed.html"   # python3 -m http.server from the prototypes dir
LIVE="https://<site>/<path>"
完整规范:
reference/source-fidelity-gate.md
。针对每个原型、每个断点(默认1440和360),以线上URL为源,与已部署的原型进行对比:
bash
PROTO="http://localhost:8791/<slug>-proposed.html"   # 从原型目录运行python3 -m http.server
LIVE="https://<site>/<path>"

Probe 1+2 — the diff skill's two probes, generic profile (--dismiss keeps

检测1+2 — 差异技能的两项检测,通用配置(--dismiss用于排除同意弹窗及定时营销弹窗)

consent + timed marketing modals out of both inventories)

node scripts/diff/content-diff.mjs "$LIVE" "$PROTO" --profile generic --width 1440 --main "<content-root>" --dismiss node scripts/diff/visual-diff.mjs "$LIVE" "$PROTO" --profile generic --width 1440 --main "<content-root>" --dismiss
node scripts/diff/content-diff.mjs "$LIVE" "$PROTO" --profile generic --width 1440 --main "<content-root>" --dismiss node scripts/diff/visual-diff.mjs "$LIVE" "$PROTO" --profile generic --width 1440 --main "<content-root>" --dismiss

Probe 3 — replica's pixel probe (stitched captures, NEVER fullPage:true)

检测3 — replica的像素检测(拼接截图,绝不使用fullPage:true)

node scripts/replica/stitch-shot.mjs "$LIVE" stardust/replica/gates/<slug>-1440/live.png --width 1440 --settle node scripts/replica/stitch-shot.mjs "$PROTO" stardust/replica/gates/<slug>-1440/proto.png --width 1440 node scripts/replica/pixel-compare.mjs stardust/replica/gates/<slug>-1440/live.png
stardust/replica/gates/<slug>-1440/proto.png --out stardust/replica/gates/<slug>-1440/diff.png

**Pass bar (all four, per breakpoint):**
- content-diff: **0 structural 🔴** (🟡/🟠 confirmed intended);
- visual-diff: flags none or justified;
- pixel diff: **≤ 10%** full-page, with no per-500px band left unexplained
  (the band breakdown is the navigation instrument — fix the first hot band,
  top-down; everything below it is offset-contaminated);
- height delta **|Δ| ≤ 8px** (pixel-compare's own warning bar).

**Iteration discipline: hard cap 3 iterations per breakpoint.** Each
iteration's fixes come off the instruments, never off eyeballing. After 3,
log the residuals in the ledger and move on — a documented 2% residual beats
an undocumented fourth loop.

**Hardening (each is a recorded false-measurement trap — see the reference
doc for the full list):** real-Chrome UA **plus the standard request
headers** on every capture (built into the shared
`diff/scripts/live-session.mjs` — the default HeadlessChrome UA gets a
Cloudflare challenge that the probes then silently measure AS the source,
and the UA alone still 403s on Akamai); a challenge/blocked interstitial
**fails loud (exit 3)**, never measured — escalate with `--headed`, and a
site that still blocks needs crawl.mjs-class capture (the gate must not
silently degrade); `domcontentloaded` on live targets, never `networkidle`;
symmetric `--main` scoping on both sides (`--main body` is never valid);
both overlay classes dismissed via `--dismiss` (consent AND timed marketing
modals); animations frozen for capture; the pointer parked after any
dismissal click (a `:hover`-styled element under the resting cursor
captures in hover state); fixed/sticky chrome replicated fixed, with its
scroll-state morph, so seam repeats stay symmetric
(`reference/recreation-procedure.md` § Fixed and sticky chrome);
granularity-parity policy for JOIN/SPLIT false-reds (#87); capture-state
policy for CDN-403 images and hydration placeholders (replicate as captured
+ log). Two defect classes only the gate catches — DOM/style capture misses
them: rendered-face font forks on inner spans (width probe) and overlay
scrims invisible to computed styles (recover by per-row luminance fitting).

The live-target hardening ships as flags on the diff scripts (`--ua`,
`--wait-until`, `--dismiss`, `--headed`, `--locale`, visual-diff `--main`)
backed by `live-session.mjs` — copy the scripts and pass flags; a project
copy carrying hand-edits is a defect
(`reference/source-fidelity-gate.md` § Script adaptations).

When all breakpoints pass, present the archetype + its gate metrics for
approval per the standard prototype approval flow (hands-off mode records
`approvedBy: "hands-off"` per `../stardust/reference/state-machine.md`).
node scripts/replica/stitch-shot.mjs "$LIVE" stardust/replica/gates/<slug>-1440/live.png --width 1440 --settle node scripts/replica/stitch-shot.mjs "$PROTO" stardust/replica/gates/<slug>-1440/proto.png --width 1440 node scripts/replica/pixel-compare.mjs stardust/replica/gates/<slug>-1440/live.png
stardust/replica/gates/<slug>-1440/proto.png --out stardust/replica/gates/<slug>-1440/diff.png

**通过标准(所有四项,每个断点均需满足):**
- 内容差异:**0个结构差异🔴**(🟡/🟠需确认是预期变更);
- 视觉差异:无标记或标记均为合理变更;
- 像素差异:**整页≤10%**,且每500px区块的差异均需有合理解释(区块分析是导航工具——从上到下修复第一个热点区块;下方所有区块的差异均由偏移导致);
- 高度差 **|Δ| ≤ 8px**(pixel-compare自身的警告阈值)。

**迭代规则:每个断点最多3次迭代**。每次迭代的修复均来自工具检测结果,而非人工目测。3次迭代后,将剩余差异记录在台账中并继续推进——有记录的2%剩余差异优于无记录的第四次迭代。

**加固措施(每项均为已记录的误测陷阱——详见参考文档完整列表):**每次截图均使用真实Chrome UA **及标准请求头**(已内置在共享的`diff/scripts/live-session.mjs`中——默认HeadlessChrome UA会触发Cloudflare验证,导致检测工具误将验证页面作为源;仅修改UA仍会被Akamai拦截并返回403);验证/拦截弹窗需**直接报错(退出码3)**,绝不进行检测——需使用`--headed`升级,若站点仍被拦截,则需采用crawl.mjs级别的捕获方式(校验门不得静默降级);线上目标站点等待`domcontentloaded`,绝不使用`networkidle`;两端使用对称的`--main`作用域(`--main body`永远无效);通过`--dismiss`关闭两类弹窗(同意弹窗及定时营销弹窗);捕获时冻结动画;关闭弹窗后将指针移开(悬停状态的元素会以悬停样式被捕获);固定/粘性导航栏需按固定样式重写,包括滚动状态变化,以确保接缝对称(`reference/recreation-procedure.md` § Fixed and sticky chrome);JOIN/SPLIT误报的粒度一致性规则(#87);CDN返回403的图片及hydration占位符的捕获状态规则(按捕获样式重写+记录)。仅有校验门能发现两类缺陷——DOM/样式捕获无法检测:内部span的渲染字体分叉(宽度检测)及计算样式不可见的遮罩层(通过逐行亮度拟合恢复)。

线上目标站点的加固措施通过差异脚本的参数传递(`--ua`、`--wait-until`、`--dismiss`、`--headed`、`--locale`、视觉差异的`--main`),并由`live-session.mjs`提供支持;需复制脚本并传递参数;对项目中的脚本进行手动修改属于缺陷(`reference/source-fidelity-gate.md` § Script adaptations)。

当所有断点均通过后,按照标准原型审批流程提交原型及其校验指标进行审批(自动模式下,根据`../stardust/reference/state-machine.md`记录`approvedBy: "hands-off"`)。

Phase 5 — HANDOFF (delegate — migrate → deploy → rollout, unchanged)

阶段5 — 移交(委托——迁移→部署→发布,无需修改)

  • Pages beyond the archetypes go through
    stardust:migrate
    at sibling tier (
    ../migrate/reference/fidelity-tiers.md
    ): structural clone of the gated archetype + content-fidelity + delivery-lint + media-reconcile. The archetype's source-fidelity gate is what the siblings inherit — never re-author a sibling from scratch.
  • Delivery via
    stardust:deploy
    per page. Bias the decode tier toward template-slotted for fixed-composition sections (deploy #95): replica sections are by definition fixed compositions matched to a live original; reconstruction freedom is risk with no payoff here. Repeat/authorable groups (cards, listings) stay reconstructive.
  • Site-wide rollout via
    stardust:rollout
    , unchanged — its block dedup is what implements "same blocks across the whole site".
  • Optional final proof: re-run the pixel probe live-site vs deployed page. Expect small justified deltas (EDS chrome, font loading); log them.
State: replica writes its own state under
stardust/replica/
— the inconsistency register,
progress.json
(per page type: archetype slug, iterations used, per-breakpoint gate results, residuals), and
gates/<slug>-<width>/
evidence. Pipeline status (extracted → prototyped → approved → migrated) stays in the core
state.json
per the standard state machine — replica never redefines it.
  • 原型之外的页面通过
    stardust:migrate
    同级模式处理(
    ../migrate/reference/fidelity-tiers.md
    ):复制已通过校验的原型结构+内容保真度校验+交付校验+媒体资源协调。原型的源保真度校验结果将被同类页面继承——绝不从头编写同类页面。
  • 交付通过
    stardust:deploy
    按页面处理。解码模式优先选择模板插槽(deploy #95):
    replica
    区块本质上是与原线上页面匹配的固定布局;重构自由度在此处无收益反而存在风险。可重复/可编辑的组(卡片、列表)保持重构模式。
  • 全站发布通过
    stardust:rollout
    处理,无需修改——其区块去重功能实现“全站复用相同区块”。
  • 可选最终验证:重新运行像素检测,对比线上站点与已部署页面。预期存在微小的合理差异(EDS导航栏、字体加载);需记录这些差异。
状态管理
replica
将自身状态写入
stardust/replica/
目录——不一致性登记册、
progress.json
(每种页面类型:原型slug、迭代次数、各断点校验结果、剩余差异)、
gates/<slug>-<width>/
目录下的各迭代证据。流水线状态(已提取→已原型化→已审批→已迁移)仍保存在核心
state.json
中,遵循标准状态机——
replica
绝不重新定义状态。

What replica never does

replica绝不执行的操作

  • No redesign. No new palette, type, spacing, composition, motion. The target spec is the captured current state.
  • No content rewriting. Captured strings are verbatim; placeholders and hydration states are replicated as captured, not "fixed".
  • No invented improvements. A change without an inconsistency-register entry is a defect, however tasteful.
  • No DOM copying. Never paste the live DOM or port page-level CSS as the prototype (that's the snowflake escape hatch, not this skill). Clean re-authoring is the point — byte-fidelity without re-implementation value defeats the migration.
  • 绝不重新设计。不使用新调色板、字体、间距、布局、动效。目标规范即为捕获的当前状态。
  • 绝不改写内容。捕获的字符串完全复用;占位符及hydration状态按捕获样式重写,绝不“修复”。
  • 绝不擅自优化。未记录在不一致性登记册中的变更均为缺陷,无论其审美效果如何。
  • 绝不复制DOM。绝不粘贴线上DOM或移植页面级CSS作为原型(这是应急方案,而非本技能的用途)。纯净重写是核心——无重构价值的字节级保真违背迁移初衷。

Outputs

输出结果

stardust/
├── state.json                          ← core state machine (unchanged contract)
├── direction.md                        ← preserve-mode record (Phase 2)
├── current/                            ← from extract --prep
├── prototypes/<slug>-proposed.html     ← gated archetypes (one per page type)
├── replica/
│   ├── inconsistency-register.md       ← the ONLY permitted design deltas
│   ├── progress.json                   ← per-page-type ledger: iterations, gate results, residuals
│   └── gates/<slug>-<width>/           ← live.png, proto.png, diff.png, probe outputs per iteration
└── migrated/                           ← from migrate (Phase 5)

PRODUCT.md / DESIGN.md / DESIGN.json    ← promoted verbatim from current/ (Phase 2)
stardust/
├── state.json                          ← 核心状态机(规范不变)
├── direction.md                        ← 保留模式记录(第2阶段)
├── current/                            ← 来自extract --prep
├── prototypes/<slug>-proposed.html     ← 已通过校验的原型(每种页面类型一个)
├── replica/
│   ├── inconsistency-register.md       ← 唯一允许的设计差异
│   ├── progress.json                   ← 每页类型台账:迭代次数、校验结果、剩余差异
│   └── gates/<slug>-<width>/           ← 各迭代的live.png、proto.png、diff.png、检测输出
└── migrated/                           ← 来自migrate(第5阶段)

PRODUCT.md / DESIGN.md / DESIGN.json    ← 从current/直接复用(第2阶段)

References

参考文档

  • reference/preserve-direction.md
    — mechanical promotion contract + inconsistency-register entry schema.
  • reference/recreation-procedure.md
    — CSS-lifting method (per gate breakpoint), fonts policy, scrim/luminance recovery, span-face forks, capture-state policy, fixed/sticky chrome, granularity parity, role parity (mirror the live wrapping per string), CSS-portation fallback criteria.
  • reference/source-fidelity-gate.md
    — full gate contract: commands, thresholds, per-breakpoint procedure, hardening rules, band-breakdown reading guide, iteration discipline, residual logging format.
  • ../diff/SKILL.md
    — the two probes replica reuses (
    --profile generic
    ); reading content-diff output; the #87 JOIN/SPLIT limitation.
  • ../extract/SKILL.md
    § Prep mode — what Phase 1 provides.
  • ../migrate/reference/fidelity-tiers.md
    — archetype/sibling model Phase 5 hands off to.
  • ../deploy/SKILL.md
    § decode tiers (#95) — template-slotted bias.
  • reference/preserve-direction.md
    — 机械复用规范 + 不一致性登记册条目格式。
  • reference/recreation-procedure.md
    — CSS提取方法(按校验门断点)、字体策略、遮罩/亮度恢复、span字体分叉、捕获状态规则、固定/粘性导航栏、粒度一致性、角色一致性(按字符串匹配线上包裹结构)、CSS移植fallback标准。
  • reference/source-fidelity-gate.md
    — 完整校验门规范:命令、阈值、按断点流程、加固规则、区块分析指南、迭代规则、剩余差异记录格式。
  • ../diff/SKILL.md
    replica
    复用的两项检测(
    --profile generic
    );内容差异输出解读;#87 JOIN/SPLIT限制。
  • ../extract/SKILL.md
    § Prep模式 — 第1阶段提供的内容。
  • ../migrate/reference/fidelity-tiers.md
    — 第5阶段移交的原型/同类页面模型。
  • ../deploy/SKILL.md
    § decode tiers (#95) — 模板插槽优先策略。