关于所见即所得 Markdown 编辑器的讨论

本贴最后更新于 1565 天前,其中的信息可能已经时移俗易

在 GitHub 上搜索 “Markdown editor”,会发现几乎所有流行的 Markdown 编辑器项目都会有被人提类似这样一个特性请求:

能否像 Typora 那样进行实时渲染?

这是一个有趣的现象,但几乎所有的项目都没实现,我翻了这些项目下面的 issue 讨论,作者们大致认为:

  • 所见即所得违反了 Markdown 设计用意
  • 设计上没有保证一致性,比如列表、块引用和标题就无法展开标记符;有的操作只能依赖鼠标或者快捷键,比如表格扩展行列
  • 实现工作量较大,还有优先级更高的任务需要去做
  • 太难了

其中 VNote 提出的“折中方案”,即图片、图表和公式进行实时渲染,其他元素则进行 Markdown 语法高亮。这个方案看似折中,但实则更严重地破坏了一致性,会让用户更容易分心。老外们的项目似乎很看重“设计一致性”,只要逻辑上有点瑕疵他们都不接受。而国人大部分(包括我)都是实用主义者,用着爽就行,管那么多干啥。

Vditor 虽然还不那么流行,但是也被提过。本来我和 @Vanessa 是想做好所见即所得就行了,这样不熟悉 Markdown 的人也能用。当我翻遍了现有 Markdown 编辑器项目相关讨论后,我觉得还是很有必要去实现保留标记符实时渲染模式的,虽然工作量巨大,但是这样会对熟悉 Markdown 的人更加友好。目前大致的计划是在 v3 中进行实现,估计得半年后了。

最后,从某个方面也再次印证了那个被重复一万次的设计问题:用户觉得好就真的是好的吗?

也许是吧,因为离开了社区的支持,作者个人再怎么努力也是白费的……

相关帖子

欢迎来到这里!

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

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

    菜单上可以打开开发者工具,Typora 用了零宽空格字符处理一些场景,这个技巧值得借鉴。作者确实挺厉害的,大量细节处理都非常到位,Vditor 也会加油完善。

  • 其他回帖
  • Kanji-bug

    https://github.com/marktext/marktext

    还有是否可以粘贴图片的时候,通过 base64 来保存?

    marktext 的设计特别优秀,我觉得表格设计可以参考下它的

    image.png

  • 88250

    你后面说的应该是 Markdown 语法高亮吧?这种方式确实比较受欢迎,等有空 Vditor 也会进行支持。

  • 88250

    嗯,通过开发者工具大概浏览了下 Typora 的代码(虽然被压缩过,但是格式化后还是能看的),Markdown 引擎部分应该是直接用 JavaScript 开发的。

    话说编程语言的一大趋势是不分前后端,比如 JavaScript 可以通过 Node.js 跑在服务端上、golang 可以通过 GopherJS 编译成 JavaScript 跑浏览器上、很多后端语言也可以编译为 WASM 跑浏览器上。

    所以对于很多应用产品而言,用什么语言实现已经越来越不重要了,重要的是如何组合工具,换来 1+1 > 2 的价值。

    1 回复
  • 查看全部回帖

