#1

我的第一块键盘是薄膜键盘，「罗技 Logitech K310」。这款键盘我在本科时用了三年，尽管使用频繁却依然完好无损。它具备防水功能，耐用且价格实惠，但手感一般，且键盘敲击声较大。记得当时用笔记本电脑办公和打游戏（如 Dota2 和激战2）时，笔记本温度高得烫手，导致我不得不购买一块外接键盘。现在回顾，满是回忆。

#2

后来，我攒钱买了「Filco Minila Air」机械键盘，红轴，手感极佳。让我迷上了迷你键盘的紧凑简洁布局，换了侧刻键帽之后，外观更简洁美观。缺点是产品太老，使用两节五号电池供电，没有 type c 接口，偶尔会有些不方便。

随着时间推移，我发现机械键盘在办公环境中略显吵闹，且有些按键偶尔会出现双击现象，就动了换键盘的心思。

#3

经过一番挑选，换了「NIZ 宁芝 82 」静电容键盘。这款确实安静不少，触感绵绵的，网上有人称其为「踩雪感」，确实贴切。缺点是键盘有些厚，打字时需要配手托。

由于工作需求，经常需要移动办公，我逐渐发现自己更喜欢 MacBook Pro 自带的键盘（键程1mm）。尝试了家里的 ThinkPad X1 Carbon 键盘后，我更确认自己喜欢的键程大约在1.5mm左右。尽管短轴机械键盘和薄膜键盘都在这个区间，但我并不迷恋机械键盘的声音和手感，因此选择轻巧的薄膜键盘更为合适。

#4

最终，我选择了「罗技 MX Keys Mini for Mac」 。这款键盘对我而言堪称完美，打字手感极佳，准确高效，非常适合码字。按键声音不大，能够快速切换设备，键盘扁平不需要手托，使得桌面空间更加简洁。我甚至尝试用 MX Keys Mini 打游戏，只要不是竞技性太高的游戏，这块键盘依然非常舒适。

K310 是一款水桶键盘，当时我并不了解自己的需求。购买 Minila Air 的时候则更多的是收网上帖子的影响，他们鼓吹着这款键盘的优秀。它看上去很美，但我其实没那么喜欢。到了 NIZ 82，我才逐渐有了自己对舒适度的定义，脑中开始有了理想键盘的轮廓。并最终购买了 MX Keys Mini。

折腾了一路，从薄膜键盘开始，再到薄膜键盘。

在数字时代，我们的浏览器收藏夹，就如同一个宝库，里面藏着我们曾经因兴趣、工作或学习而保留的无数网站链接。小舒同学，一个浏览器新标签页扩展，帮助您高效地管理这些珍贵的在线资源。通过整洁、直观的界面和强大的功能，通过小舒同学这款强大的浏览器扩展，让您的收藏夹焕发新生。

一键展示管理收藏夹

不需要反复整理和搜索您的主页，小舒同学提供了一种轻松的方法来展示和管理您的收藏夹。通过在新标签页中，将书签以清晰的图形方式呈现，帮助您聚焦真正重要的事情。无论是微软的 Edge、Google 的 Chrome，还是 Mozilla 的 Firefox，都可以实现一步直观整洁地展示管理您的网络财富。

随时随地的同步空间

小舒同学的同步空间可以让您轻松同步收藏夹，通过同步空间功能，不管您是在工作场合的电脑还是在家里的设备，都可以轻松连接，访问您全部的收藏内容。您的内容将被安全地存储与同步，确保您可以在任何时间访问。网络世界的一切都将由您连接统一，不仅能启动哔哩哔哩，更能直接访问您关注的具体内容。

直观且舒适的重组织

小舒同学以流畅和直观的用户体验，帮您重新组织您的在线生活。我们专注于舒适的交互设计，将您的收藏夹以一种对您有意义的方式进行组织。

小舒同学提供各式各样的卡片形式和布局，让您可以完全按照自己的喜好进行自定义。您可以创建个性化的卡片组合，以满足您的独特需求。

严格隐私保护

小舒同学重视用户的隐私保护，拒绝记录和上传用户数据。在不使用同步空间的情况下，您的收藏夹数据也只在浏览器本地数据中，确保隐私数据的私密性。依托于 Manifest V3，小舒同学严格控制所需权限，保证只加载本地代码，保护用户的安全与私密。

