
MS-ToDo Hub — 产品介绍
MS-ToDo Hub 产品速览:一页看懂核心功能与亮点,完整的产品说明与技术实现见系列文章。
阅读量MS-ToDo Hub — 产品介绍
新标签,新起点,新世界
将微软待办的强大功能、精美的桌面新标签页、RSS 信息聚合与极致简洁的设计完美结合,让每一次浏览器打开都成为效率与灵感的起点!
一、产品概述
MS-ToDo Hub 是一款基于 Chrome MV3 架构的效率型浏览器扩展,以替代浏览器默认新标签页为入口,集成了 微软待办云端同步、桌面导航首页、RSS 信息聚合、思维导图、数据看板 五大核心模块,辅以天气、时钟、番茄钟、便签、每日一言、节日特效等丰富的桌面小组件,致力于打造一站式的工作与生活效率平台。
- 当前版本:v5.4.8
- 支持浏览器:Chrome / Edge / Firefox
- 支持语言:中文 / English
- 官网地址:https://mstodo.dpdns.org
二、核心功能模块
2.1 微软待办 — 云端同步任务管理
与 Microsoft To-Do 深度集成,通过 Microsoft Graph API 实现任务的云端双向实时同步,让任务管理跨设备无缝衔接。
核心能力
| 功能 | 说明 |
|---|---|
| OAuth 安全登录 | 通过微软官方 OAuth 2.0 授权,支持国际版与中国版账号切换 |
| 双向实时同步 | 在线时自动与微软待办云端同步,离线时本地照常使用 |
| 智能冲突解决 | 基于时间戳的智能合并机制,数据永不丢失 |
| 操作级增量同步 | 只同步变更内容,省流量更高效 |
| 离线无忧使用 | 基于 IndexedDB(Dexie.js)的本地缓存,网络中断不影响核心功能 |
任务管理
- 多级任务体系:支持列表 → 任务 → 子任务三级结构,复杂项目轻松拆解
- 智能排序筛选:按创建时间、重要性、截止日期、名称排序,支持手动拖拽排序
- 列表锁定保护:私密列表一键加锁,需通过眼睛图标解锁才能查看内容
- 任务到期提醒:基于 chrome.alarms 的精准提醒,到期自动推送桌面通知,点击通知可直接跳转到对应任务
- 全局搜索:支持列表名称、任务标题、子任务标题的全文搜索,搜索结果高亮显示,快捷键
Ctrl/Cmd + F一键唤起 - Emoji 图标:为任务自动匹配精美 Emoji 图标,视觉识别更直观
- 拖拽排序:支持任务与子任务的拖拽排序,操作流畅自然
隐私与安全
- 敏感数据始终存储在本地
- 加锁列表保护隐私内容
- 透明数据流向,完全掌控个人信息
- 退出登录时清除所有本地缓存数据
2.2 桌面模式 — 精美新标签导航首页
将浏览器新标签页打造为个性化的效率桌面,集网站导航、搜索引擎、实用小组件于一体。
网站导航
- 标签分组管理:收藏网站按标签分组(如视频、AI、图片等),左侧标签栏一键切换
- 拖拽排序:支持网站卡片与标签分组的拖拽排序
- 自定义网站:添加、编辑、删除收藏网站,支持自定义图标(自动获取 / 网络链接 / 本地上传三种模式)
- 标签快捷选择:编辑网站时可从已有标签快捷选择,也可输入新标签
- 云端同步:收藏网站数据通过 Microsoft To-Do 的 “Todo-Desktop” 列表实现云端同步,多设备共享
搜索引擎
- 内置 6 大引擎:Bing、百度、Google、DuckDuckGo、ChatGPT、DeepSeek
- 自定义引擎:支持添加自定义搜索引擎
- 引擎快捷切换:搜索框下方横排展示引擎栏,一键切换
- 引擎管理:支持编辑内置引擎名称与地址、删除不需要的引擎
背景个性化
- 4 种背景来源:内置精选壁纸(4 张)、必应每日一图、纯色背景、自定义上传图片
- 背景透明度调节:滑块控制背景不透明度(10%~100%)
- 图片切换:一键切换下一张背景图
视觉效果
- 空闲特效:用户空闲一段时间后自动触发沉浸式视觉效果
- ❄️ 雪花飘落
- 🌧️ 下雨效果
- 🌸 樱花飘落
- ✨ 萤火虫闪烁
- 空闲触发时间:可自定义空闲等待时间(30 秒 ~ 10 分钟)
- 毛玻璃效果:UI 组件采用毛玻璃风格,视觉更通透
展示设置
- 网站图标大小调节(32px ~ 72px)
- 宫格间距调节(4px ~ 32px)
- 宫格宽度调节(860px ~ 1600px)
- 网站名称字体颜色自定义
- 隐藏/显示网站卡片背景
- 网站导航栏显示/隐藏
2.3 桌面小组件
🌤️ 天气预报
- 数据源:通过 Cloudflare Worker 代理访问 Open-Meteo 免费接口,无需 API Key
- 当前天气:左上角展示天气图标、实时温度、城市名称
- 悬浮详情面板:
- 体感温度、相对湿度、风速详情
- 今天 + 未来 5 天天气预报(逐日:星期 + 图标 + 温度区间)
- 城市设置:支持城市搜索与浏览器自动定位
- 智能缓存:1 小时缓存有效期,30 分钟自动刷新,切回前台自动检查数据新鲜度
- 昼夜区分:天气图标根据白天/夜晚自动切换
🕐 时钟组件
- 搜索框下方展示实时时间与日期
- 支持 24H / 12H 格式切换
- 时钟颜色自定义(支持恢复默认)
- 每分钟自动刷新
💬 每日一言
- 100+ 精选语录:涵盖励志、人生、智慧、成长、平静、圣经箴言六大分类
- 中英双语:界面语言自动跟随,同一条语录提供中英双版本
- 分类筛选:可选择只看某一分类
- 字号调节:滑块控制语录字号(12px ~ 20px)
- 颜色自定义:语录字体颜色可自由设定
- 每日更新:基于日期种子算法,同一天显示同一条语录
🍅 番茄钟
- 25 分钟专注计时:全屏沉浸式覆盖层,SVG 圆环进度动画
- 持久化计时:基于时间戳,刷新页面或打开新标签页自动恢复倒计时
- 完成提醒:计时结束播放提示音 + 脉冲动画
- 今日统计:显示今日完成的番茄数量
📝 便签
- 富文本编辑:支持文字 + 图片的便签编辑
- 多栏布局:支持单栏、双栏、三栏三种布局切换
- 新增/删除便签:自由管理多条便签
- 自动保存:输入防抖 500ms,内容自动持久化到 IndexedDB
- 图片支持:便签中可插入图片,图片 Blob 与文本分离存储
- 本地存储:所有便签数据存储在本地,保护隐私
📡 RSS 阅读入口
- 在桌面模式的“全部”标签页中,RSS 作为工具卡片入口展示
- 点击即可打开独立的 RSS 阅读器页面
2.4 RSS 信息聚合阅读器
独立的 RSS/Atom 订阅阅读器,三列布局设计,提供沉浸式的阅读体验。
核心功能
| 功能 | 说明 |
|---|---|
| 订阅管理 | 添加、编辑、删除 RSS 订阅源,支持自定义标签分组 |
| RSS/Atom 解析 | 完整支持 RSS 2.0 与 Atom 格式的自动识别与解析 |
| OPML 导入/导出 | 支持从 OPML 文件批量导入订阅,也可导出为 OPML 备份 |
| 云端同步 | 订阅数据通过 Microsoft To-Do 的 “Todo-RSS” 列表实现云端同步 |
| 批量刷新 | 一键刷新所有订阅源,后台并行抓取,高效快速 |
| 三列布局 | 订阅源列表 → 文章列表 → 文章详情,阅读体验清晰流畅 |
| 标签分组 | 订阅源按标签分组,侧边栏标签导航快速筛选 |
| 已读/未读管理 | 自动标记已读文章,支持一键全部标记已读 |
| 收藏功能 | 重要文章一键收藏,独立收藏视图查看 |
| 全文搜索 | 支持在标题、摘要、正文中搜索关键词 |
| 多种排序 | 按日期降序/升序、标题升序排列 |
| 系统默认源 | 首次使用自动订阅 IT之家、爱范儿、少数派、Solidot 等 10+ 优质科技资讯源 |
技术特点
- 通过 Background Service Worker 代理抓取 RSS,绕过 CORS 限制
- 批量 IPC 消息通信,减少通信开销
- 文章去重机制,基于内容哈希
- 自动提取文章封面图
- 相对时间展示(刚刚、几分钟前、几小时前等)
2.5 思维导图
将任务列表转化为可视化思维导图,帮助梳理复杂项目的逻辑结构。
核心功能
- 一键切换:待办列表与思维导图视图一键切换
- 节点层级:支持最多 5 层深度的节点结构
- 节点操作:
Enter创建同级(兄弟)节点Tab创建子节点- 拖拽空白处平移画布
Ctrl/Cmd + 滚轮缩放画布
- Markdown 支持:节点内容支持 Markdown 格式
- 懒加载:首次点击时才加载 ~310KB 模块,不影响首屏性能
- 基于 MindElixir:使用 MindElixir 开源引擎渲染
2.6 数据看板
基于 ECharts 的数据可视化面板,全方位展示任务统计数据。
看板内容
| 图表 | 说明 |
|---|---|
| 概览统计 | 列表数量、任务总数、子任务总数、任务/子任务完成率 |
| 完成趋势 | 近 7 天任务完成趋势折线图(优先使用完成日志精确数据) |
| 状态分布 | 已完成/进行中任务饼图 |
| 列表分布 | 各列表任务数量柱状图(Top 6) |
| 完成率 | 各列表完成率对比 |
| 操作统计 | 今日/累计操作明细(列表点击、任务新增/编辑/完成/删除、子任务操作、API 请求等) |
技术特点
- ECharts ~1MB 懒加载,不影响首屏性能
- 数据来源:IndexedDB 本地缓存 + 完成日志
- 自动日期变更重置今日统计
三、特色功能
3.1 提醒日期与节日系统
- 自定义提醒日期:最多添加 10 个重要日期(如生日、纪念日、节假日)
- 节日自动识别:内置中西方主要节日日历(春节、情人节、圣诞节、元旦等)
- 烟花特效:在提醒日期当天触发全屏烟花庆祝动画
- 节日礼物:节日当天显示礼物按钮,点击弹出节日祝福图片 + 触发烟花特效
- 任务提醒联动:提醒日期与 chrome.alarms 联动,到期自动推送桌面通知
3.2 主题与个性化
- 深色/浅色主题:一键切换,护眼模式随心用
- 30+ 颜色主题:丰富的预设配色方案,满足个性化需求
- 全屏模式:沉浸式全屏体验
- 主题防闪烁:在 CSS/JS 加载完成前预先应用主题,避免白屏闪烁
3.3 快捷键支持
| 快捷键 | 功能 |
|---|---|
Ctrl/Cmd + F |
打开全局搜索 |
ESC |
收起/展开侧边栏、关闭弹窗 |
Enter |
保存/提交、思维导图创建兄弟节点 |
Shift + Enter |
任务编辑换行 |
Tab |
思维导图创建子节点 |
Ctrl/Cmd + 滚轮 |
思维导图画布缩放 |
3.4 多语言支持
- 完整的中文 / English 双语支持
- 基于
_locales目录的标准化 i18n 方案 - 界面语言一键切换,所有模块文案同步切换
- 天气组件、每日一言等均支持中英双语
3.5 帮助中心
- 点击帮助中心按钮,播放小 T 故事视频
- 视频播放完成后自动展示故事图片
- 支持点击遮罩或 ESC 键关闭
3.6 打赏支持
- 支持支付宝、微信支付、PayPal 三种打赏方式
- 弹窗展示二维码,扫码即可打赏
四、技术架构
4.1 整体架构
MS-ToDo Hub
├── 入口页面
│ ├── main.html — 待办列表主页面
│ ├── main-desk.html — 桌面模式独立页面
│ └── main-rss.html — RSS 阅读器独立页面
│
├── 核心模块 (js/core/)
│ ├── api.js — Microsoft Graph API 封装(OAuth + Token + CRUD)
│ ├── main-storage.js — IndexedDB 本地存储(Dexie.js)
│ ├── main-sync.js — 双向同步 + 冲突解决 + 同步锁
│ ├── main-offline.js — 离线管理(本地 CRUD + 同步触发)
│ └── main-i18n.js — 国际化翻译
│
├── 功能模块 (js/functions/)
│ ├── desktop/ — 桌面模式(导航、天气、时钟、番茄钟、便签、特效等)
│ ├── rss/ — RSS 阅读(数据层、云端同步、UI 渲染、检测)
│ ├── search/ — 全局搜索(搜索逻辑 + UI)
│ ├── dashboard/ — 数据看板(统计 + 图表)
│ └── ... — 提醒日期、烟花效果、节日礼物、快捷键、帮助中心
│
├── 支撑模块 (js/support/)
│ ├── background.js — Service Worker(闹钟通知、RSS 代理、OAuth)
│ ├── theme-loader.js — 主题预加载(防闪烁)
│ ├── alarms.js — 任务到期提醒调度
│ └── desktop-*.js — 桌面模式支撑脚本
│
└── 第三方库 (js/plugins/)
├── jquery.min.js — DOM 操作与事件委托
├── dexie.min.js — IndexedDB 封装
├── echarts.min.js — 数据可视化图表
├── MindElixir.iife.* — 思维导图引擎
├── fontawesome.js — 图标库
└── emoji-*.js — Emoji 选择器
4.2 数据存储方案
| 存储方式 | 用途 |
|---|---|
| IndexedDB(Dexie.js) | 列表、任务、子任务缓存,同步队列,完成日志,便签数据,自定义背景图 |
| localStorage | 用户设置(主题、语言、排序、桌面配置等),提醒日期,网站收藏(未登录时) |
| chrome.storage.local | RSS 文章缓存、已读/收藏状态,用户操作统计,RSS 检测开关 |
| Microsoft To-Do 云端 | 登录用户的完整数据同步(待办列表、桌面网站、RSS 订阅) |
4.3 性能优化
- 懒加载:思维导图(~310KB)与数据看板 ECharts(~1MB)按需加载
- 防抖机制:网站变更 500ms 防抖合并后同步,避免频繁 API 调用
- 批量操作:RSS 批量抓取(单次 IPC 消息)、批量统计记录
- 缓存策略:天气数据 1 小时缓存,Bing 背景图按日缓存
- 增量同步:桌面网站变更采用增量同步策略(添加/删除/更新),减少 API 调用
- 字体预加载:
<link rel="preload">确保首帧渲染前字体就绪,消除字抖动 - CSP 兼容:全面适配 MV3 CSP 策略,无内联脚本,所有预加载逻辑使用外部文件
五、权限说明
| 权限 | 用途 |
|---|---|
identity |
Microsoft OAuth 登录授权 |
storage |
本地数据缓存与设置存储 |
alarms |
任务到期提醒闹钟调度 |
notifications |
任务到期桌面通知推送 |
六、适用场景
| 场景 | 说明 |
|---|---|
| 个人任务管理 | 日常待办、购物清单、学习计划,云端同步多设备无缝切换 |
| 效率桌面 | 替代浏览器默认新标签页,集合导航、搜索、天气、时钟于一体 |
| 信息聚合 | RSS 订阅感兴趣的科技、资讯、博客源,一站式阅读 |
| 专注工作 | 番茄钟 25 分钟专注计时,便签随手记录灵感 |
| 项目梳理 | 思维导图可视化拆解复杂项目结构 |
| 数据洞察 | 数据看板直观了解任务完成趋势与效率统计 |
| 隐私保护 | 列表加锁、离线使用,敏感数据安全自主掌控 |
七、产品亮点总结
- 一站式效率平台:待办管理 + 桌面导航 + RSS 阅读 + 思维导图 + 数据看板,五大模块深度整合
- 云端同步:基于 Microsoft Graph API 的双向实时同步,支持离线使用
- 精美桌面:丰富的背景、特效、小组件,让每次打开新标签页都是享受
- 信息聚合:RSS 阅读器 + 天气预报 + 每日一言,一个页面掌握全局
- 隐私优先:本地存储 + 列表加锁 + 透明数据流向
- 极致性能:懒加载 + 防抖 + 批量操作 + 增量同步,流畅不卡顿
- 中英双语:完整的国际化支持,全球用户友好
- 免费使用:核心功能完全免费,无广告干扰
免费使用 · 隐私安全 · 极致体验
每一次打开新标签页,都是一段全新旅程的起点。
- Chrome 应用商店:https://chromewebstore.google.com/detail/icmnmeceeheemlmbmolfendmiieabiac
- Edge 应用商店:https://microsoftedge.microsoft.com/addons/detail/aoodkfaickihogbaooannechhccggnbp
- Firefox 火狐浏览器:https://addons.mozilla.org/zh-CN/firefox/addon/ms-todo/
- 问题反馈:https://github.com/cuifuq7/ms-todo-page/issues
- 官方网站:https://mstodo.dpdns.org