资讯动态

用caveman打造视觉化书签卡片墙:开源扩展的完整实践

发布时间:2026/10/29 15:00:23 来源:尧图企业网站定制
你有没有过这种经历浏览器收藏夹里躺着三百多篇文章真要找的时候翻了半天最后还是在搜索引擎里重新搜。我的书签栏一度就是这样的信息垃圾场直到遇到caveman这个开源项目才意识到网页收藏原来还能是一面看得见、摸得着的卡片墙。这篇文章是我从安装到深度使用 caveman 的完整记录适合那些收藏夹越堆越厚、却几乎从不回头看的同学。它并不复杂甚至算得上轻量但理念很有意思把网页像洞穴壁画一样封存进卡片每一张都有截图、标题和标签。你不需要去记 URL只需要在某天点开它的卡片墙像考古一样翻一翻很多当时没来得及读的东西就会重新跳出来。1. 一个差点被我误会的名字“caveman”到底在做什么1.1 这个名字并不表示“回到石器时代”说实话第一次看到 caveman 这个名字我以为是个像素风小游戏或者是某个复古编程项目。查了一下发现它其实是一个开源浏览器扩展主打“视觉化书签管理”。cave man既是“穴居人”也是“把自己收藏的网页封存在洞穴里”的意思。它的核心动作只有两个把网页保存成卡片把卡片按照标签和分组摆成一堵墙。开发者真正想表达的是收藏网页不该是往深不见底的文件夹里扔而应该是把物件带进自己的洞穴摆在能看见的位置上。很多人在浏览器里收藏网页本质上就是在做一个“数字仓鼠行为”藏的时候很爽但藏完就忘了。Caveman 想改变的是这一点。1.2 一张能力清单看清它的定位这里列一下我实际用到的能力一键保存当前网页自动抓取标题、描述、域名、截图和收藏时间。卡片墙视图支持按标签过滤、按关键词搜索、按日期范围筛选。标签与分组双维度组织一个卡片可以拥有多个标签。随机回顾模式相当于“在自己的收藏里散步”。数据本地存储支持 JSON 导出与导入。开源代码自己可控不依赖某个云端账号绑死你。用一句话说它是介于浏览器书签和笔记软件之间的那个“中间层”。书签太轻、没有视觉笔记软件太重、需要从头整理而 Caveman 要的是“先收藏后整理随时回顾”。1.3 适合谁不适合谁适合的人包括长期攒文章的开发者、做研究时需要持续收集案例的人、设计素材收集爱好者以及任何厌恶文件夹层级的人。不适合的人也有想把它当云同步工具用的移动端用户以及希望它自动帮你完成分类的人。Caveman 不负责思考它只负责把网页变成一张能看见的卡片剩下的标签和分组需要你自己动手。2. 为什么我把网页收藏全部从文件夹搬进 Caveman2.1 书签文件夹的三大痛点我用书签文件夹十年最深的时候套过四层前端 / 性能 / 浏览器 / 工具。每次收藏前都要纠结该放哪一层找的时候又完全不记得当初放哪了。第一个痛点是层级越深越容易遗忘第二个痛点是书签列表全是密密麻麻的 URL没有视觉提示过了两周连标题都记不住第三个痛点是没有“再发现”路径收藏完就永久吃灰和删除没什么区别。后来我终于想明白一件事浏览器书签本质上是给“记得自己去过哪里”的人用的。但真实情况是我们收藏的时候都很确定“以后一定用得上”真正要用的时候却完全忘了自己收藏过。2.2 卡片墙触发的“视觉记忆”人的视觉记忆比文本记忆强很多。我翻 Caveman 卡片墙时发现只要看到那张网页截图哪怕标题忘了也能一眼想起来“哦这是那篇讲 V8 引擎的文章”。截图、域名、时间戳这些信息虽然不起眼但检索效率远高于纯文本书签。这也是我认为它的核心价值把“找 URL”变成“认卡片”。你不需要记得网址甚至不需要记得标题只要记得页面长什么样就能在卡片墙里找到它。传统书签栏就算你把列表展开看到的全是一行行文字大脑要做一次文本匹配而卡片墙直接呈现版面视觉系统在几百毫秒内就能完成匹配。2.3 “偶然发现”比“刻意查找”更有价值刻意查找的前提是“我记得有这个东西”但知识管理的常态是“我忘了还有过这个东西”。Caveman 的随机回顾就是专门服务这个场景的。我每周会用几分钟在卡片墙里随机走一遍经常翻出几个月前收藏但当时没读的文章。而且因为隔了一段时间再看反而更容易判断它值不值得认真读。这个“偶然发现”机制比任何分类法都更能防止收藏夹变成黑洞。2.4 一个类比把旧杂志摊在桌上想象你有一堆旧杂志全部塞在书柜深处你永远不会去翻。但如果把它们摊开放在桌上哪怕只是路过扫一眼也会因为封面而想起某篇文章。Caveman 做的就是这件事把浏览器书签从抽屉里拿出来摊成一面墙。而且这面墙不是静态的。你可以给卡片打标签、按日期归档、随手筛选它像一块可以不断重新排列的软木板。收藏不再是“扔进抽屉”的告别仪式而是“摆上展示架”的整理动作。2.5 本地存储意味着什么它把卡片数据存在浏览器的 IndexedDB 里不经过某个云端服务器。好处是隐私干净、离线可用代价是换电脑时需要通过 JSON 导出导入来迁移。很多人在第一次用的时候容易忽略这一点我也在“数据去哪了”这个问题上花了一点时间后面专门讲。3. 装好 Caveman 的完整路径扩展、数据目录与本地存储3.1 安装前的环境确认我使用的是 ChromeEdge 的 Chromium 内核同样支持Firefox 版本我没有实测过建议以项目 README 说明为准。安装前先把浏览器更新到较新版本避免扩展 API 不兼容。然后去 GitHub 找到 caveman 仓库的 release 页面下载对应的压缩包解压到一个不会被清理的目录比如我的文档目录下的 caveman-src。有一点需要注意不要直接双击压缩包里的文件运行浏览器扩展必须通过“加载已解压的扩展程序”方式安装。这一步对没玩过扩展开发的同学有点陌生但跟着流程走一遍就会了。3.2 获取安装包和加载扩展具体步骤如下打开chrome://extensions。打开右上角的“开发者模式”。点击“加载已解压的扩展程序”。选择刚才解压出来的目录。扩展列表中会出现 caveman点击工具栏里的拼图图标把 caveman 固定到地址栏右侧。如果你遇到了“清单文件缺失或不可读”的提示多半是解压目录选到了嵌套层。解决办法是选到包含manifest.json的那一层而不是外层文件夹。我第一次装的时候就是选到了外层折腾了两分钟才反应过来。3.3 首次启动与初始化设置固定图标后点一下 caveman 图标它会打开自己的主面板。第一次进设置区我建议先把默认标签和卡片显示密度设好否则后续保存的每一张卡片都要手动补标签。这个项目没有复杂的引导向导界面比较朴素菜单入口通常藏在主面板右上角的设置按钮里。如果你收藏的是中文内容建议确认界面字体和输入法能正常工作。实测下来中文标签没有任何问题。3.4 数据到底存在哪里这一点我当初确实困惑了一下。它不生成独立的数据目录而是使用浏览器的 IndexedDB路径藏在浏览器 profile 目录下。也就是说卸载扩展会直接丢数据清理浏览器缓存时如果勾选了“站点数据”也可能波及。我踩过的一个真实的坑是某次清理缓存把扩展的 IndexedDB 一起清掉了收藏的几百张卡片全部消失。幸好我养成了导出 JSON 的习惯不然后果就是所有收藏白攒。这个血泪教训放到后面讲。3.5 了解你的数据结构卡片 JSON 长什么样导出后的 JSON 大概是这种结构{ version: 1, cards: [ { id: b3f7a1, url: https://example.com/post, title: 一篇值得重读的文章, description: 摘要内容, domain: example.com, tags: [前端, 阅读], createdAt: 2025-01-05T12:30:00.000Z } ] }看懂了字段后面排查导入失败时就容易定位是缺了 id还是时间格式不对。这个 JSON 就是你的全部家当建议至少留一份离线副本。4. 上手实测从保存一个网页到搭出第一面卡片墙4.1 一键收藏的第一步打开任意网页点击工具栏里的 caveman 图标确认弹出的预览卡片里有标题、描述和截图再点击保存。整个过程大概两秒。Caveman 会自动抓取当前页面的信息但自动抓的标题有时很长还带着站点名我一般会顺手删掉后半截。这里有一个小习惯保存时先不要急着退出看一眼前端卡片生成结果。如果截图没出来多半是页面还没渲染完成等一两秒再重新保存一次。4.2 用标签组织第一批卡片收藏不组织收藏三五十张之后又会是一团乱。Caveman 的标签支持中文也支持一个卡片多个标签比如“V8”和“性能优化”可以同时打。分组则是更高一级的容器一个分组里可以再按标签筛选。我自己的习惯是先打标签尽量不用超过五个字的标签方便后面对齐。分类名越短筛选时越不容易出错。如果你刚开始用建议先只建两三个大类比如“工作”“阅读”“灵感”等收藏多了再拆细别一开始就建二十个标签。4.3 搜索与筛选别让卡片墙变成新的垃圾场搜索框支持关键词、标签和日期范围不同版本入口略有差异建议在面板左侧找筛选区。最基础的方法是输入标签名卡片墙就只剩该标签下的卡片输入关键词会匹配标题和描述。我习惯把“今天收藏”作为一个临时标签隔天读完了再把这个临时标签拿掉确保墙面上留下的都是真正值得长期保留的内容。否则卡片墙会从一个整理工具变成另一个堆放杂物的地方。4.4 一个完整示例我用“城市更新”主题做了一次真实收藏假设我要收集“城市更新与社区设计”的案例文章操作路径是这样的在左侧分组管理里新建一个分组“城市更新”。连续保存五篇相关网页给每篇打上 urbanism、community、design 标签。回到分组视图按标签查看五张卡片会自动聚在一起。把其中一篇有争议的项目单独加上 pending-review 标签方便之后处置。整个过程完全没有碰文件夹和 URL全部在卡片墙里完成。这就是它和其他书签工具最不一样的地方操作对象是“卡片”不是“地址”。4.5 实测中值得注意的保存细节动态渲染页面比如单页应用可能抓不到完整截图显示为空白卡片。有些站点禁掉了截图权限或者页面结构里没有 og 标签描述就会为空。收藏后不要立刻关闭标签页等一两秒让截图生成完成。遇到抓取不全的页面手动编辑补一下标题和描述即可不影响整体使用。这些情况不属于 bug多数是网页自身结构的问题不需要排查扩展。5. Caveman 最容易被低估的细节数据备份、迁移与隐私5.1 本地优先是把双刃剑本地优先意味着没有云厂商帮你兜底数据只存在于当前浏览器。依赖浏览器同步虽然可以把扩展数据同步过去但不同浏览器的同步策略不一样靠不住尤其当收藏卡片超过一定数量后同步冲突很常见。所以导出 JSON 才是唯一稳妥的备份手段。我见过一些人用了几个月 Caveman从来没导出过某天浏览器重装几百张卡片就没了。本地工具最大的风险不是功能少而是你对它太放心。5.2 导出 JSON 的具体操作在设置或数据管理页面一般会有导出按钮点击后下载一个 JSON 文件。我建议把文件命名为caveman-backup-2025-xx-xx.json按日期保留多份至少保留最近三份。不要总是覆盖同一个文件。万一上次导出时数据已经损坏唯一的那份备份也会被杀掉。按日期命名是最简单有效的文件管理方式。5.3 跨设备迁移的完整流程换电脑时的流程是旧机器导出 JSON新机器安装扩展然后在新机器的设置里导入 JSON。导入时通常会提示“替换现有数据”还是“合并”我建议选替换因为合并可能把两边的旧卡片混在一起产生大量重复内容。导入完成后检查一下卡片总数和最近收藏日期确认没有丢数据再开始正常使用。5.4 隐私方面的天然优势因为卡片数据存在本地不经过任何云服务所以很适合整理那些不想上传到别人服务器的资料。你收藏了什么、看了什么、标签怎么打的第三方便无法知道。Caveman 的 API 面很小也没有广告、没有跟踪请求使用起来非常干净。这一点在大量网页工具都转向“云端优先”的背景下很稀缺。它不收集你的行为数据也不需要你登录注册开箱即用闭箱即走。5.5 我的备份节奏建议我的实际备份频率是每周五导出一次存进本地目录每月初把最近一份上传到自己的私有网盘。如果某天要清理浏览器缓存或重装系统先导出一次再动手。做成习惯之后数据安全性反而比依赖云同步的工具安心得多。6. 进阶玩法把 Caveman 变成“可随意考古的个人知识库”6.1 利用随机回顾让旧收藏重新出现Caveman 提供随机模式之后我就不再刻意回忆某篇文章放在哪了。每天固定一个浏览卡片的时间从卡片墙开始点随机系统会带我到任意一张旧卡片面前。这个习惯坚持一段时间后会发现很多当时收藏但没读的内容有了第二次被打开的机会。它本质上模仿了物理世界里“翻箱底”的快感。电子收藏最大的问题不是保存而是被遗忘。随机回顾就是对抗遗忘最简单的方式。6.2 用标签体系搭主题卡片墙标签体系建议控制在二十个以内否则管理标签的时间比收藏时间还长。我的标签分三类领域前端、设计、写作、工具。状态待读、读完、废弃。来源播客、Newsletter、推特。三个维度互相组合基本能覆盖百分之九十的收藏场景。比如“前端-待读-播客”一张卡片一听就知道内容方向、当前状态和来源渠道不需要额外写备注。6.3 收藏-沉淀-输出的完整工作流我的流程是看到好文章立刻收藏进 Caveman晚上集中浏览当天卡片值得深读的移动到“待读”读完以后写两条笔记到自己的笔记软件每周五再看这批“待读”是否清空。Caveman 只承担收集和回顾笔记沉淀仍然交给笔记软件两者分工明确不冲突。它是一个很轻的工具硬要用它管理复杂知识库反而会难受。6.4 固定回顾频率的效果我试过每天看、每三天看、每周看三种频率实测下来每周一次是最舒服的。每天看容易变成任务压力每三天看会漏掉一些短期有价值的活动每周一次正好能把“收藏—回顾”的周期和周末复盘结合起来。我一般选周五下午清完当周卡片顺手导出一次 JSON。收藏、回顾、备份三件事合并成一个习惯执行成本很低。6.5 一个实战案例前端灵感库的搭建我长期收藏前端相关文章标签用的是“前端”“动画”“构建”“性能”。现在打开前端分组就能看到几十张包含截图、标题、标签的卡片墙比翻代码仓库的 README 直观得多。遇到和以前类似的问题我不会第一时间搜整个互联网而是先翻卡片墙往往几分钟内就能找到之前收藏的方案。这个习惯之后搜索引擎的使用频率都下降了因为很多答案其实早就被我收藏过了只是过去一直没想起来。7. 踩过的一些坑图标消失、空白卡片与导入失败7.1 扩展图标突然消失有一次浏览器自动更新之后扩展还在但图标从工具栏消失了。这其实不是被禁用而是固定状态被重置。去扩展管理页确认状态为“已启用”然后重新固定到工具栏即可。这个问题很容易让人误以为扩展故障了实际上只是 UI 状态的小问题一分钟就能解决。7.2 空白卡片和截图不显示最常见的空白卡片是单页应用SPA动态渲染导致的。因为扩展抓截图时页面还没渲染完成抓到的就是一整块白色区域。解决办法是在目标页面多停留几秒再收藏或者手动添加描述并把截图重试。如果某个域名频繁出现空白可以考虑先在无痕模式下打开一次可能是扩展权限被该站点拦截导致的。7.3 导入 JSON 失败导入失败通常有两个原因一是 JSON 文件本身不是由 Caveman 导出的格式字段对不上二是文件编码不对比如带 BOM 的 UTF-8 会出现解析问题。我的经验是先打开 JSON 确认以{开始、包含version字段再用编辑器转成 UTF-8 无 BOM 后重新导入。如果 JSON 本身没问题就检查浏览器扩展版本是否太老旧版本可能不支持新格式。7.4 数据“同步失败”的真相有段时间我以为扩展出了 bug收藏到一半显示同步失败。排查了一圈才发现是清理工具把浏览器“站点数据”清掉了IndexedDB 被删空。之后我再也没有用第三方清理工具对浏览器站点数据下手只保留浏览记录清理。这类问题最坑的地方在于扩展本身没有任何损坏迹象表面看只是数据没了。所以要养成导出备份的习惯这句话怎么强调都不过分。7.5 一个通用排查链路遇到问题先按这个顺序查扩展状态是否正常设置页面有没有报错。查看扩展后台页的 console 有没有红色报错。看导出 JSON 里的卡片数量是否异常。检查浏览器版本和扩展是否兼容。实在不行导出 JSON重新加载扩展再导入。这套链路我用了很多次能覆盖百分之九十九的问题。大多数看起来诡异的现象最后都能归结到以上某个环节。7.6 卡片多到卡顿怎么办收藏超过一两千张后卡片墙滚动或搜索可能会有明显卡顿。我的处理方式是开启分组按标签分页查看少用一次渲染所有卡片的全景视图保持只收藏有长期价值的卡片定期把读完的卡片归档或删除。Caveman 在设计上并没有把“无限卡片墙”作为优化目标所以控制规模才是关键。它不是数据库不该承担无限堆积的预期。8. 和 Pocket、Raindrop.io、Notion 比起来Caveman 的取舍8.1 一张表看清差异维度CavemanPocketRaindrop.ioNotion数据存储浏览器本地 IndexedDB云端云端云端视觉卡片墙有核心特性列表为主有比较成熟数据库视图离线可用完全可离线部分受限部分受限部分受限随机回顾有无有无开源是否否否学习成本低低中中高8.2 什么时候我仍然依赖它们读稍后读的场景我还是会用 Pocket 这类工具因为它的全文提取和跨平台阅读体验更成熟。Notion 则用于需要深度整理的资料库因为它的数据库属性和页面关联比卡片墙更灵活。Caveman 更适合收藏“不需要现在读完、但希望将来能被再发现”的网页。三者的角色不一样不是替代关系我会同时用只是分工不同。8.3 我的最终建议如果你的核心需求是“建立一个能让自己定期回顾的网页收藏库”那 Caveman 是目前开源方案里很顺手的一个。别把卡片数量堆成山每周固定回顾一次数据记得导出备份。我实际用了几个月最大的感受是收藏行为重新有了意义。它不再是“把网页扔进深渊”的自我安慰而是真正把内容放进了自己的洞穴随时可以挖出来再看一遍。如果你也被收藏夹吃灰困扰找个周末装一个试试花不了多少时间但体验会完全不一样。

读完文章,也想定制专属网站?

尧图设计师 24 小时内与您沟通定制方案

免费获取报价 →
↑