jade 编程助手1.3 更新，大量新特性，适配，兼容。

花老板

Jade 编程助手 v1.3

一个 8.6 MB 的 Windows 程序员工具箱：13 个常用工具塞进一个 EXE

C++17 原生层 + JadeView(WebView2) 前端  |  无 Electron  |  零额外运行时  |  双击即用

---

▌ 一、我为什么要自己造这个轮子

先说现状。我每天写代码，桌面上常驻一堆"单点工具"：调接口开 Postman，格式化 JSON 开在线网站，算个十六进制掩码开系统计算器，想看某个窗口控件的层级还得另外起一个 SPY 工具，抓个屏幕像素颜色又是一个软件。每个都不大，加起来内存几个 G，开机一堆托盘图标，换台机器还得一个个重新装。

我想要的很简单：一个本地的、轻的、全的工具箱。能离线，启动快，单文件，换电脑拷过去就能用。

于是问题来了——前端用什么壳？

为什么不是 Electron

Electron 当然能写，但一个空窗口起步就是上百 MB，冷启动以秒计，还要把整个 Chromium 和 Node.js 打包进去。我做的是"工具箱"，不是"IDE"，为了几个小工具背一个浏览器引擎，性价比太低。

最终选了 JadeView（WebView2 原生外壳）

JadeView 可以理解为"精简版 Electron"：它不打包浏览器引擎，而是直接调用系统自带的 WebView2（Edge 内核）来渲染界面。这样前端我能用熟悉的 HTML/CSS/JS 写，但分发体积只有壳本身那点大。

• 原生层：src/main.cpp，单文件约 2400 行 C++17。窗口、IPC、以及一切需要系统能力的活——MSAA 无障碍解析、进程枚举、屏幕取色、原生 HTTP、哈希、注册表开机自启——全落在这一层。这些能力是网页层够不着的，必须用 Win32。
• 前端层：web/ 目录，纯原生 JS，无任何框架。它是唯一的界面与交互层，通过 IPC 通道调用原生能力。
• IPC 约定：原生侧用 register_ipc_handler("通道名", 处理函数) 集中注册，返回一段约定为 {"ok":true/false,...} 的 JSON 字符串。前端 invoke 一下就拿到结果。
  

最终交付形态：单个 EXE，约 8.6 MB。其中前端整包 app.japk 嵌入约 0.78 MB，JadeView 运行时 DLL 嵌入约 3.96 MB，剩下是 C++ Release 代码与资源表。系统自带 WebView2，无需任何额外运行时。双击即开，换机即用。

---

▌ 二、过程中踩穿的五个坑

下面这几个，都是文档里搜不到、得自己翻源码/翻 Win32 文档死磕出来的。按踩坑顺序讲。

坑 1：启动白闪——窗口先白一下再变内容

WebView2 在页面真正渲染出来之前，窗口会先以系统默认的白底显示一瞬间，深色界面下这一下白闪非常刺眼。试过先把背景刷成深色，但闪的是 WebView 自己的合成层，刷父窗口没用。

最终发现正确姿势是：窗口创建即隐藏，等"页面加载完成"事件再显示，而且只显示这一次。JadeView 创建时传 hide_window=1，原生侧再补一刀 ShowWindow(SW_HIDE)，直到 WEBVIEW_DID_FINISH_LOAD 回调里才 ShowWindow(SW_SHOW)。白闪彻底消失。

[C++] 纯文本查看 复制代码

// create the window hidden; reveal it only after the page is painted
options.hide_window = 1;              // do not show on create
HWND mh = (HWND)get_window_hwnd(create_webview_window(...));
if (mh) ShowWindow(mh, SW_HIDE);     // belt and suspenders

// fired on WEBVIEW_DID_FINISH_LOAD -- the first and ONLY show
void OnWebViewLoad(uint32_t win_id) {
    HWND h = (HWND)get_window_hwnd(win_id);
    if (h) ShowWindow(h, SW_SHOW);   // no more white flash
}

坑 2：圆角窗口四个角的方块残留

界面用圆角设计，靠 CSS 给最外层容器加 border-radius + overflow:hidden。结果四个角（尤其右下）总有一小块方角的底色透出来，怎么调圆角半径都消不掉。