推荐标签 标签

  • 一些有用的避坑指南。

    69 引用 • 93 回帖 • 2 关注
  • Redis

    Redis 是一个开源的使用 ANSI C 语言编写、支持网络、可基于内存亦可持久化的日志型、Key-Value 数据库,并提供多种语言的 API。从 2010 年 3 月 15 日起,Redis 的开发工作由 VMware 主持。从 2013 年 5 月开始,Redis 的开发由 Pivotal 赞助。

    284 引用 • 247 回帖 • 173 关注
  • Markdown

    Markdown 是一种轻量级标记语言,用户可使用纯文本编辑器来排版文档,最终通过 Markdown 引擎将文档转换为所需格式(比如 HTML、PDF 等)。

    164 引用 • 1456 回帖
  • 脑图

    脑图又叫思维导图,是表达发散性思维的有效图形思维工具 ,它简单却又很有效,是一种实用性的思维工具。

    21 引用 • 58 回帖
  • Ant-Design

    Ant Design 是服务于企业级产品的设计体系,基于确定和自然的设计价值观上的模块化解决方案,让设计者和开发者专注于更好的用户体验。

    17 引用 • 23 回帖 • 5 关注
  • API

    应用程序编程接口(Application Programming Interface)是一些预先定义的函数,目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力,而又无需访问源码,或理解内部工作机制的细节。

    76 引用 • 421 回帖
  • B3log

    B3log 是一个开源组织,名字来源于“Bulletin Board Blog”缩写,目标是将独立博客与论坛结合,形成一种新的网络社区体验,详细请看 B3log 构思。目前 B3log 已经开源了多款产品:SymSoloVditor思源笔记

    1083 引用 • 3461 回帖 • 286 关注
  • SMTP

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

    4 引用 • 18 回帖 • 592 关注
  • 微信

    腾讯公司 2011 年 1 月 21 日推出的一款手机通讯软件。用户可以通过摇一摇、搜索号码、扫描二维码等添加好友和关注公众平台,同时可以将自己看到的精彩内容分享到微信朋友圈。

    129 引用 • 793 回帖 • 1 关注
  • abitmean

    有点意思就行了

    24 关注
  • JetBrains

    JetBrains 是一家捷克的软件开发公司,该公司位于捷克的布拉格,并在俄国的圣彼得堡及美国麻州波士顿都设有办公室,该公司最为人所熟知的产品是 Java 编程语言开发撰写时所用的集成开发环境:IntelliJ IDEA

    18 引用 • 54 回帖 • 1 关注
  • ZooKeeper

    ZooKeeper 是一个分布式的,开放源码的分布式应用程序协调服务,是 Google 的 Chubby 一个开源的实现,是 Hadoop 和 HBase 的重要组件。它是一个为分布式应用提供一致性服务的软件,提供的功能包括:配置维护、域名服务、分布式同步、组服务等。

    59 引用 • 29 回帖 • 22 关注
  • OAuth

    OAuth 协议为用户资源的授权提供了一个安全的、开放而又简易的标准。与以往的授权方式不同之处是 oAuth 的授权不会使第三方触及到用户的帐号信息(如用户名与密码),即第三方无需使用用户的用户名与密码就可以申请获得该用户资源的授权,因此 oAuth 是安全的。oAuth 是 Open Authorization 的简写。

    36 引用 • 103 回帖 • 8 关注
  • WiFiDog

    WiFiDog 是一套开源的无线热点认证管理工具,主要功能包括:位置相关的内容递送;用户认证和授权;集中式网络监控。

    1 引用 • 7 回帖 • 545 关注
  • Elasticsearch

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

    116 引用 • 99 回帖 • 267 关注
  • WebSocket

    WebSocket 是 HTML5 中定义的一种新协议,它实现了浏览器与服务器之间的全双工通信(full-duplex)。

    48 引用 • 206 回帖 • 394 关注
  • OnlyOffice
    4 引用 • 17 关注
  • 外包

    有空闲时间是接外包好呢还是学习好呢?

    26 引用 • 232 回帖 • 7 关注
  • Webswing

    Webswing 是一个能将任何 Swing 应用通过纯 HTML5 运行在浏览器中的 Web 服务器,详细介绍请看 将 Java Swing 应用变成 Web 应用

    1 引用 • 15 回帖 • 635 关注
  • 酷鸟浏览器

    安全 · 稳定 · 快速
    为跨境从业人员提供专业的跨境浏览器

    3 引用 • 59 回帖 • 23 关注
  • 招聘

    哪里都缺人,哪里都不缺人。

    189 引用 • 1056 回帖 • 1 关注
  • 反馈

    Communication channel for makers and users.

    123 引用 • 906 回帖 • 193 关注
  • 七牛云

    七牛云是国内领先的企业级公有云服务商,致力于打造以数据为核心的场景化 PaaS 服务。围绕富媒体场景,七牛先后推出了对象存储,融合 CDN 加速,数据通用处理,内容反垃圾服务,以及直播云服务等。

    25 引用 • 217 回帖 • 159 关注
  • PWA

    PWA(Progressive Web App)是 Google 在 2015 年提出、2016 年 6 月开始推广的项目。它结合了一系列现代 Web 技术,在网页应用中实现和原生应用相近的用户体验。

    14 引用 • 69 回帖 • 131 关注
  • Google

    Google(Google Inc.,NASDAQ:GOOG)是一家美国上市公司(公有股份公司),于 1998 年 9 月 7 日以私有股份公司的形式创立,设计并管理一个互联网搜索引擎。Google 公司的总部称作“Googleplex”,它位于加利福尼亚山景城。Google 目前被公认为是全球规模最大的搜索引擎,它提供了简单易用的免费服务。不作恶(Don't be evil)是谷歌公司的一项非正式的公司口号。

    49 引用 • 192 回帖
  • Hprose

    Hprose 是一款先进的轻量级、跨语言、跨平台、无侵入式、高性能动态远程对象调用引擎库。它不仅简单易用,而且功能强大。你无需专门学习,只需看上几眼,就能用它轻松构建分布式应用系统。

    9 引用 • 17 回帖 • 595 关注
  • 负能量

    上帝为你关上了一扇门,然后就去睡觉了....努力不一定能成功,但不努力一定很轻松 (° ー °〃)

    85 引用 • 1201 回帖 • 448 关注