细谈 MarkMax 和 markdown-it 的异同

本贴最后更新于 667 天前,其中的信息可能已经渤澥桑田

最近有点纠结,到底 MarkMax 自定义插件呢?还是 100% 支持 markdown-it 的插件?MarkMax 现在是实验性支持了 markdown-it 的部分插件,因为 MarkMax 的渲染器参数与 markdown-it 有差别,并且 MarkMax 的渲染机制与 markdown-it 同样有差别,所以对于 markdown-it 插件的支持程度需要进行源码级评估。需要注意的是,markdown-it 的插件不会支持 MarkMax 的运行时设计,这也意味着无法支持 MarkMax 的运行时性能优化和新的特性。

我深入思考之后觉得 markdown-it 的插件具有参考意义,但不意味着 MarkMax 将会 100% 支持其插件,所以开始着手设计工程级的 MarkMax 插件开发。因为 markdown-it 插件是存在设计缺陷的,具体表现在无法解决 rules 键存在冲突的问题,例如:默认类型为 text 的节点,我有多个插件修改同一个 text 的规则,就会导致渲染函数冲突,这对于任何一个插件设计机制来说都是有挑战性的。

当然,那些框架把决定权踢给了用户,比如 docsify。docsify 插件对我来说就是尤其失败的设计,我给社区开源了好几个 docsify 插件,这些插件通过 cdn 统计至少有数万的网站正在使用。也因为 docsify 失败的插件设计,导致了用户踢 issues 我还得去解释和进行适配,非常的恼火。

所以 MarkMax 插件设计除了借鉴了我自己对于 Vditor 的插件设计之外,将会针对 markdown-it 原理进行定制设计。先谈 MarkMax 究竟是如何支持 markdown-it 插件的吧,说起来其实非常简单,通过包装器进行实现的。因为 markdown-it 对于 markdown 文件 parse 之后的结果,一般都是 HTML 标签或其组成部分,所以 MarkMax 将这些渲染函数通过 MarkdownItWrapper 包装转化为 VNode,然后交给 MarkMax 的“清洗工”进行处理。理论上来说,此机制同样可以实现对于 Vditor Plugin 的支持,但是 MarkMax 已经计划移除其中所有的代码了。

MarkMax 的 Washer 其实是个非常有意思的设计,这个不光会“洗掉”不必要的节点生成,还把 markdown-it 的队列转化为了 VNode 树结构,实现详情可以参考源码,我是通过栈这一数据结构进行实现数据结构转化的。MarkMax 渲染器与 markdown-it 最大的差别在于 markdown-it 的输出是字符串,而 MarkMax 的输出是虚拟节点。MarkMax 虽然是参考 markdown-it 渲染器的重写,但因针对 VNode 映射 DOM 节点原理的不同,这也导致了有些方法的实现是有差异的。

到目前为止,说 MarkMax 是对于 markdown-it 的套壳毫不为过,但是对于新的插件设计机制和利用 vdom 而提供新的特性则与 markdown-it 差异会越来越大。MarkMax 是综合了我这么多年来对于 markdown 解析器、markdown 编辑器、markdown 渲染器、Vditor 插件和运行时设计、markdown-it、lute、marked.js 二次开发等等经验的产物,可能直到目前它的设计并不完美,但是一定会是更有特色的。

MarkMax 将会持续发挥 vdom 的特点。在首次渲染上,其渲染性能达不到基于字符串模板的方案,性能会稍微差一些(但是总体差距并不大)。但 MarkMax 将会提供 diff 的特性,降低 DOM 节点大量修改带来的性能损耗,针对于可能会引入编辑器的场景,MarkMax 将会采取更小粒度的节点修改。除此之外,MarkMax 会去实现版本比较的特性。普通的撤销和编辑虽然可以做到每一处修改历史记录的操作,但并不会主动去做到对于文字多次修改的历史版本保存。这个意义差距还是蛮大的,并且有望实现渲染器进行类似于 diff 的版本可视化修改比较。

MarkMax 是基于 markdown-it 和 million 的产物,在富文本编辑这块大概会引入 wangEditor 作为富文本编辑器进行定制开发。正如 MarkMax 在简介里所说的,MarkMax 是在 Web 端的一个新的 markdown 解决方案。市面上的 markdown 方案千千万万,此项目只是为了满足我设想高性能 markdown 方案实现的个人主义产物。

如果你对此项目感兴趣,可以提出参考意见或者参与开发,路过也欢迎给个 Star~

项目地址:https://github.com/HerbertHe/markmax

