@ brust/ runtime- down

绑定已编译客户端块的无反应浏览器运行时间( R)defineBehavior)到服务器上交付的 HTML 结束 x-* 属性. README 是 M1c 客户端后端打印的输出格式; 每一个 下方的行为通过测试 test/。零依赖性,无值,捆绑 < 18 KB (单位:千美元)bun scripts/build.ts) (中文(简体) ).

公众表面

import { signal, computed, effect, batch, untracked, defineBehavior, setChunkLoader, mount, unmount } from '@brust/runtime-dom'

• 信号( N)test/signal.test.ts: 写作 Object.is- 分裂; computed 懒惰而隐匿; effect(fn) 继续运行 更改,返回的函数是每次重新运行和处理前的清理; batch (a) 将影响推迟到其结束; untracked 阅读时没有签名.
• defineBehavior(name, factory)数字 : factory({ el, props, effect, onCleanup, ref }) 返回实例 成员 (符号、计算、函数、平面值). props 是一个 信号 的道具对象。 一个 init 成员,如果是职能,在工厂之后运行.
• setChunkLoader(load): 每个未知行为名称呼叫一次; 装入器需要呼叫 defineBehavior(name, …)。默认:无(主机等待).
• mount(root = document.body): 偶数; 挂载每个 [x-data] 按文档顺序( 父母优先) 并开始 a MutationObserver 以挂载添加的主机并处理已删除的主机(一个已卸载但重新插入的主机将被处理,然后重新挂载). unmount(root) 处理实例 root 并阻止观察者。 一个投掷的工厂被登录,其实例被丢弃;其他主机仍在上架.

指令值语法

value    := path (":" bindings)?
path     := ident ("." ident)*          // looked up on the instance members; a signal/computed hop is unwrapped
bindings := ident ("," ident)*          // loop-scope names (x-for item/index); the member must be a function and is called with them

其它任何东西x + 1, (中文(简体) ), fn())不解析:警告一经记录,DOM即为解析。 未知成员的行为相同.

属性

指令只来自编译器输出: 编译器从不打印一个 x-* 在 JSX 组件中写入属性( 警告) reserved-attr),且运行时间不包含在内 dangerouslySetInnerHTML 标值( e)x-html 编号 : x-raw)或反应岛(<brust-island>) (中文(简体) ).

• x-data="name":每个主机一个实例. 被巢被宿主束缚着自己的情况,而不是父母的行走者.
• x-props='{"json":1}': 种子 ctx.props。无效的 JSON 警告和种子 {}。 。 。 .
• x-props-bind="member[:binding]":在孩子的宿主上,将孩子的 props 向最近的祖先成员发出反应信号 (物体,一般为: computed; 函数值通过). 内部 x-for 该行的瞄准镜提供绑定。 如果父母尚未挂载 (充气还装入)孩子在父母上马时会连接起来. 没有祖先:警告,保持 x-props 种子 .
• x-text="value": 组 textContent· ; null编号 :undefined → ''。 。 。 .
• x-html="value": 组 innerHTML (加价,未脱逃); null编号 :undefined → ''。只由编译器发送,用于 dangerouslySetInnerHTML 其价值在第一次涂料后会发生变化;作者对加价(合同与反应相同)进行消毒. 初绘检查比较解析的标记,所以等同的拼写不警告.
• x-show="value"数字 : style.display = '' 当真理降临的时候, 'none' 否则.
• x-if="value": 该元素被替换为 a <!--x-if--> 注释锚地;在它后面插入一个克隆,同时真实并删除其它内容. 嵌入 x-data 克隆上载/处理中的主机 。 服务器 HTML 在错误时省略元素 .
• x-bind-<attr>="value"数字 : class → className· ; value → .value· ; disabled checked selected readonly required hidden open multiple − 财产+属性(在场/缺席); 其它东西: null编号 :undefined编号 :false 删除属性, 否则 setAttribute。 。 。 . 拒绝 (警告一次): on* 财务报告和审定财务报表 srcdoc 属性,以及 href src action formaction poster data,任何其解析方案不是 http(s):编号 :mailto:编号 :tel: (相对的URL是罚款的; java\tscript: 是因为 URL 是解析的,而不是模式匹配的.
• x-on-<event>="member[:binding]":先给有约束范围值的成员打电话,然后是事件: pick(item, index, event)。 。 。 .
• x-model="member":成员必须是可写出信号(else warnings). 文本类似 : input 活动 qq .value; 复选框 : change 布尔 .checked· ; 无线电: change 写入 .value 当检查时, 信号集 .checked; 单 select数字 : change ↔ .value,在选项改变时重新应用. select[multiple] 不支持(警告).
• x-for="item[, index] in source by keyFn"数字 : source := path (":" bindings)? 是成员路径到一个阵列(或信号/计算出一个阵列);带有绑定符的成员是一个与外环名称相呼应的函数,因此一个被嵌入的列表读取了外行等. <tr x-for="row in rows by k1"><td x-for="c in cells:row by k2">· ; keyFn 是项目的一个成员函数. 服务器交接的兄弟行 x-for 为: 通过的顺序 第一次运行时; 以零行显示服务器输出 a <!--x-for--> 评论后加一条 hidden 模板元素 (载运) x-for)是被克隆的。 行由密钥调节( 移动保留 DOM 身份); 重新使用的项目/ 索引被更改的行重新运行其绑定符 。 重复密钥警告一次并返回索引身份. 要件 x-for 由该指令拥有: x-* 属性绑定在行上,有范围 { item, index }。 。 。 .
• x-ref="name"数字 : ctx.ref('name').current 是挂载后的元素, null 处置后.