定制个性化新标签页

小舒同学的自由度极高，可以按照用户的喜好进行多种个性化设置。您可以更换壁纸、主题、主题色，甚至可以用自定义 CSS 美化您的标签页。拥有如此高度自定义的新标签页，您的浏览器将成为真正属于您的个性空间。

小舒同学不仅仅是一个简单的收藏夹工具，它改变了我们与网络信息的互动方式，提供了一个更高效、更有组织性的网络生活体验。减少了无谓的折腾，让每一次收藏都变得值得，让每一次浏览都充满发现的喜悦。现在，尝试小舒同学，让您的收藏夹变成您的独特网络资产，发挥它们真正的潜力吧。

追剧：《黑暗荣耀》（第1季+第2季）

韩剧《黑暗荣耀》被称为年度「爽」剧。之所以「爽」，是因为它讲述了一个曾经被校园霸凌的女子，用自己的努力与智慧，若干年后成功复仇的故事。「以暴制暴、以眼还眼、以牙还牙」，全程并没有任何道德说教，施暴者最后都受到了包括但不限于法律、道德、社会地位的惩罚。

令人意想不到的是，该剧的导演也曾经是校园霸凌的施暴者，对，你没看错，是施暴者。很难想象一个施暴者能用如此细腻的镜头语言讲述受害者如何一步步缜密地执行自己的复仇计划，也许，这种冷酷的场面，也只能由施暴者来再现吧？

追完这部剧后，我不禁会拿它来和国内现象级电视剧《狂飙》做对比。同样是惩恶扬善、行侠仗义的题材，《狂飙》剧中体现的人物真实身份几乎都是一片空白。安欣为了等到正义来的那天，头发都白了。剧中鲜有对其他人物生活的描写，他们有各自的职业却一直在剧中「不务正业」，仿佛为了扫黑各行各业的人们都可以翘班当群演。高启强的干嚼咖啡不加糖、老默的棒棒糖也都是用来减压的道具，连反派角色都很努力、内卷。

反观《黑暗荣耀》里大婶为帮助女主实现复仇计划，人到中年居然学会了开车和摄影，连她的女儿都感觉到「妈妈你真酷」，女主文东恩更是从不给自己设限，考上师范、考上公立学校编制，为了接近当年施暴者，跳槽到私立贵族学校。每一个阶段她们的真实身份都有生动的展现，剧情的演绎也都在生活、工作的场景推进。

《狂飙》后的世界真的是我们希望的世界吗？《黑暗荣耀》后的世界，我们很清楚，「请你务必，一而再， 再而三，三而不蝎，千次万次，毫不犹豫地救自己于人间水火。」罗翔老师的这句话，对于文东恩来说，再贴切不过了。

谁都可以放弃你，唯独自己不能放弃自己。

数码产品：西数固态移动硬盘（My Passport）

电脑是MacBook Por M2乞丐版，硬盘存储空间比较小，由于工作原因会用FCPX简单处理一些视频，FCPX对于我来说就是一个视频素材管理器，为视频素材打标签分类管理，似乎是这款软件的独占功能，半年以来那些打好标签的工程文件眼看就要塞满硬盘了，每次都要卸载软件、删除文件为这些工程文件腾地方，电脑速度也慢了很多。

在三星、闪迪、西数等众多固态移动硬盘中我选了西数My Passport 1T版本，Type-C接口，读写速度能够达到1000MB/s，可以把源文件和工程文件放到里面，直接挂载到MacBook上剪辑视频。浅测了下，移动个6G的文件3、4秒钟的事，耐思~

清理了工程文件和原始文件后，立马腾出了100多G的空间，顿时心情舒畅了很多。

相关测评：视频博主剪视频用硬盘怎么选？先说说移动固态硬盘

折腾：关于ChatGPT和我这个独立博客

分享一个ChatGPT的宝藏教程：Hello from Learning Prompt

找了很久了，终于有一个系统介绍 prompt 的文档了。

