网线、套壳应用，和一台能听懂事件的浏览器控制台

今天的三样东西凑在一起有点意思：一个让"网页变桌面软件"的省事先登，一个能偷看别人代码里监听器的调试技巧，还有一个让我们每天插网线这件事得以成立的日期。

一个命令，把任何网页装成桌面应用

你可能干过这种事：某个内部后台、Notion、或者某个数据看板，你希望它像原生软件那样在 Dock 里有个图标、能独立开窗口，而不是永远淹没在第 47 个浏览器标签里。

Pake （仓库名 tw93/Pake）专门干这件事。它不是 Electron------底座是 Tauri（Rust + 系统自带 WebView），所以打出来的安装包通常只有几 MB 到十几 MB，而不是 Electron 那种动辄上百 MB。

装法走 npm registry，跟 GitHub 通不通没关系：

bash 复制代码

npm i -g pake-cli

# 把任意网页变成桌面应用
pake https://your-internal-admin.com --name 后台管理

能带的常用参数：--icon 换图标、--width/--height 定窗口尺寸、--multi-window 允许多开、--inject 塞自定义 CSS/JS 进去改样式。跨 macOS、Windows、Linux。

对做地图和后台的你来说，最实际的用法是：把公司内部的可视化大屏或者某个第三方 SaaS 控制台包成"应用"，双击打开就走，不用每次登录 + 找标签页。加上 --inject 还能给别人的页面打样式补丁，把不适配暗色模式的后台调顺眼。

需要注意的是它本质还是"包了个壳的网页"，需要离线运行、要访问本地文件系统的场景它做不了------那种情况老老实实写 Tauri。

让控制台自己汇报："这个元素收到过哪些事件"

调试地图交互的时候，经常会遇到一种抓狂：明明点了、滚了、拖了，可你不知道事件到底落在哪个 DOM 节点上，或者谁在背地里监听它。DevTools 里有两个只存在于控制台的小工具，专治这个。

monitorEvents(el) ------ 元素一有事件，立刻在控制台打日志，不用你去加 addEventListener、不用改一行业务代码：

js 复制代码

const mapEl = document.querySelector('.amap-container')

monitorEvents(mapEl)                 // 该元素所有事件都打印出来
monitorEvents(mapEl, 'click')        // 只看 click
monitorEvents(mapEl, ['click', 'mousemove'])   // 看多个类型

unmonitorEvents(mapEl)               // 别让它刷屏，用完关掉

getEventListeners(el) ------ 反着来：看看这个元素身上已经挂了哪些监听器，是谁在响应：

js 复制代码

getEventListeners(document)          // 返回按事件类型分组的大对象
getEventListeners(window, { only: 'resize' })

在 Console 里展开结果，每个监听器都会带上定义它的文件和行号------如果那个文件在你的 source map 里可读，你能直接跳进去看源码。

两个都是 DevTools 控制台专用 API，写进业务代码里会报错。顺带一个组合技：先用 monitorEvents 确认事件有没有真的触发，再用 getEventListeners 找到处理器位置，比在 Vue 组件里到处塞 console.log('clicked') 快得多，尤其当事件是被第三方库（地图 SDK 就是典型）绑定的时候。

历史上的今天：1980 年 9 月 30 日，以太网从"某家的发明"变成"行业标准"

46 年前的今天，三家公司------DEC（数字设备）、Intel、Xerox------联合发布了《以太网物理层与数据链路层规范 1.0》，业内一般叫它 DIX（三家公司名字首字母拼起来）。

在此之前，以太网是 Xerox PARC 的内部技术。Robert Metcalfe 在 1973 年写出那份著名备忘录时，跑的是同轴电缆、约 2.94 Mbps。名字"Ethernet"来自物理学里那个早已作古的"以太"------他调侃说，这套东西和以太一样弥漫在整栋楼里。

DIX 真正做的关键改动是两件：把速度统一到 10 Mbps ，以及采用了 Xerox 提出的 48 位地址格式 。第二件你今天还在用------每块网卡的 MAC 地址就是那个 AA:BB:CC:DD:EE:FF，直到今天还没换过。

然后才是那步决定胜负的棋：把规范公开给整个行业。1980 年前后，局域网其实有两个候选方案在打擂台------以太网的 CSMA/CD（"先听再说，撞了重发"，本质混乱且开放）和 IBM 主推的令牌环（Token Ring，规矩、可预测、企业级）。令牌环在技术指标上并不丢人，但它属于一家公司，而以太网在 DIX 之后属于所有人。

1985 年，IEEE 把它采纳为 802.3 标准。剩下的就是你今天工位上那根网线，以及"以太网赢了"这句听起来理所当然、其实当年并不注定的话。

有个细节很有意思：DIX 的那套帧格式和后来 IEEE 802.3 的帧格式在字段上有一处至今没能合并的差异，网络工程师区分它们的方式是看第 13 个字节------那个字段的名字就叫 EtherType。46 年前三家公司签的那份文档，名字还留在每一张流经你手边的数据包里。

顺手一句

计算机科学里只有两个真正难的问题：缓存失效、命名，以及差一错误。

（这个梗的笑点在最后一行------它本该是"两个"，却列了三样。对前端来说，这个错误我们每天都在犯：for (let i = 0; i <= arr.length; i++)，以及那个在列表末尾多渲染出来的 undefined。）

最后

今天这三样凑起来，其实是同一个主题："公开一份规范"和"少写一层封装"，往往比"发明更好的技术"更能改变现状。

DIX 没有发明以太网，它只是把私有技术摊开给所有人看，于是赢下了接下来四十年的局域网；Pake 也没有发明套壳，它只是把 Tauri 那套东西简化成一条 pake <url>，于是"要不要用 Electron"这个问题的答案在大量场景里变了；至于 monitorEvents，它没提供新能力，只是让你不必为了看一眼事件而改动别人的代码。

有意思的是，这三者都发生在你手边------网口的规格、一条 npm 命令、按 F12 就能用的控制台。技术史真正的转折点常常不是那种宏大的时刻，而是某个人决定让这件事变得稍微容易一点。

明天午休见。