第一绘规则

在挂载上没有重递: 服务器 HTML 是初始状态 。 一个绑定器只写DOM,当它的效果在变化后重新运行时, 或者说 初始时 x-text 编号 : x-html 值与服务器文本不同, 然则它能改正,能警告一次first-paint mismatch …: 不匹配是运行时间不能隐藏的编译器错误 。 挂起后创建的元素( 新行, x-if 克隆人)永远不要绊倒这个支票.

盖茨

bun test • 妇女 bunx tsc --noEmit -p . (单位:千美元)bun check · · 1.4.3 bun scripts/build.ts (如果捆绑进口失败).

反应岛屿

服务器绘制反应级组件为 <brust-island data-id="<componentId>" x-props='<json>'>…server HTML…</brust-island>。 。 。 . 岛上的块在不导入运行时间的情况下登记其水合物功能:

;(globalThis.__brustIslands ||= []).push(['<componentId>', (host, props) => hydrateRoot(host, <Comp {...props}/>)])
globalThis.__brustIslandReady?.()

当浏览器闲置时,运行时会给每个主机水分一次(requestIdleCallback,则 setTimeout(…, 1))和设置 data-hydrated="1" 在成功方面。 运行时间之间的装入顺序 脚本和岛块不重要 坏东西 x-props JSON 水合物与 {} 你应当警告众人; 报告投掷的水合物 console.error 而服务器 HTML 保留。 这是唯一的 m2(Spec S12)中的战略.

存储

0.1.x号 brustjs/store API 在同一反应核心上,指令使用(一个图,甚至跨模块副本: 跟踪状态生活 globalThis[Symbol.for('brust.reactive.ctx')]) (中文(简体) ).

• @brust/runtime-dom/store (还有运行时间条目,和 @brust/core/store: signal computed effect batch untracked isSignal isComputed defineStore 类型 Signal Computed Dispose StoreHandle Snapshot。 。 。 .
• defineStore(name, factory) 返回控点 : store.field, (中文(简体) ), store.snapshot(), (中文(简体) ), store.serialize(), (中文(简体) ), store.hydrate(state), (中文(简体) ), store.subscribe(cb). 第一工厂赢得每个名称.
• 浏览器将每个名称保留一个实例 globalThis[Symbol.for('brust.stores')]。第一个访问a 名称种子它来自 <script type="application/json" data-brust-store="NAME"> (懒,一回.
• @brust/runtime-dom/store/react (另见: @brust/core/store/react: useStore(store) 通过 useSyncExternalStore。反应是一种 选项对等点,仅由此子路径导入;运行时捆绑会保留 反应无碍.
• @brust/runtime-dom/store/internal: Bun工人使用的服务器-resolver钩和串行式帮助器. 不入大众地表.

特性模块(L33、F139)

运行时间是一个核心加功能模块,因此一页只加载其组件使用的内容,而客户端JS不会随着编译器学习更多的回放而增长.

• @brust/runtime-dom/core (单位:千美元)src/core.ts信号, defineBehavior编号 :setChunkLoader, (中文(简体) ), mount编号 :unmount,绑定物登记簿(BINDERS)和内部特征需要(src/core-api.ts) (中文(简体) ). 它不知道什么是指示.
• @brust/runtime-dom/features/<name> (单位:千美元)src/features/*.ts: basics (单位:千美元)x-text, (中文(简体) ), x-show, (中文(简体) ), x-bind-*, (中文(简体) ), x-on-*, (中文(简体) ), x-ref, (中文(简体) ), if, (中文(简体) ), for, (中文(简体) ), model, (中文(简体) ), html, (中文(简体) ), island (反应岛水合胶. 一个特性在核心输入和输入时仅通过 core-api; 在浏览器中构建 core-api 是共享的核心文件,所以每页有一个信号图和一个绑定器登记册.
• @brust/runtime-dom (单位:千美元)src/index.ts)是核心+每个特性,用于测试和非分裂消费者. 浏览器构建从不使用.

新特色的规则. 微指令几乎每个互动页面都使用相机 basics。在少数页面至少使用 1 KB gzip OR 时,其他任何组件都可获得 OMN 模块 : store, (中文(简体) ), island, (中文(简体) ), if编号 :for编号 :model编号 :html (c) 未来每个特性(文字、门户、焦点陷阱.)。 不添加特性到 basics 或要保存文件的核心; 将其添加为模块,编译器只请求使用它的道路。 CI字节预算(核心+) basics)坚持到底.