<input id="input"/>
<button id="button" onpointerdown="event.preventDefault()" onclick="input.value += ' clicked'">click</button>

键盘仍然激活：pointerdown 里 event.preventDefault

拼音候选消失：input.value 被赋值了

最简单的就是直接把包含所有模型的文件夹 zip 成一个文件，前端发一个请求然后用 in-memory 的 file system 直接 unzip 成 folder, 操作完了要写回去就再 zip 回去。

不知道你这 1000 多个模型，一共有多大。

好比一个 PSD 文件，里面包含多个图层，每个图层有自己的像素信息，前端增删改，保存后它就是一个 PSD 二进制文件啊。

所以你只需要设计一个二进制文件格式，定义好结构

狭义地讲，Media Capture and Streams API 是独立于 WebRTC 的，往往 WebRTC 都会用到 getUserMedia 。

其实要获取媒体流话，用得到 Media Capture 的 getUserMedia API ，编解码方面可以用 WebCodecs API ，不一定要用 WebRTC 传数据，WebRTC 的核心是多端双向通信，略复杂。

做推流，有个比较新的东西是 WebSocket 的升级版， 叫 WebTransport , 基于 HTTP3 的，JS 侧的 API 都是基于 Stream 的，可以进行可靠传输和类似 UDP 一样的不可靠传输。API 还比较新，不一定能在生产环境用。

这里有一个用 getUserMedia + WebCodecs+ WebTransport 做的 video echo 的 demo

https://webrtc.internaut.com/wc/wtSender4/

为什么要覆盖这些？覆盖 $.fn.ready 不就行了？

看来 jQuery 是真老了，没人知道了。

$.fn.ready = function (){

}

@lqzhgood

这里就要说到 ts 的 nominal type checking.

type foo = 0 & {brand: 'foo'}

这里 foo 并不会是 never ，这是 ts 刻意为之的，虽然运行时不可能存在一种值满足这个类型。(但是可以在 ts 层面 as 啊)

type bar = (0 & {brand: 'foo'}) extends 0 ? true : false; // true

function test<T extends TAP_TYPE>(t: T, v: TapTypeMap[T])

T 实际有可能是 TAP_TYPE.LOCAL & {a:1} 或与任意其他 interface 的交叉类型。

打开 strictNullChecks 试试？

This condition will always return true since this function is always defined. Did you mean to call it instead?ts(2774)

#3 借助元组进行联动缩窄的方法很巧妙。

1. switch (t) 缩窄的是变量 t 的类型，并不会影响泛型 T 的范围，就算 T 真能跟随 case 缩窄变化，v:TapTypeMap[T] 也不能获得联动缩窄。T 是一个未知类型，extends 只是约束了这个未知的边界。
2. t 的类型是 TAP_TYPE 的子类型，导致 case 对 t 的类型缩窄失效，此时 t 的类型不再是可缩窄类型。TAP_TYPE 是 enum 类型，类似 union type ，可以缩窄，但从 enum 派生出去的类型不一定可缩窄。


enum TAP_TYPE {
LOCAL,
MAP,
}

interface TAP_LOCAL {
a: string;
}

interface TAP_MAP {
b: string;
}

type TapTypeMap = {
[TAP_TYPE.LOCAL]: TAP_LOCAL;
[TAP_TYPE.MAP]: TAP_MAP;
};

function test<T extends TAP_TYPE>(t: T, v: TapTypeMap[T]): string;
function test(t: TAP_TYPE, v: TapTypeMap[TAP_TYPE]): string {
switch (t) {
case TAP_TYPE.LOCAL:
return (v as TapTypeMap[typeof t]).a;
case TAP_TYPE.MAP:
return (v as TapTypeMap[typeof t]).b;
}
}

集合 A : 有羽毛的动物 ({a: string})
集合 B : 两只脚的动物 ({b: number})

A 和 B 的交集是空集么？不是对吧。AB 在不同方面描述这个东西，交集就是属性叠加，对类型进一步约束。

如果 C 是 A 的子集，C 又是 B 的子集，C 必然是 A 交 B 或其子集。A 和 B 的交集就是既满足 A 又满足 B ，duck type 的缘故，自然很轻松推导出交集的类型。

Http header 优先级高，其次是 meta http-equiv 然后是 meta charset

应用场景是如果 http header 没有声明 charset 或者压根就不存在 http header 比如打开本地 html 文件。

HTML5 还定义了更多的各种 encoding sniff 算法，有可能会存在假定编码先解析。

https://stackoverflow.com/questions/26030572/what-is-the-difference-between-the-charset-in-http-header-and-html-meta

不要看模板要看最后 render 出来的 DOM 节点。选中那个文字节点，看下 font-family 从哪里来的就知道。说不定有 chrome 插件会往页面塞 CSS 呢。

逻辑别放 Vue component 里，丢一个闭包里，这样油猴脚本就没法从 DOM 节点长驱直入到你的 getParams 方法了。


https://imgur.com/vBjtUMd

@tmtstudio 方法别挂 vue 实例上