相关帖子

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...
  • HerbertHe

    不算是吧。。。因为我觉得 Vditor 的工程实在是太大了,而且敏捷度不够,有些东西是很难实现的。

    MarkMax 通过 millionjs 提供了 VDOM 的特性,几乎实现了原生性能下的 markdown 渲染。体积远小于 Lute,重写了 markdown-it 的 renderer(这就导致了不支持 markdown-it 所有的插件)。不过还是蛮简单兼容了大部分 markdown-it 的插件,也可以兼容之前对于 Vditor 的插件设计,而且也提供了生命周期之类的特性 emmmm 当然也去解决 markdown-it 可能存在的 rules 冲突的问题,我感觉 docsify 等等的插件设计都存在这个问题

    设计之初还是为了解决渲染的问题,后来给 million 的反馈比较多,成了 collaborator。后来我发现玩法还可以更多,因为可以直接生成 VNode Tree,MarkMax 又可以拥有 million 所有的特性,包括兼容 Vite、使用 million/react 等等,非常的有趣。

    我有蛮多想法的,但是在准备研究生考试,所以未来一年都不打算更新代码了。PR Welcome~

  • 其他回帖
  • CheGuevara

    又来开新坑了吗trollface

    1 回复
HerbertHe
主营前端, 热衷于造轮子 ~ 现为西部计划服务新疆专项志愿者~ Nuco.Tech Studio 联合创始人 乌鲁木齐