关于使用方面，我也尝试过很多客户端、插件，最近发现 ChatHub - All-in-one chatbot client 这个谷歌插件不错，支持 ChatGPT 和 New bing 并排显示结果，也可以分别显示，科学上网环境下 ChatGPT 反馈最快，几乎是秒输出结果，非科学上网环境下 New bing 能正常运行，ChatGPT 就歇菜了。New bing 输出结果会以一大堆注释的形式输出，不如 ChatGPT 更像人类的语言。这两个 AI 各有优劣吧，New bing 还是比较重视内容来源的，而 ChatGPT 有时确实是一本正经的胡说八道。

我经常用这个插件折腾 hexo，对于我这种前端小白足够用了，会给出保姆级教程，尤其是会解答一些一般搜索引擎不会告诉你的结果（也许是我没到，至少是一般搜索引擎不容易搜索），比如在 iterm2 里编辑状态下，按 i 键可以插入文本，困扰了很久的问题，ChatGPT 一两句就帮我解决了。

Monitor Pro 是一个全面的资源监控工具，旨在帮助你实时跟踪重要的系统指标并提供直观的展现方式。无论你是什么职业，如果你用 VS Code，请不要错过它。

安装使用

安装后会自动启用该插件。

https://marketplace.visualstudio.com/items?itemName=nexmoe.monitor-pro

屏幕截图

功能特点

• 资源监控
  • CPU 使用率：监控 CPU 利用率的百分比，以了解系统正在利用多少处理能力。
  • CPU 频率：跟踪当前 CPU 频率，以了解系统如何动态调整其处理能力。
  • CPU 温度：（如果可以的话）监控温度。
  • 内存使用：关注计算机的内存消耗情况。
  • 网络使用：跟踪机器上的网络活动，包括传入和传出的数据传输速率。
  • 文件系统使用（Linux、macOS）：提供磁盘的读写速率。
  • 电池百分比和充电状态：如果你使用的是笔记本电脑或便携设备，此功能可让你监控电池电量和充电状态。
  • 操作系统发行版名称
  • 磁盘使用
• 排序：自定义监控资源的显示顺序，方便一目了然地监控它们。
• 刷新间隔：设置更新资源指标的刷新间隔。
• 无布局移位：确保状态栏中元素的位置和大小不会意外改变。
• 远程 SSH 资源监控：你可以在远程 SSH 连接的设备上跟踪重要
  的系统指标。
• 高占用率警报：当任何监控的资源达到高占用水平时，接收警报。
• 仪表板：我希望在一个页面上显示你关心的所有信息，并配备丰富的图表。

愿景

我深知监控信息的重要性，所以我的目标是打造一个最全面、最直观的监控工具，让你轻松掌握系统状态。开发 Monitor Pro 的初衷是为了满足大家对系统监控的各种需求。

同时在未来我也希望集成图表的设计，让这些数据更加直观易懂。你可以通过这些图表清楚地看到系统各项指标的变化趋势和相互关系。这样，你就能轻松地了解系统的性能表现。并能够基于这些指标做出明智的决策。

为什么要开发这款插件？

为了在使用 VS Code 的 Remote SSH 时提供一种全面的资源监控工具，以便更好地管理和监控服务器的状态。

详细参考：https://juejin.cn/post/7284885060338155539

建议反馈

我非常重视用户的反馈和意见，因为它们对于我改进和完善产品至关重要。有好的建议或者遇到了 BUG，请前来反馈：

https://github.com/nexmoe/vscode-monitor-pro/issues

支持我

来 Github 点个 star 或是来 VS Code 市场 给个五星好评吧！

什么是布局偏移

一个十几秒的短视频解释清楚。

更详细的解释是：布局偏移指的是在网页上发生突然变化时，页面中的内容位置发生意外移动的现象。这种情况常常让人感到困扰，因为它会导致阅读中断或误操作。布局偏移通常是由于资源异步加载或动态添加到页面上的 DOM 元素导致的。可能的原因包括具有未知尺寸的图像或视频、字体与其备用字体渲染大小不同，或者第三方广告或小部件动态调整大小。

难受的是，网站在开发过程中的功能通常与用户体验有很大不同。个性化或第三方内容在开发中的行为通常与生产环境中不同，测试图像通常已经存在于开发者的浏览器缓存中，本地运行的 API 调用通常非常快，延迟几乎不可察觉。

