{"topic":{"id":15651,"title":"murmur 版門門的优化","slug":"murmur","userId":4668,"categoryId":2,"createdAt":"2026-08-27T01:36:32.611Z","bumpedAt":"2026-08-30T01:54:27.340Z","views":591,"postsCount":15,"highestPostNumber":15,"likeCount":0,"closed":false,"pinned":false,"pinnedGlobally":false,"pinnedAt":null,"pinnedUntil":null,"isBanner":false,"excerpt":"引入 CDN 由主页的加载图可以发现，大多数流量走 CDN，跟陈总的米国服务器只传输 40KiB 左右的流量","deletedAt":null,"isAnonymous":false,"isPrivate":false,"isMembersOnly":false,"category":{"id":2,"name":"网站","slug":"website","color":"986a44"},"author":{"id":4668,"username":"IO","name":null,"avatarUrl":null},"realAuthor":{"id":4668,"username":"IO","name":null,"avatarUrl":null},"tags":[]},"posts":[{"id":73297,"postNumber":1,"raw":"### 引入 CDN\r\n![image.png|690x252](/uploads/image/53/d4/53d4d0144cac6cb451455631b49cb26bac05430479aed56a08ef3551bba0cce4.avif)\r\n由主页的加载图可以发现，大多数流量走 CDN，跟陈总的米国:elephant:服务器只传输 40KiB 左右的流量\r\n\r\n\r\n### 支持 JXL\r\n我之前聊过：\r\n[quote=\"IO, post:13, topic:15591\"]\r\n根据不同的浏览器 UserAgent，服务器发送支持的格式。\r\n另外 AVIF 虽然压缩率比较高，浏览器广泛支持，但也存在一些问题：\r\n- 压缩/转码成 avif 较慢。\r\n- 不支持 progrssive decoding，导致没法在网络较慢时像 jpg 一样一行一行地加载，只能全部下载后才能加载。\r\n比较理想的是 jpeg-xl，支持 progressive decoding, encoding 较快。\r\n[/quote]\r\n\r\n考虑到 [ Firefox 157 版将默认支持 JXL](https://www.phoronix.com/news/Firefox-JPEG-XL-2026-Plans)，murmur 未雨绸缪，提前支持 JXL 格式，根据 Accept header 自动发送合适的格式，拓展名不变，还是`.avif`。\r\n\r\n测试\r\n```\r\ncurl -I \"https://kr.pig2.de/uploads/image/f7/03/f703a8e02406c5321e2b1b680898d7706ddff92bcc45783ed2ddd630e4e1a42e.avif\" \\\r\n -H \"Accept: image/jxl,image/avif,image/webp\"\r\n\r\nHTTP/2 200 \r\naccess-control-allow-origin: *\r\naccess-control-allow-origin: *\r\nalt-svc: h3=\":443\"; ma=2592000\r\ncache-control: public, max-age=31536000, immutable\r\ncache-control: public, max-age=31536000, immutable\r\ncontent-type: image/jxl\r\ndate: Thu, 27 Aug 2026 01:41:54 GMT\r\netag: W/\"877996fde3b1300e\"\r\nserver: JXLify\r\nvary: Accept, User-Agent\r\nvary: origin, access-control-request-method, access-control-request-headers\r\nvia: 1.1 Caddy\r\nx-compression-rate: 1.22\r\nx-original-format: avif\r\nx-served-format: jxl\r\ncontent-length: 1095\r\n```\r\n经浏览器模拟 throttle，JXL 的渐进加载跟 JPG 的一行一行加载不一样，而是从上到下，从左到右的网格形式的渐进加载。同时 AVIF 等其他图片格式继续保留加载时的占位符，防止图片加载后文本位置发生变化。\r\n[grid mode=\"tile\"]\r\n![image.png|457x500](/uploads/image/7c/3b/7c3b820d4f83a9a9a8eb78d4cf1ec1fc627a39aaef65696f1ed15bd5818bc0ae.avif)\r\n![image.png|690x378](/uploads/image/59/3b/593b78809c80713f22d737a7e9196fecfb4ab0679982e2fefcca9bc3d2eb3a83.avif)\r\n[/grid]\r\n\r\n目前服务器响应的图片格式顺序：JXL ~> AVIF > WEBP > JPG/PNG/GIF\r\nhttps://hacks.mozilla.org/2026/08/intent-to-ship-jpeg-xl/ JXL 未必在所有场景下大小都比 AVIF 小，但相对编码速度较快，支持渐进加载，体验方式：\r\n[quote=\"IO, post:13, topic:15591\"]\r\n最新版 Chrome/Firefox 并需要启用 experimental setting：\r\n- Chrome：\r\n访问 chrome://flags/\r\nenable-jxl-image-format\r\n- Firefox：(手机版需 Firefox Beta)\r\n访问 about:config\r\nimage.jxl.enabled\r\n[/quote]","cooked":"

引入 CDN

$\"image.png\"$
\n由主页的加载图可以发现，大多数流量走 CDN，跟陈总的米国🐘服务器只传输 40KiB 左右的流量

支持 JXL

我之前聊过：

\n\t\t\t\t\t\t\t

\n\t\t\t\t\t\t\t\t

\n\t\t\t\t\t\t\t\t\t

\n\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t

\n\t\t\t\t\t\t\t\t\tIO:\n\t\t\t\t\t\t\t\t

\n\t\t\t\t\t\t\t\t

\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t

\n\t\t\t\t\t\t\t

\n
根据不同的浏览器 UserAgent，服务器发送支持的格式。
\n另外 AVIF 虽然压缩率比较高，浏览器广泛支持，但也存在一些问题：
\n
\n
压缩/转码成 avif 较慢。
\n
不支持 progrssive decoding，导致没法在网络较慢时像 jpg 一样一行一行地加载，只能全部下载后才能加载。
\n比较理想的是 jpeg-xl，支持 progressive decoding, encoding 较快。
\n
\n

\n\t\t\t\t\t\t

考虑到 Firefox 157 版将默认支持 JXL，murmur 未雨绸缪，提前支持 JXL 格式，根据 Accept header 自动发送合适的格式，拓展名不变，还是.avif。

测试

curl -I \"https://kr.pig2.de/uploads/image/f7/03/f703a8e02406c5321e2b1b680898d7706ddff92bcc45783ed2ddd630e4e1a42e.avif\" \\\n  -H \"Accept: image/jxl,image/avif,image/webp\"\n\nHTTP/2 200 \naccess-control-allow-origin: *\naccess-control-allow-origin: *\nalt-svc: h3=\":443\"; ma=2592000\ncache-control: public, max-age=31536000, immutable\ncache-control: public, max-age=31536000, immutable\ncontent-type: image/jxl\ndate: Thu, 27 Aug 2026 01:41:54 GMT\netag: W/\"877996fde3b1300e\"\nserver: JXLify\nvary: Accept, User-Agent\nvary: origin, access-control-request-method, access-control-request-headers\nvia: 1.1 Caddy\nx-compression-rate: 1.22\nx-original-format: avif\nx-served-format: jxl\ncontent-length: 1095\n

经浏览器模拟 throttle，JXL 的渐进加载跟 JPG 的一行一行加载不一样，而是从上到下，从左到右的网格形式的渐进加载。同时 AVIF 等其他图片格式继续保留加载时的占位符，防止图片加载后文本位置发生变化。

$\"image.png\"$
\n $\"image.png\"$

目前服务器响应的图片格式顺序：JXL ~> AVIF > WEBP > JPG/PNG/GIF
\nIntent to Ship: JPEG XL – Mozilla Hacks - the Web developer blog JXL 未必在所有场景下大小都比 AVIF 小，但相对编码速度较快，支持渐进加载，体验方式：

\n\t\t\t\t\t\t\t

\n\t\t\t\t\t\t\t\t

\n\t\t\t\t\t\t\t\t\t

\n\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t

\n\t\t\t\t\t\t\t\t\tIO:\n\t\t\t\t\t\t\t\t

\n\t\t\t\t\t\t\t\t

\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t

\n\t\t\t\t\t\t\t

\n
最新版 Chrome/Firefox 并需要启用 experimental setting：
\n
\n
Chrome：
\n访问 chrome://flags/
\nenable-jxl-image-format
\n
Firefox：(手机版需 Firefox Beta)
\n访问 about:config
\nimage.jxl.enabled
\n
\n

\n\t\t\t\t\t\t

\n","createdAt":"2026-08-27T01:36:32.611Z","updatedAt":"2026-08-27T06:23:53.939Z","replyToPostNumber":null,"replyCount":1,"likeCount":0,"wordCount":463,"liked":false,"bookmarked":false,"polls":[],"reactions":[{"reaction":"❤️","count":1,"users":[{"id":7830,"username":"stateless_trash_can","name":"无状态垃圾桶"}],"hasReacted":false},{"reaction":"👍️","count":1,"users":[{"id":7830,"username":"stateless_trash_can","name":"无状态垃圾桶"}],"hasReacted":false},{"reaction":"🥰","count":1,"users":[{"id":7830,"username":"stateless_trash_can","name":"无状态垃圾桶"}],"hasReacted":false}],"wiki":false,"version":11,"publicVersion":11,"deletedAt":null,"isAnonymous":false,"user":{"id":4668,"username":"IO","name":null,"avatarUrl":null,"admin":true,"moderator":false,"signatureRaw":"","signatureCooked":null}},{"id":73306,"postNumber":2,"raw":"回帖时没选择匿名发布怎么也会变成 anonymous\r\n——发自紫金港第一皮革鱼","cooked":"

回帖时没选择匿名发布怎么也会变成 anonymous
\n——发自紫金港第一皮革鱼

\n","createdAt":"2026-08-28T07:16:23.660Z","updatedAt":"2026-08-28T07:16:23.660Z","replyToPostNumber":1,"replyCount":1,"likeCount":0,"wordCount":28,"liked":false,"bookmarked":false,"polls":[],"reactions":[],"wiki":false,"version":1,"publicVersion":1,"deletedAt":null,"isAnonymous":true,"user":{"id":2191,"username":"anonymous","name":null,"avatarUrl":null,"admin":false,"moderator":false}},{"id":73307,"postNumber":3,"raw":"抽象","cooked":"

抽象

\n","createdAt":"2026-08-28T09:10:04.030Z","updatedAt":"2026-08-28T09:10:04.030Z","replyToPostNumber":2,"replyCount":1,"likeCount":0,"wordCount":2,"liked":false,"bookmarked":false,"polls":[],"reactions":[],"wiki":false,"version":1,"publicVersion":1,"deletedAt":null,"isAnonymous":false,"user":{"id":4668,"username":"IO","name":null,"avatarUrl":null,"admin":true,"moderator":false,"signatureRaw":"","signatureCooked":null}},{"id":73308,"postNumber":4,"raw":"测试一下是不是还是这样（发自皮革鱼）","cooked":"

测试一下是不是还是这样（发自皮革鱼）

\n","createdAt":"2026-08-28T10:20:50.113Z","updatedAt":"2026-08-28T10:20:50.113Z","replyToPostNumber":3,"replyCount":1,"likeCount":0,"wordCount":18,"liked":false,"bookmarked":false,"polls":[],"reactions":[],"wiki":false,"version":1,"publicVersion":1,"deletedAt":null,"isAnonymous":true,"user":{"id":2191,"username":"anonymous","name":null,"avatarUrl":null,"admin":false,"moderator":false}},{"id":73310,"postNumber":5,"raw":"手机系统是 iOS18.3.2 用了 Safari 浏览器","cooked":"

手机系统是 iOS18.3.2 用了 Safari 浏览器

\n","createdAt":"2026-08-28T10:21:54.540Z","updatedAt":"2026-08-28T10:21:54.540Z","replyToPostNumber":4,"replyCount":0,"likeCount":0,"wordCount":12,"liked":false,"bookmarked":false,"polls":[],"reactions":[],"wiki":false,"version":1,"publicVersion":1,"deletedAt":null,"isAnonymous":true,"user":{"id":2191,"username":"anonymous","name":null,"avatarUrl":null,"admin":false,"moderator":false}},{"id":73313,"postNumber":6,"raw":"或许发现了新问题：每次进入 chat 都有个登录页面刚才登录过然后退出进入 topics 再打开就又要重新登录😥","cooked":"

或许发现了新问题：每次进入 chat 都有个登录页面刚才登录过然后退出进入 topics 再打开就又要重新登录😥

\n","createdAt":"2026-08-28T10:26:08.888Z","updatedAt":"2026-08-28T10:26:08.888Z","replyToPostNumber":null,"replyCount":0,"likeCount":0,"wordCount":44,"liked":false,"bookmarked":false,"polls":[],"reactions":[],"wiki":false,"version":1,"publicVersion":1,"deletedAt":null,"isAnonymous":true,"user":{"id":2191,"username":"anonymous","name":null,"avatarUrl":null,"admin":false,"moderator":false}},{"id":73321,"postNumber":7,"raw":"1","cooked":"

\n","createdAt":"2026-08-28T15:23:17.687Z","updatedAt":"2026-08-28T15:23:17.687Z","replyToPostNumber":null,"replyCount":1,"likeCount":0,"wordCount":1,"liked":false,"bookmarked":false,"polls":[],"reactions":[],"wiki":false,"version":1,"publicVersion":1,"deletedAt":null,"isAnonymous":true,"user":{"id":2191,"username":"anonymous","name":null,"avatarUrl":null,"admin":false,"moderator":false}},{"id":73322,"postNumber":8,"raw":"当前无法上传图片，报错 Unauthorized，同样，因为权限无法查看我的草稿，无法添加书签，发帖为匿名，无法 log out","cooked":"

当前无法上传图片，报错 Unauthorized，同样，因为权限无法查看我的草稿，无法添加书签，发帖为匿名，无法 log out

\n","createdAt":"2026-08-28T15:24:06.634Z","updatedAt":"2026-08-28T15:24:06.634Z","replyToPostNumber":7,"replyCount":1,"likeCount":0,"wordCount":45,"liked":false,"bookmarked":false,"polls":[],"reactions":[],"wiki":false,"version":1,"publicVersion":1,"deletedAt":null,"isAnonymous":true,"user":{"id":2191,"username":"anonymous","name":null,"avatarUrl":null,"admin":false,"moderator":false}},{"id":73323,"postNumber":9,"raw":"点击聊天卡出去 log out 了，再登陆就好了","cooked":"

点击聊天卡出去 log out 了，再登陆就好了

\n","createdAt":"2026-08-28T15:27:23.607Z","updatedAt":"2026-08-28T15:29:24.424Z","replyToPostNumber":8,"replyCount":1,"likeCount":0,"wordCount":17,"liked":false,"bookmarked":false,"polls":[],"reactions":[],"wiki":false,"version":1,"publicVersion":1,"deletedAt":null,"isAnonymous":false,"user":{"id":5351,"username":"Xrystal-line","name":"羽流弦ノ迹","avatarUrl":"/uploads/image/72/98/7298d3ea7916b6c479dd74ed59ccee4a89ee2837db7815cc98da181331487296.avif","admin":false,"moderator":false,"signatureRaw":"

\nCrystal Clear

","signatureCooked":"

\nCrystal Clear

"}},{"id":73326,"postNumber":10,"raw":"点击 chat 后出现登录页面成功登录后点击具体群聊为什么还会出现登录页面🤯\r\n发自皮革鱼","cooked":"

点击 chat 后出现登录页面成功登录后点击具体群聊为什么还会出现登录页面🤯
\n发自皮革鱼

\n","createdAt":"2026-08-29T04:30:56.084Z","updatedAt":"2026-08-29T04:30:56.084Z","replyToPostNumber":9,"replyCount":1,"likeCount":0,"wordCount":38,"liked":false,"bookmarked":false,"polls":[],"reactions":[],"wiki":false,"version":1,"publicVersion":1,"deletedAt":null,"isAnonymous":true,"user":{"id":2191,"username":"anonymous","name":null,"avatarUrl":null,"admin":false,"moderator":false}},{"id":73329,"postNumber":11,"raw":"确实，bug 还在","cooked":"

确实，bug 还在

\n","createdAt":"2026-08-29T11:39:07.226Z","updatedAt":"2026-08-29T11:39:07.226Z","replyToPostNumber":10,"replyCount":0,"likeCount":0,"wordCount":5,"liked":false,"bookmarked":false,"polls":[],"reactions":[],"wiki":false,"version":1,"publicVersion":1,"deletedAt":null,"isAnonymous":true,"user":{"id":2191,"username":"anonymous","name":null,"avatarUrl":null,"admin":false,"moderator":false}},{"id":73333,"postNumber":12,"raw":"FYI，我还在用 `kr.pig2.de`，主域名还有一些功能有问题，比如文件上传","cooked":"

FYI，我还在用 kr.pig2.de，主域名还有一些功能有问题，比如文件上传

\n","createdAt":"2026-08-29T17:30:20.652Z","updatedAt":"2026-08-29T17:30:20.652Z","replyToPostNumber":null,"replyCount":0,"likeCount":1,"wordCount":25,"liked":false,"bookmarked":false,"polls":[],"reactions":[{"reaction":"❤️","count":1,"users":[{"id":4668,"username":"IO","name":null}],"hasReacted":false}],"wiki":false,"version":1,"publicVersion":1,"deletedAt":null,"isAnonymous":false,"user":{"id":7830,"username":"stateless_trash_can","name":"无状态垃圾桶","avatarUrl":"/uploads/image/f4/69/f469375c27cd72c6970425e94b999be00fed8fe6234b977b14f5bdb65da24b4e.avif","admin":false,"moderator":false,"signatureRaw":"

","signatureCooked":"

"}},{"id":73338,"postNumber":13,"raw":"再试一下呢","cooked":"

再试一下呢

\n","createdAt":"2026-08-30T00:30:28.147Z","updatedAt":"2026-08-30T00:43:31.167Z","replyToPostNumber":null,"replyCount":1,"likeCount":0,"wordCount":5,"liked":false,"bookmarked":false,"polls":[],"reactions":[],"wiki":false,"version":2,"publicVersion":2,"deletedAt":null,"isAnonymous":false,"user":{"id":4668,"username":"IO","name":null,"avatarUrl":null,"admin":true,"moderator":false,"signatureRaw":"","signatureCooked":null}},{"id":73339,"postNumber":14,"raw":"不知道为什么每次点击聊天入口就会需要登录，即使右上角一直显示着头像（即正常情况下的登录状态）","cooked":"

不知道为什么每次点击聊天入口就会需要登录，即使右上角一直显示着头像（即正常情况下的登录状态）

\n","createdAt":"2026-08-30T00:51:30.689Z","updatedAt":"2026-08-30T00:51:30.689Z","replyToPostNumber":13,"replyCount":1,"likeCount":0,"wordCount":46,"liked":false,"bookmarked":false,"polls":[],"reactions":[],"wiki":false,"version":1,"publicVersion":1,"deletedAt":null,"isAnonymous":true,"user":{"id":2191,"username":"anonymous","name":null,"avatarUrl":null,"admin":false,"moderator":false}},{"id":73341,"postNumber":15,"raw":"我刚刚也出现了一次这个情况，但是之后就正常了","cooked":"

我刚刚也出现了一次这个情况，但是之后就正常了

\n","createdAt":"2026-08-30T01:54:27.340Z","updatedAt":"2026-08-30T01:54:27.340Z","replyToPostNumber":14,"replyCount":0,"likeCount":0,"wordCount":22,"liked":false,"bookmarked":false,"polls":[],"reactions":[],"wiki":false,"version":1,"publicVersion":1,"deletedAt":null,"isAnonymous":false,"user":{"id":30,"username":"一只玉米人","name":"玉米🌽","avatarUrl":"/uploads/blob/14/96/14961aeaa46ccbb75a61eec0c27b26e74fb5d1c00ccdcbbe898ca9ea37087dd6.svg","admin":false,"moderator":true,"signatureRaw":"*年月擦身过，暂且问，会更好吗？*","signatureCooked":"

年月擦身过，暂且问，会更好吗？

\n"}}],"hasMore":false,"lastReadPostNumber":15,"hasUrlPostNumber":true}