死磕到最后才定位：这是 Chromium 的一个经典行为——带 backdrop-filter（毛玻璃）的子元素会被提升为独立合成层，而合成层会无视祖先的 border-radius 裁剪。我的标题栏、玻璃面板全都有毛玻璃效果，于是它们的方角就从圆角外面漏了出来。overflow:hidden 对这种合成层是不生效的。

解法是改用 clip-path，它会强制裁剪所有子级（含合成层）且带抗锯齿：

[CSS] 纯文本查看 复制代码

.app {
  border-radius: 12px;
  overflow: hidden;            /* does NOT clip backdrop-filter layers */
  clip-path: inset(0 round 12px);  /* THIS one actually clips them */
}

坑 3：退出后残留一窝 msedgewebview2.exe 子进程

WebView2 渲染会拉起若干 msedgewebview2.exe 子进程。早期版本退出主程序后，这些子进程有时不会跟着走，任务管理器里越攒越多，还会占着内存。

直接按进程名杀太粗暴——别的程序也可能在用 WebView2。正确做法是只杀"亲生的"：用 ntdll 的 NtQueryInformationProcess 拿到每个 msedgewebview2 的父进程 PID，只有父进程等于自己时才终止。配合关闭流程：必须先让消息循环真正退出，后续清理代码才会执行。

[C++] 纯文本查看 复制代码

// terminate only the msedgewebview2.exe children whose parent == me
void KillWebView2Children() {
    DWORD self = GetCurrentProcessId();
    // for each msedgewebview2.exe in the snapshot:
    PROCESS_BASIC_INFORMATION pbi = {0};
    NtQueryInformationProcess(hChild, ProcessBasicInformation,
                              &pbi, sizeof(pbi), NULL);
    if ((DWORD)(ULONG_PTR)pbi.InheritedFromUniqueProcessId == self) {
        TerminateProcess(hChild, 0);   // mine, kill it
    }
}

坑 4：HTTP 工具里的"协议偏好"形同虚设

HTTP 请求工具我做了原生 WinHTTP 通道（能力比浏览器 fetch 强，可控 Cookie/头）。但加了个"协议偏好 HTTP/2"的下拉后发现：选了 HTTP/2 根本不生效，抓包还是 1.1。

事实证明，光在请求里写个标记没用，得在原生 WinHTTP 上真正开启协议选项，并且——这是关键——要把实际协商出来的版本回读出来，反馈到界面，否则你永远不知道到底走没走 2.0。最终原生侧按所选 protocol 调用 WinHttpSetOption 开启 HTTP/2，请求完成后再用 WinHttpQueryOption 读回 HTTP_PROTOCOL_USED，把真实版本显示到 Type 指标里。顺带，代码生成器也按所选协议产出（curl 加 --http2、Python 改 httpx(http2=True)、Go 用 ForceAttemptHTTP2 等）。

[C++] 纯文本查看 复制代码

// actually enable HTTP/2 on the native WinHTTP request
DWORD flag = WINHTTP_PROTOCOL_FLAG_HTTP2;
WinHttpSetOption(hRequest, WINHTTP_OPTION_ENABLE_HTTP_PROTOCOL,
                 &flag, sizeof(flag));

// after sending: read back what was REALLY negotiated, report it to the UI
DWORD used = 0, len = sizeof(used);
WinHttpQueryOption(hRequest, WINHTTP_OPTION_HTTP_PROTOCOL_USED, &used, &len);
// used & WINHTTP_PROTOCOL_FLAG_HTTP2  ->  show "HTTP/2" in the metrics

坑 5：单实例与退出时的"僵尸锁 EXE"

工具箱要单实例：再次双击不该开第二个窗口。用命名互斥体判断，新进程启动时会 TerminateProcess 强杀所有同名旧进程——所以开发时反复启动，旧窗口被静默杀掉是正常现象。

但还有个更阴的：退出时如果只 os.Exit/直接 return，某些资源（提示音、WebView2 卸载）可能卡住消息循环不返回，进程残留变僵尸，然后 EXE 文件被自己锁住、重编都覆盖不了。最终所有退出路径统一汇聚到 RequestAppExit() —— 让消息循环先退出，返回后再执行 JadeView 卸载、子进程清理、临时文件清理，干净落地。