什么是 CLS

累积布局偏移 CLS（Cumulative Layout Shift）是一个指标。

是对页面整个生命周期中发生的每个意外布局变化的最大布局变化分数的度量。

CLS 通过测量实际用户遇到布局偏移的频率来帮助解决布局偏移问题。它可以帮助开发者了解布局偏移在真实用户中发生的情况，从而采取相应的措施进行修复。

为什么要优化 CLS

布局偏移是一个非常影响用户体验的问题，通过上面那一个简短的视频也能理解。

布局偏移通常会导致意外点击、页面方向的迷失，最终导致用户受挫。用户往往不会逗留太久。有时也会使用户不按照预计的产品流程走。

通常优化好布局偏移能够很好的提高用户粘性、用户停留时间等指标。

Yahoo! JAPAN News 通过降低 CLS 0.2 分，得到如下成果。

如何降低 CLS

图片等媒体元素占位

在图像、视频等媒体资源元素中始终包含宽度和高度大小属性。或用 CSS 中的 min-height、aspect-ratio 或类似的方式保留所需的空间。

aspect-ratio

可以用来直接指定当前元素的比例。

https://developer.mozilla.org/zh-CN/docs/Web/CSS/aspect-ratio

对浏览器的支持：

padding-bottom

如果考虑浏览器支持问题仍然可以考虑使用目前一个被广泛接受的基解决方案 “Padding-Top Hack”。这个解决方案需要一个父元素和一个绝对型的子元素。然后计算出长宽比的百分比来设置为 padding-top。例如：

1
2
3

<div class="container">  <img class="media" src="..." alt="..."></div>

1
2
3
4
5
6
7
8
9
10

.container {  position: relative;  width: 100%;  padding-top: 56.25%; /* 16:9 Aspect Ratio */}.media {  position: absolute;  top: 0;}

使用不易产生偏移的 CSS

其中 transfrom 表现很好，以下举几个例子。
用例可以在这里找到：https://play.tailwindcss.com/26PxFA6UVI

zoom VS transform: scale

当 zoom 会撑大页面并向右偏移时，transform: scale 只是在原地放大。

margin VS transform: translate

margin 造成父元素变大，transform: translate 只是让当前元素移动。

border VS box-shadow

border 会撑起父元素，而 box-shadow 并不会。

小心你的懒加载

懒加载会引起布局的偏移，如果你在有懒加载长列表的里进行跳转，请小心！
无动画进行跳转，能够一定程度上避免该问题。

小心使用 transition: all

在页面首次加载或者跳转页面时，transition: all 可能会导致元素的 padding 等从参数为 0 开始渲染，照成页面的抖动。

这都是痛：
Commit：表格以及友情链接图标抖动
Commit：修复导航栏抖动问题

标签顺序导致的偏移问题

由于在移动端上优先展示主要内容，因此侧边栏的 markup 位于主要内容的后面；而在更大的屏幕上，则通过设置 CSS order 的方式进行排序，将主要内容移到中间（即第二列），伪代码如下：

1
2
3
4
5
6
7
8
9

export default function MainLayout(props) {  return (    <Container>      <Main className={css`@media screen and (min-width: breakpoint) { order: 0 }`} />      <Left className={css`@media screen and (min-width: breakpoint) { order: -1 }`} />      <Right className={css`@media screen and (min-width: breakpoint) { order: 1 }`} />    </Container>  )}

浏览器在首次绘制时并没有完整解析 DOM、只知道 <Main /> 的存在、但不知道 <Left /> 或者 <Right /> 的存在，才因此将 <Main /> 渲染进第一列而不是第二列；直到第二次绘制时，浏览器才将 <Main /> 渲染进第二列、将 <Left /> 渲染进第一列。

Chrome 并不是一次完整解析 HTML 的，在以下两种情况下，Chrome 会暂停解析、开始渲染和绘制：

1. Chrome 解析器在读取了 65535 字节的 HTML 后暂停
2. Chrome 在遇到 <script> 标签后，会继续读取约 50 个「Token」之后暂停

详细了解请看：优化博客的累计布局偏移（CLS）问题

网页跳转与前进后退缓存