推荐标签 标签

  • 持续集成

    持续集成(Continuous Integration)是一种软件开发实践,即团队开发成员经常集成他们的工作,通过每个成员每天至少集成一次,也就意味着每天可能会发生多次集成。每次集成都通过自动化的构建(包括编译,发布,自动化测试)来验证,从而尽早地发现集成错误。

    14 引用 • 7 回帖
  • NGINX

    NGINX 是一个高性能的 HTTP 和反向代理服务器,也是一个 IMAP/POP3/SMTP 代理服务器。 NGINX 是由 Igor Sysoev 为俄罗斯访问量第二的 Rambler.ru 站点开发的,第一个公开版本 0.1.0 发布于 2004 年 10 月 4 日。

    311 引用 • 546 回帖 • 57 关注
  • ReactiveX

    ReactiveX 是一个专注于异步编程与控制可观察数据(或者事件)流的 API。它组合了观察者模式,迭代器模式和函数式编程的优秀思想。

    1 引用 • 2 回帖 • 124 关注
  • Dubbo

    Dubbo 是一个分布式服务框架,致力于提供高性能和透明化的 RPC 远程服务调用方案,是 [阿里巴巴] SOA 服务化治理方案的核心框架,每天为 2,000+ 个服务提供 3,000,000,000+ 次访问量支持,并被广泛应用于阿里巴巴集团的各成员站点。

    60 引用 • 82 回帖 • 590 关注
  • LaTeX

    LaTeX(音译“拉泰赫”)是一种基于 ΤΕΧ 的排版系统,由美国计算机学家莱斯利·兰伯特(Leslie Lamport)在 20 世纪 80 年代初期开发,利用这种格式,即使使用者没有排版和程序设计的知识也可以充分发挥由 TeX 所提供的强大功能,能在几天,甚至几小时内生成很多具有书籍质量的印刷品。对于生成复杂表格和数学公式,这一点表现得尤为突出。因此它非常适用于生成高印刷质量的科技和数学类文档。

    9 引用 • 32 回帖 • 179 关注
  • 人工智能

    人工智能(Artificial Intelligence)是研究、开发用于模拟、延伸和扩展人的智能的理论、方法、技术及应用系统的一门技术科学。

    66 引用 • 124 回帖
  • SMTP

    SMTP(Simple Mail Transfer Protocol)即简单邮件传输协议,它是一组用于由源地址到目的地址传送邮件的规则,由它来控制信件的中转方式。SMTP 协议属于 TCP/IP 协议簇,它帮助每台计算机在发送或中转信件时找到下一个目的地。

    4 引用 • 18 回帖 • 581 关注
  • OpenStack

    OpenStack 是一个云操作系统,通过数据中心可控制大型的计算、存储、网络等资源池。所有的管理通过前端界面管理员就可以完成,同样也可以通过 Web 接口让最终用户部署资源。

    10 引用 • 9 关注
  • Android

    Android 是一种以 Linux 为基础的开放源码操作系统,主要使用于便携设备。2005 年由 Google 收购注资,并拉拢多家制造商组成开放手机联盟开发改良,逐渐扩展到到平板电脑及其他领域上。

    331 引用 • 315 回帖 • 83 关注
  • Elasticsearch

    Elasticsearch 是一个基于 Lucene 的搜索服务器。它提供了一个分布式多用户能力的全文搜索引擎,基于 RESTful 接口。Elasticsearch 是用 Java 开发的,并作为 Apache 许可条款下的开放源码发布,是当前流行的企业级搜索引擎。设计用于云计算中,能够达到实时搜索,稳定,可靠,快速,安装使用方便。

    116 引用 • 99 回帖 • 275 关注
  • 数据库

    据说 99% 的性能瓶颈都在数据库。

    330 引用 • 612 回帖
  • 钉钉

    钉钉,专为中国企业打造的免费沟通协同多端平台, 阿里巴巴出品。

    15 引用 • 67 回帖 • 380 关注
  • 链书

    链书(Chainbook)是 B3log 开源社区提供的区块链纸质书交易平台,通过 B3T 实现共享激励与价值链。可将你的闲置书籍上架到链书,我们共同构建这个全新的交易平台,让闲置书籍继续发挥它的价值。

    链书社

    链书目前已经下线,也许以后还有计划重制上线。

    14 引用 • 257 回帖 • 2 关注
  • Wide

    Wide 是一款基于 Web 的 Go 语言 IDE。通过浏览器就可以进行 Go 开发,并有代码自动完成、查看表达式、编译反馈、Lint、实时结果输出等功能。

    欢迎访问我们运维的实例: https://wide.b3log.org

    30 引用 • 218 回帖 • 594 关注
  • 安全

    安全永远都不是一个小问题。

    189 引用 • 813 回帖 • 2 关注
  • Tomcat

    Tomcat 最早是由 Sun Microsystems 开发的一个 Servlet 容器,在 1999 年被捐献给 ASF(Apache Software Foundation),隶属于 Jakarta 项目,现在已经独立为一个顶级项目。Tomcat 主要实现了 JavaEE 中的 Servlet、JSP 规范,同时也提供 HTTP 服务,是市场上非常流行的 Java Web 容器。

    163 引用 • 529 回帖
  • BAE

    百度应用引擎(Baidu App Engine)提供了 PHP、Java、Python 的执行环境,以及云存储、消息服务、云数据库等全面的云服务。它可以让开发者实现自动地部署和管理应用,并且提供动态扩容和负载均衡的运行环境,让开发者不用考虑高成本的运维工作,只需专注于业务逻辑,大大降低了开发者学习和迁移的成本。

    19 引用 • 75 回帖 • 609 关注
  • Spark

    Spark 是 UC Berkeley AMP lab 所开源的类 Hadoop MapReduce 的通用并行框架。Spark 拥有 Hadoop MapReduce 所具有的优点;但不同于 MapReduce 的是 Job 中间输出结果可以保存在内存中,从而不再需要读写 HDFS,因此 Spark 能更好地适用于数据挖掘与机器学习等需要迭代的 MapReduce 的算法。

    74 引用 • 46 回帖 • 549 关注
  • Flume

    Flume 是一套分布式的、可靠的,可用于有效地收集、聚合和搬运大量日志数据的服务架构。

    9 引用 • 6 回帖 • 594 关注
  • V2Ray
    1 引用 • 15 回帖
  • Ruby

    Ruby 是一种开源的面向对象程序设计的服务器端脚本语言,在 20 世纪 90 年代中期由日本的松本行弘(まつもとゆきひろ/Yukihiro Matsumoto)设计并开发。在 Ruby 社区,松本也被称为马茨(Matz)。

    7 引用 • 31 回帖 • 166 关注
  • Shell

    Shell 脚本与 Windows/Dos 下的批处理相似,也就是用各类命令预先放入到一个文件中,方便一次性执行的一个程序文件,主要是方便管理员进行设置或者管理用的。但是它比 Windows 下的批处理更强大,比用其他编程程序编辑的程序效率更高,因为它使用了 Linux/Unix 下的命令。

    122 引用 • 73 回帖 • 2 关注
  • BookxNote

    BookxNote 是一款全新的电子书学习工具,助力您的学习与思考,让您的大脑更高效的记忆。

    笔记整理交给我,一心只读圣贤书。

    1 引用
  • Kotlin

    Kotlin 是一种在 Java 虚拟机上运行的静态类型编程语言,由 JetBrains 设计开发并开源。Kotlin 可以编译成 Java 字节码,也可以编译成 JavaScript,方便在没有 JVM 的设备上运行。在 Google I/O 2017 中,Google 宣布 Kotlin 成为 Android 官方开发语言。

    19 引用 • 33 回帖 • 20 关注
  • 分享

    有什么新发现就分享给大家吧!

    240 引用 • 1729 回帖
  • RYMCU

    RYMCU 致力于打造一个即严谨又活泼、专业又不失有趣,为数百万人服务的开源嵌入式知识学习交流平台。

    4 引用 • 6 回帖 • 39 关注
  • Unity

    Unity 是由 Unity Technologies 开发的一个让开发者可以轻松创建诸如 2D、3D 多平台的综合型游戏开发工具,是一个全面整合的专业游戏引擎。

    25 引用 • 7 回帖 • 249 关注