这五个坑的共性：都不是语法错误，而是"框架/系统行为不符合直觉"。文档不会写 backdrop-filter 会击穿 border-radius，也不会告诉你 WebView2 子进程要靠父进程 PID 反查来收尸。这类坑只能靠 debug 到凌晨 + 翻源码解决。

---

▌ 三、它现在能干什么

13 个工具，侧栏一键切换，每个都能开多页签：

工具	一句话	原生支撑
HTTP 请求	请求调试 + cURL 导入，原生通道可控 Cookie/头与 HTTP/2	native_http (WinHTTP)
WebSocket	WS/WSS 会话，可填 Cookie/自定义头走原生桥接	ws_open/send/poll/close
编码转换	UTF-8/GBK/Big5 + Base64/URL/Hex + MD5/SHA + USC2 转义	convert_encoding / hash_text
JSON 解析	格式化/压缩/路径索引 + 多语言取值代码生成	纯前端
程序猿计算器	DEC/HEX/BIN、位宽、位运算	纯前端
MSAA 解析	无障碍组件树解析、取点拾取窗口	inspect_msaa (oleacc)
进程管理	带图标的进程枚举、结束、定位、提图标	list_processes / kill_process
窗口取色	全屏取色 + 像素放大镜，DPI 精准	pick_screen_color
窗口 SPY	桌面窗口枚举、属性、子窗口树、图标	spy_windows / spy_child_tree
代理 IP	批量验证、延迟排序	proxy_validate
正则调试	匹配 + 分组查看 + 替换预览	纯前端
JS 调试器	沙箱执行、补环境、语法高亮编辑器	纯前端
设置 / 关于	主题、字体、开机自启	apply_theme / set_startup

一个我特别想吹的差异化点：JSON 取值代码生成

大多数 JSON 工具的"代码生成"只会给你一句标准库的 obj["a"]["b"][0]。我做的不一样：解析后点任意树节点，它会按你选的语言 + 主流库生成正确的取值代码，每种语言可选不超过 3 个主流库——

• C++：nlohmann/json、yyjson、simdjson（后两者直接生成 JSON Pointer "/a/b/0" 写法）
• Python：标准库 json、orjson、ujson
• Go：encoding/json（带逐层类型断言）、gjson、bytedance/sonic
• Rust：serde_json、simd-json
• JS / 易语言：原生/lodash、zyJson/精易模块
  

这种"贴着真实生态"的代码生成，才是真能省事的——复制即用，不用自己查每个库的取值语法。

---

▌ 四、体积与启动：和重型方案比一比

方案	分发体积	运行时依赖	渲染内核
Jade 编程助手	~8.6 MB 单 EXE	系统自带 WebView2	Edge / WebView2
Electron 类	100+ MB 起	自带 Chromium + Node	打包的 Chromium
CEF 类	数十 MB 起	自带 CEF 运行时	打包的 Chromium

同样是 HTML/CSS/JS 写界面，把渲染交给系统已经装好的 WebView2，体积就能从"上百 MB"压到"一位数 MB"。对一个工具箱来说，这个取舍非常划算。

---

▌ 五、适合谁

• 每天和接口/JSON/编码/进制打交道，懒得在一堆网页和重型软件之间反复横跳的开发者
• 需要 MSAA / 窗口 SPY / 取色 这类"贴近 Win32"的桌面排查能力的人
• 喜欢"单文件、能离线、换机即用"的极简主义者
  

▌ 六、下载链接

游客，如果您要查看本帖隐藏内容请回复

技术栈、踩坑细节、架构取舍都在上面了。它不是又一个 Electron 套壳，而是一个把"系统原生能力"和"网页式 UI"缝在一起的 8.6 MB 小工具箱。

---

【易语言】jadeView前端UI：1103426302

lzptts

感谢分享·······

jiqigouer

谢谢分享

cy2xy

感谢分享·······

cy2xy

感谢分享·······

爱的愤愤

每天和接口/

訨為╭狩鳸妳

用用看

tk0056

好东西 先下载再说

苏幻墨

技术栈、踩坑细节、架构取舍

股老传奇

很强！！！！！！！！！