默认情况下，所有浏览器都使用 bfcache，但由于各种原因，有些站点不适合使用 bfcache。有关如何测试和识别阻止 bfcache 使用的任何问题的更多详细信息，请阅读 bfcache 文章。

在你离开后，bfcache 将页面保存在浏览器内存中很短的一段时间，所以如果你返回它们，那么它们将完全恢复为你离开时的样子。这意味着完全加载的页面立即可用，而不会出现任何变化。

现在的 SPA 应用也能很轻易的保证路由跳转页面布局的一致性。记住始终保持你的目录和导航栏在页面的固定位置。

字体

在下载和渲染网络字体之前，通常有两种处理方式：

1. 使用网络字体替代备用字体（FOUT——未样式化文本的闪烁）。
2. 使用备用字体显示“不可见”文本，直到网络字体可用并且文本可见（FOIT——不可见文本的闪烁）。

着两种方式都可能导致布局变化。即使文本是不可见的，它仍然使用备用字体进行布局。这意味着使用该字体的文本块以及周围的内容在网络字体加载时会发生布局变化，与 FOUT 的可见字体完全相同。

以下方法可以帮助你最小化这种问题：

1. 使用 font-display: optional 可以避免重新布局，因为只有在初始布局时网络字体可用时才会使用它。
2. 使用匹配度高的备用字体。例如，使用 font-family: "Google Sans", sans-serif; 将确保在加载"Google Sans"字体时使用浏览器的无衬线备用字体。如果只使用 font-family: "Google Sans" 而不指定备用字体，将使用默认字体，而在 Chrome 上默认字体是"Times"，它是比默认无衬线字体的匹配度更差。
3. 使用新的 size-adjust、ascent-override、descent-override 和 line-gap-override API 来尽量减小备用字体和网络字体之间的大小差异，详细信息请参阅“Improved font fallbacks”文章。
4. 使用 Font Loading API 可以减少获取所需字体的时间。
5. 使用 <link rel=preload> 尽早加载关键的网络字体。预加载的字体有更高的机会达到首次绘制，这样就不会发生布局变化。
6. 阅读有关字体最佳实践的“Best practices for fonts”文章。

使用真正的骨架屏

测量 CLS 分数

生产阶段

• Chrome User Experience Report
• PageSpeed Insights
• Search Console (Core Web Vitals report)
• web-vitals JavaScript library

实验阶段

• Chrome DevTools
• Lighthouse
• PageSpeed Insights
• WebPageTest

Lighthouse in DevTools

能够针对移动设备和桌面设备生成网页的实际性能报告，并能够提供关于如何改进相应网页的建议。

在本地开发期间从 DevTools 运行 Lighthouse 非常方便。

PageSpeed Insights

应该就是在线版的 Lighthouse。

Performance in DevTools

性能选项卡在 Chrome 的 DevTools 配置文件的所有页面行为在一段时间内记录。时间轴上会出现一个标记为“Experience”的图层，突出显示布局的变化和发生变化的元素。

Web Vitals extension

最好将 Web vital 扩展视为查找性能问题的抽查工具，而不是全面的调试工具——这是 Chrome 的 DevTools 中的性能选项卡的工作。

结语

作为一个对自己项目有较高要求的人，平常几乎都会接触到布局偏移优化或者 Lighthouse，只不过之前自己瞎折腾的时候还没有 CLS 这个概念，现在算是对 CLS 有了较为清晰的概念了。
CLS 作为一个非常基础的优化指标，在用户体验上非常重要，任何项目都应该针对 CLS 做优化。

如有勘误，请及时指出，感谢！

参考

1. https://web.dev/cls/
2. https://web.dev/optimize-cls
3. https://developers.google.com/publisher-tag/guides/minimize-layout-shift
4. https://web.dev/yahoo-japan-news/
5. https://addyosmani.com/blog/infinite-scroll-without-layout-shifts/
6. https://blog.skk.moe/post/fix-blog-cls/
7. https://developer.mozilla.org/en-US/docs/Web/CSS/aspect-ratio

为什么要谈谈这个比赛

