面条实验室
使用 Astro + Telegram Channel + SepiaTemplate 做了一个微博客。 浏览器端做到了 0 JS, 也可以加入 no-JS Club 了。 https://memo.miantiao.me/
GitHub
BroadcastChannel/README.zh-cn.md at main · miantiao-me/BroadcastChannel
Turn your Telegram Channel into a MicroBlog. Contribute to miantiao-me/BroadcastChannel development by creating an account on GitHub.
在给 BroadcastChannel 做 no-JS 的时候，遇到几个有趣点：
1. 防剧透 模式和移动端搜索框隐藏展示，使用的 CSS ":checked 伪类" 和 "+ 紧邻兄弟组合器" 实现的，可以参考： https://www.tpisoftware.com/tpu/articleDetails/2744
2. 过渡动画使用的 CSS View Transitions , 参考 https://liruifengv.com/posts/zero-js-view-transitions/
3. 图片灯箱用的 HTML 的 popover 属性，参考: https://developer.mozilla.org/zh-CN/docs/Web/HTML/Global_attributes/popover
4. 访问统计使用一个 1px 的透明图片做 LOGO 背景，上古技术了，现在几乎没有访问统计软件支持了
5. 禁止浏览器端 JS 运行，使用的 Content-Security-Policy 的 script-src 'none' 参考： https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/script-src
1. 防
2. 过渡动画使用的 CSS View Transitions , 参考 https://liruifengv.com/posts/zero-js-view-transitions/
3. 图片灯箱用的 HTML 的 popover 属性，参考: https://developer.mozilla.org/zh-CN/docs/Web/HTML/Global_attributes/popover
4. 访问统计使用一个 1px 的透明图片做 LOGO 背景，上古技术了，现在几乎没有访问统计软件支持了
5. 禁止浏览器端 JS 运行，使用的 Content-Security-Policy 的 script-src 'none' 参考： https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/script-src
Tpisoftware
CSS：利用Checked原理實現Toggle Switch
表單常會帶有一些控制元件，讓使用者填寫更加直覺，例如：checkbox，今天就來介紹如何使用純CSS將checkbox變成Toggle Switch吧。
👍10❤1
之前看到的 Landing Page 都是花里胡哨的风格，这次看到一个 shacdcn-ui 风格的 ConvertFast UI。
开源的，分享一下：
https://s.mt.ci/convert-fast-ui
开源的，分享一下：
https://s.mt.ci/convert-fast-ui
👍3
上周用调用模型生成内容，HTML 偷懒直接扔给模型，浪费不少钱。
这周用 sanitize-html 净化 HTML 后，再用 turndown 转成 Markdown，能省一点是一点。
这周用 sanitize-html 净化 HTML 后，再用 turndown 转成 Markdown，能省一点是一点。
Vercel 的 Edge 函数支持自定义部署区域，再通过 DoH 查询 DNS 记录就可以获取到 DNS 在全球各地的解析结果。
于是我用这个特性搞了 DNS.Surf , 但是 Vercel Edge 函数计费很迷很容易把免费额度用完，干脆直接开源了吧。有兴趣的可以自己部署
https://github.com/ccbikai/DNS.Surf
于是我用这个特性搞了 DNS.Surf , 但是 Vercel Edge 函数计费很迷很容易把免费额度用完，干脆直接开源了吧。有兴趣的可以自己部署
https://github.com/ccbikai/DNS.Surf
GitHub
GitHub - ccbikai/DNS.Surf: Querying DNS Resolution Results in Different Regions Worldwide.
Querying DNS Resolution Results in Different Regions Worldwide. - ccbikai/DNS.Surf
👍2
看到 @VersunPan 推荐 Terminus (一个 Homelab 管理系统), 看了下介绍，架构很吸引人，而且 UI 也很棒，还内置了漂亮的应用，准备在攒的新设备上试一下。
已经收录到 Awesome Homelab
https://www.awesome-homelab.com/products/beclab/Terminus
已经收录到 Awesome Homelab
https://www.awesome-homelab.com/products/beclab/Terminus
👍3
最近尝试把部署在 Cloudfalre, Vercel, Netlify 上的项目迁移到自己的 VPS 通过 Docker 运行，但是默认打包出来的镜像有 1G 多。花时间优化了一下，降到了 135 MB。
示例项目是一个 Vite SSR 项目（Astro），有兴趣的可以看看
https://chi.miantiao.me/posts/vite-ssr-docker-image-minimal-build/
示例项目是一个 Vite SSR 项目（Astro），有兴趣的可以看看
https://chi.miantiao.me/posts/vite-ssr-docker-image-minimal-build/
chi.miantiao.me
Vite SSR 项目 Docker 镜像最小化打包方案 | 面条实验室
👍4❤1