feat(ui): 最近事件随分组页签联动过滤 + favicon 提供 WebP

① 最近事件随筛选过滤

此前事件只受后端 dataFilter 约束,与面板上方的分组页签无关 —— 切页签后
监控列表变了,事件列表却纹丝不动。

两个真实缺陷(都是实测发现,不是推断):
1. setFilter() 只调 renderTabs() + renderView(),**没调 renderEvents()**
2. 过滤依据用 allMonitors(),它只受 dataFilter 约束、不受分组影响
   → 改为 visibleGroups().flatMap(...)
3. 无匹配事件时提前 return,没清空 list.innerHTML → 旧行仍留在 DOM 里,
   换个分组再切回来会看到过期内容

实测:「全部」8 条 → 「UptimeRobot」1 条(正是「狼的评论系统 /
UptimeRobot:403 Forbidden」)→「基础设施」0 条且区块自动隐藏。

过滤用「当前可见目标 id 集合」反查,而不是事件自身的 group 字段 ——
外部数据源(UptimeRobot)的事件在快照里没有 group 字段,按名字反查才准。

② favicon 提供 WebP(保留原图与 PNG)

先核实了实际情况:assets-src 下三个原图(bike 1.8MB / figure 366KB /
icon 277KB)此前已转成 WebP,public/assets 里唯一的 PNG 是 favicon-shiroko.png。
因此本次只处理 favicon:新增 64×64 WebP(2.7KB,比 PNG 的 5.6KB 省一半)。

**PNG 不删** —— favicon 是浏览器最早的请求,WebP 覆盖虽广但旧浏览器会直接
不显示图标,留 PNG 作回退代价只有几 KB,换来「任何浏览器都有图标」更稳妥。
原图 assets-src/ 完全未动,prepare-artwork.py 可随时重新生成。

页面用两个 <link rel="icon" type=...> 让浏览器按格式自动挑选
(认识 WebP 就取 WebP,否则回落 PNG / SVG)。

③ 顺带修一个既存缺陷
探针的 MIME 表**缺 .webp**,导致三张 webp 素材一直被当作
application/octet-stream 伺服(能显示但类型不对)。已补。

测试:verify-views 49→52 项(事件随页签过滤、切回全部恢复、无事件时清空 DOM)。
verify.cjs 实为 24 项(此前 README 记的 17 是旧数据)。全项目 8 套 346 项通过。
This commit is contained in:
tamakyi
2026-10-14 17:35:01 +08:00
parent 20b499c350
commit bf27f7b385
11 changed files with 1918 additions and 664 deletions
+1
View File
@@ -77,6 +77,7 @@ const MIME = {
'.png': 'image/png',
'.jpg': 'image/jpeg',
'.ico': 'image/x-icon',
'.webp': 'image/webp',
'.woff2': 'font/woff2',
};