作为一个独立参赛选手，我有幸获得了本比赛的第三名（当然全靠运气，不过也不乏一些方法论）。比赛的奖品嘛，我本来比较看重他的微软实习机会。不过猜测是互联网寒冬的原因，完全没有后续了，没人联系我实习的事情，后续去询问了对接比赛的工作人员、在群里咨询也没有任何情况。

获奖情况

三等奖，就是第三名，奖金 5000 税后 4000，还有一堆实物奖品。还有一个挺好看的玻璃制奖杯。然后就去请室友吃自助餐了。

送来的快递有这么大，路上一个人搬回寝室累死了。

不知道是 11.4 公斤还是 11.4 斤，11.4 斤应该不会搬的我累死吧？

这个比赛是什么

参赛者择长开发，以“后疫情时代的变化与挑战”大主题，聚焦“科技改善生活”、“赋能生产力提高”、“多元与包容”三类主题，开发创意小插件，帮助你我看见更大的世界。

这个比赛的官网 https://edgecontest.microsoft.com/index.html 目前已经不能访问了。其实我们从中可以猜测到这个比赛是 Edge 中国区团队为了丰富 Edge 浏览器的扩展生态而举办的。

一些比赛信息

以下是比较简短且关键的信息，将有助于下面我对比赛的分析。

分析得出的方法论

轻量级技术

简单分析上面比赛信息内四个要求，作为一个技术混子，一眼就能看出什么？没有技术要求！比赛这种形式，在一定时间内需要完成一个项目，确实是非常难完成技术需求高的项目的。大家能发挥的技术都差不太多。我们就不需要把重心放在技术力上了。

产品能力

实用性、易用性、美观性、创新性其实说的就是产品能力。那段时间前不久才开始培养产品能力，正好拿这个比赛试试手。而产品能力又恰好是在比赛里面实现弯道超车的能力。因为参加比赛的有很多都是技术型选手，我确实是比不过人家。

重综合能力

除了产品本身，比赛还要求做 PPT，视频等等，而且产品产出与上架都能为产品加分。则需要行动力和营销能力了。平常喜欢看一些产品人的文章，能大概猜测到作为产品的评审员爱看什么，可以向着那个方向写一下。除此之外，毕竟是一个需要从规划到上线的项目，作为个人参赛，完全就是需要综合能力。

我的项目

这个比赛是在提交截止前几天我才知道的，群友在群里提了一嘴，我才知道（非常感谢群友，不然完全不知道）。

我一想，几天了怎么参加？混吧！但又不能完全摆烂啊，得稍微分析一下，所以有了上一节的那些内容。不过当时也没这么细致的分析，只是简单看了官网然后凭本能做决策。

接下来介绍一下我的参赛项目和当时的一些思考。

Meteor New Tab

在此之前

小舒同学 当时遇到了几个问题

• 命名不够直白，难以瞬间理解名称含义，毕竟当时起名的时候天天看一些文学作品有文人意识在里面。
• 界面没有科技感，因为想打造一种舒适具有禅意的感觉。
• 为了让产品有精神力，用了一些比较任性的口号和宣传。不够直！
• 产品设计没有满足简洁的需求，平铺这种布局形式并不能满足所有人的需求

当时的几个想法

• 英文名，更有科技感
• 界面设计更有科技感
• 产品名称更直白
• 口号更加直白，而不是传递理念
• 产品描述更加直白，而不是传递理念

项目总结

总体来说，参赛项目主要基于小舒同学二次创作。针对不同市场，打造不同的产品形象，更有不同的风格气势。如今 Meteor 仍然还在维护，并朝着向小舒同学越来越远的方向发展。我希望这对孪生兄弟都各具特色。

全篇总结

我认为我是非常幸运的，因为鲜有这样的比赛，评委有很多产品经理。此前我也体验过互联网+之类的比赛，感觉评委没有产品人的那种气息。我在“互联网+” 里面也是显得有点不适应，拿了个校奖就寄了。老师后来安慰我说是 PPT 没念好，答辩的时候没跟评委客气啥的。

这个比赛考察的方向刚好比较适合我，难得有这样的比赛，所以我是非常幸运的，也因为幸运作为个人参赛我才能拿到这样的结果。如果让我去参加什么算法比赛，可能是拿不到什么好结果的。我当然希望以后能有更多这类更加开放，更加百花齐放的比赛。不过我想我已经没机会了，我就要毕业了。回首校园生活，没什么精彩，如此平淡。

