BroadcastChannel - 将你的 Telegram Channel 转为微博客

之前一直在 X 分享一些有趣的工具，而且也会同步到 Telegram Channel 上。看到 Austin 说准备建立一个网站，把分享内容都收录进去。 刚好想到最近看到的一个模板 Sepia，就想到把 Telegram Channel 转成微博客。

难度不大，主功能一个周末就搞完了。过程中做到了浏览器端 0 JS, 分享一些有趣的技术点：

1. 防剧透模式和移动端搜索框隐藏展示，使用的 CSS “:checked 伪类” 和 ”+ 紧邻兄弟组合器” 实现的，参考

2. 过渡动画使用的 CSS View Transitions, 参考

3. 图片灯箱用的 HTML 的 popover 属性，参考

4. 返回顶部的展示和隐藏使用 CSS animation-timeline 实现 Chrome 115 以上版本专属，参考

5. 多图瀑布流布局，使用 grid 布局实现，参考

6. 访问统计使用一个 1px 的透明图片做 LOGO 背景，上古技术了，现在几乎没有访问统计软件支持了

7. 禁止浏览器端 JS 运行，使用的 Content-Security-Policy 的 script-src ‘none’ 参考

搞完以后，就直接开源了，很意外有那么多人喜欢，一周就收获了 800+ 的 star 了。

如果你也有兴趣，可以去 GitHub 上看看。

https://github.com/ccbikai/BroadcastChannel