请教下,使用markdown编辑器后在前端的展示方案是怎样的?

正在建设的知识付费应用使用了 learnku.com 所用的 editor.md 编辑器,在前端展示的时候遇到了问题,想知道 learnku.com 使用的是哪个方案?

方案一:分两个字段,一个保存 markdown + 一个保存 html#

1、数据库有两个字段,一个是 markdown_content,一个是 html_content,分别保存两种不同的格式,模板直接显示 html
2、后台和前台都不再需要做额外的处理

优点:操作简单,可实现 editor.md 的默认效果,真正的可见即所得
缺点:增加了数据库的存储空间

方案二:保存 markdow + 前台 editor.mdjs 解析#

1、内容字段保存的是 markdown 格式(同方案 1)
2、与方案一不同的是,在模板输出的仍然是 markdown,但是使用了 editor.mdmarkdown to html 功能,在浏览器端,也就是用户看到的是 js 转换后的 html,查看源码仍然是 markdown 格式

优点:不占用数据库空间,也可以实现 editor.md 的默认效果
缺点:因为源代码中仍然是 markdown 原始格式,没有 h2、h3 等标记,不适合 SEO,所以该方案可暂时抛弃。

方案三:保存 markdown + 后台 parsedown 解析#

1、内容字段保存的是 markdown 格式
2、后台使用 parsedown 把 markdown 格式转成 html,然后在模板显示 html
3、前台使用 Highlight.js 等代码高亮插件,显示 code 类代码

优点:不占用数据库空间,因为是后台将 markdown 转为了 html,不给前端增加负担
缺点:无法实现代码行号;因为有这个 js 的加入,显示速度可能会慢

在这里想真心请教下各位大牛,除了这三种方案外,是否还有更优的解决方案?

《L01 基础入门》
我们将带你从零开发一个项目并部署到线上,本课程教授 Web 开发中专业、实用的技能,如 Git 工作流、Laravel Mix 前端工作流等。
《G01 Go 实战入门》
从零开始带你一步步开发一个 Go 博客项目,让你在最短的时间内学会使用 Go 进行编码。项目结构很大程度上参考了 Laravel。
讨论数量: 2

第一个可以方案不错,用空间换时间,很划算。

3年前 评论
Hesunfly

目前用的第一个方案,现在的存储成本很低廉了,怕这些干啥呢?而且你编写 markdown 都是文字性内容,不会占用很大的空间。

3年前 评论