右键移动卡片，移动卡片时可以搜索文件夹

比起拖动，更精准。移动到偏远文件夹更快捷

搜索补全，输入时可显示相关提示

同时，搜索框现在失去焦点后会自动收起啦 😊

打开本地文件

现在可以在这里收藏你的 PDF 文件，也能用小舒同学直接打开了 🙂

片状卡片，展示更简洁美观的卡片界面

万番呼吁，它来了

全新分享功能，与你的账号联动

想要把一部分收藏的内容分享给朋友怎么办，简单，点几下就行 🚀

然后就会生成分享链接和二维码了

https://store.chainwon.com/bookmarks/63908420e127c076e239

搜索框自动获取焦点

可控制搜索框是否在打开时获取焦点

打卡全部卡片需要确认

不用再怕误触了

在群里整了个机器人统计打卡，欢迎大家一起来打卡，体验赛博伴学

预览

ToDo

• 自动打卡统计
• 每日结束自动公布今日打卡结果
• 每周结束自动公布本周打卡结果
• 每月结束自动公布本月打卡结果
• 打卡提醒
• 排行榜
• 长期不打卡的惩罚

规则

打卡

1. 常见英语学习软件可直接分享到群内完成自动打卡
2. AI 识别成功的可以打卡
3. 手动在群内发送“打卡”以完成打卡

报告

1. 每天 23:59 会自动在群内通报今日打卡情况
2. 每周周日 23:59 会自动在群内通报本周打卡情况
3. 每月最后一天 23:59 会自动在群内通报本月打卡情况

打卡提醒

满足以下条件则提醒打卡

1. 加机器人好友
2. 今天没打卡
3. 三天内打过卡
4. 每天 22:00 或 23:00

加群体验

忘记一个书签的作用？别怕

现在你可以给书签做笔记备注了，同时可供你在搜索中快速找到。

更加智能的数据备份

现在小舒同学会自动定期帮你备份数据。同时记录你使用的浏览器和版本号，方便你恢复数据。

全新 Transparent 主题

小舒同学的搜索框终于能够自动获取焦点了，方便你更好的使用小舒同学的搜索框

搜索框用键盘选取建议结果

全新上传壁纸

现在，你可以上传跟随你账号同步的壁纸了。

拖动你的文件夹标题

现在你可以通过拖动文件夹标题来进行文件夹排序了

拖动到屏幕按钮上实现跨屏分组排序

喜欢简洁？来试试简洁模式或者我的好兄弟

如图片中一般简洁，仍然基于你的收藏夹生成，不需要手动添加新内容。了解更多：https://xiaoshuapp.com/meteor/
简洁模式在 设置 -> 收藏夹 -> 抽屉模式打开

布局设置，让一个屏幕容纳更多内容

设置 -> 收藏夹 -> 收藏夹布局

小条形卡片，小而强

轻松找到你想找的文件夹

现在搜索建议可以搜索到文件夹，点击即可轻松找你想要的文件夹

数据备份

数据备份（不备份收藏夹内容）到云端，随意切换版本

支持邮箱注册与登录

分享你的搜索引擎

目前只提供了分享功能，更多功能将在稍后的更新中解锁

全新效果器系统

更加易用，更简单的制作与分享

大家好，我们是觅漫者战队，非常荣幸获得了首届 Microsoft Edge 浏览器开拓者大赛的第三名！我是我们战队的唯一一名成员，我的好朋友都叫我折影轻梦或 Nexmoe。我的口号是：“为热爱战斗着，努力学着变得勇敢”。

产品介绍

我们的产品名称为：Meteor New Tab，他的作用和他的口号一致——让你的收藏夹再次伟大。在后疫情时代，线上学习与线上办公的人越来越多。许多用户在网络检索学习，遇见各种各样的“干货”资源，喜欢将相关的网页收藏。但是日积月累，收藏的速度远远大于学习的速度，导致网页越来越难以打理，导致日后检索相关网页特别耗费精力，也让很多优秀的干货资源被压在箱底，再也没有被打开过。

