笔记做在 git 仓库有个好处就是每次的修改都可以追溯，第三方笔记服务也有这功能但往往会是收费或受限服务。

在博客里写笔记，包括很多专门博客网站，历史版本会是一个比较缺失的功能。其实仔细想想，文章历史版本自研的话还是比较简单的。

记录文章快照

创建一个专门的文章历史记录表，字段为文章表需要记录快照的字段。

在保存文章时，顺便存一份到文章历史记录表即可。为每篇文章提供一个历史记录列表，支持查询和对比。

如果有需要，也可以在历史记录列表中增加删除功能，把不需要的记录删除，数据层面使用软删除，这样就能保留每一次保存的版本，也能控制界面上的记录。

配合上之前的前端缓存功能，和编辑页面退出自动拦截的功能，基本可以有效的避免手滑导致的文章内容丢失了。

比较版本差异

https://www.npmjs.com/package/diff

通过 diff 这个 npm 包，可以计算出两段文本的差异。

const diff = Diff.diffChars(one, other);

let res = '';

diffContent.forEach((part) => {
    const color = part.added ? 'green' : part.removed ? 'red' : 'grey';
    res += `<span style="color: ${color}">${part.value.replaceAll(/\n/g, '<br />')}</span>`;
});

将 res 的这段 HTML 文本渲染即可。

本博客使用 markdown，把文章内容当作代码直接展示差异了，仅处理了一下换行符转为换行标签。如果是富文本，可转换为纯文本后比较。