我们开发这样一款产品，希望能够帮助用户将尘封已久的收藏夹拿出来。它可以基于你的收藏夹内容，帮你自动整理到标签页，让你的收藏夹在标签页上一目了然。

产品的灵魂

我们倾听用户的声音，产品的灵魂即来自创作者同样也来自用户。一位用户曾夸赞 Meteor New Tab 理念先进，他说：“与其在信息流中漂泊，不如反刍收藏过的高质量内容。” Meteor New Tab 是逆时代而行之的，我们不再让你筋疲力尽地在信息流中寻找一些新东西，而是让你反刍收藏过的高质量内容来产生新的思考、新的灵感。

还有一位用户曾说：“太棒了，我真的不想折腾拨号页花里胡哨的功能，我只想快速导入链接，然后生成一个简洁的图标。”有时候我们需要思考对我们来说真正重要的是什么。我们所关注的、所热爱的其实早就已经被我们放入在收藏夹中。Meteor New Tab 做的就是让我们重新关注自己。

还有许多用户的评论与反馈也一并帮助我们完善了产品，让 Meteor New Tab 越来越具有产品的灵魂，我们非常感谢他们的支持。

让你更好的使用你的收藏夹

让多个文件夹并行显示，收藏夹也能变看板；进度条功能，自动记录你哔哩哔哩和 Youtube 的播放进度，收藏夹也是你追剧的仪表盘。排序功能，最先看到最近添加的书签。搜索功能，快速找到你想要的书签。还有更多功能，等你来发现。

现代化设计，友好的用户体验

守护隐私，守卫安全：数据无需经过我们的服务器进行存储交互，做到真正强大的隐私安全。

自动跟随系统调整亮色与暗色模式，夜间不会因为突然从黑到白的界面切换导致你的健康问题。

新时代产品，新时代改进。我们倾听用户的声音，你可以参与到我们一起将 Meteor New Tab 变得更好。

让软件工程思维帮助我们构建更好的产品

我们采用增量模型作为产品的开发模型。适合我们这种一个人的小团队。我们会尽心尽力的关注到每个用户的反馈与需求，同时会对用户的反馈进行严格的管理与讨论。最后采取决策。我们会尽量地让 Meteor New Tab 越来越贴近完美。

同时我们也会不断地学习进步，采用最新的技术。我们参考 DevOps 的理念，将开发、测试、运维、部署等环节进行自动化，让我们的产品更加稳定并减少开发人员的工作量。让产品开发效率最大化。我们使用 Github 的最新特性，对产品进行版本控制；使用 Issue，Project 进行需求管理；使用 Github Action 自动测速编译发布。尽量减少人员的参与，让产品开发更加高效。

下载体验

https://xiaoshuapp.com/meteor/

Edge：https://microsoftedge.microsoft.com/addons/detail/bopgggdgdhogemdpoepddaakfgfadjal
Chrome：https://chrome.google.com/webstore/detail/fefnkaabnkfafmmmopbghgejhnieccpm

我的想法

• 英文名，更有科技感
• 界面设计更有科技感
• 产品名称更直白
• 口号更加直白，而不是传递理念
• 产品描述更加直白，而不是传递理念

产品形态

特点

• 🏄不一个个添加：根据收藏夹生成，不用再额外管理一个新标签页
• 🛡️绿色安全隐私强：数据来自于你的收藏夹，不再来自我们的服务器
• 💪功能强大易用：强大的个性化、搜索、小功能，丰富的选项、状态设置

从今天开始，让你的书签变得再次强大

文件夹并行，让收藏夹变看板。进度跟踪，掌握全局

微创新

效果器

高可定制化

看板，并行显示

播放进度条

自动记录你哔哩哔哩（已上线）和 Youtube（暂未上线） 的播放进度

多个空间，随时变换身份

临时使用某个搜索引擎

快速目录

快速定位到你的书签

面向开发者的高级功能

提供无限的自由与可能

发布时间

一个月以内。

目前参加了Edge浏览器开拓者大赛。这个比赛对我很重要，比赛前 20 名才有奖项。每天每个人可以投两次票。希望大家能够支持我的项目。谢谢大家。
https://edgecontest.microsoft.com/worksDetail.html?WorkDataId=a002d0f8-e68a-48c0-a3c4-c7885731bbcd