登录 注册

代码语法高亮放前端还是后端？

本贴最后更新于 2043 天前，其中的信息可能已经时移世易

目前主流（比如 GitHub）的做法是在后端高亮，输出带样式类的 HTML；其他也有在前端通过 JS 语法高亮库进行处理的。

后端渲染语法高亮的优势是：

  • 不会“闪”一下，渲染效果更平滑
  • 统一处理，多端场景下升级方便

当然，也有缺点：

  • 消耗服务器资源，请求的整体响应时间变长
  • 处理稍微复杂，如果某种语言没有后端高亮库，就只能通过其他的高亮进程处理

我比较倾向于后端渲染，能一次做完的事情就不要分布出去了，那样有点浪费资源。

大家觉得哪种方案好？

单选 • 公开 • 永不结束 28 票
前端渲染
35% • 10 票
后端渲染
64% • 18 票

  • 语法高亮
    2 引用 • 32 回帖
  • 后端
    44 引用 • 126 回帖 • 1 关注
  • 前端

    前端技术一般分为前端设计和前端开发，前端设计可以理解为网站的视觉设计，前端开发则是网站的前台代码实现，包括 HTML、CSS 以及 JavaScript 等。

    245 引用 • 1338 回帖
1 操作
88250 在 2019-08-27 20:15:36 更新了该帖
昆明 位置
11 关注
1 操作
27 回帖
3
2
2
8.8k 306 1.3k 1.7k 2.0k 500 7 901 2.1k

相关帖子

27 回帖
代码语法高亮放前端还是后端？

欢迎来到这里！

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

注册 关于
请输入回帖内容 ...
  • dengwentong • • 1
    捐赠者

    @88250 @Vanessa
    居然说到，前端和后端，自然 D & V 。
    个人倾向后端。
    作为自身，后端操作比较友好；作为看客，前端有基本的语法高亮应该看起来也会友好吧。😄

  • betou •

    倾向于后端，有需求直接改就完了，如果是个 APP，出问题还要重新打包上架。

  • betou • • 1

    对现代硬件来说，那一丢丢资源不算是资源吧，当前情况应该是代码发展速度跟不上硬件的发展速度

  • InkDP • via Linux
    捐赠者

    后端，作为刚开发玩皮肤的人来说 后端会让前端很舒服

  • someone27889 • via macOS
    捐赠者

    看后端提供的服务类型吧？如果后端都是数据交换数据处理那么 渲染 放在前端合适，如果后端有一部分前端渲染引擎的话，那就放后端。

    1 回复
  • YLongo •
    订阅者 赞助者 支持者 捐赠者 勇士

    个人倾向放后端，代码高亮是通用的逻辑，可以一次开发，多处使用

  • Vanessa • via macOS
    订阅者 付费者

    做为前端，总担心辣么多的处理后端会吃不消。

  • jeffjade •

    看应用场景；放在前端，倘若处理得当，可以不显现“闪”一下；一般处理的话，那一闪而过的瞬间，应该也不太影响使用体验。

    对很多静态网站生成器而言，不需要后台的话，则也无需内置，用户可按需载入高亮库，这也是如今个人博客处理办法；如 Ghost：https://quickapp.lovejade.cn/how-to-elegantly-handle-quickapp-request/ 。

    对于当下流行使用 MVVM 框架来搭建的单页应用（SPA），首屏渲染、SEO 的解决之道，可以有很多法子，可不采取服务端渲染这种相对更复杂方法，那么高亮这种自然也还是前端自己处理（发布前预渲染，这种也算是在前端了吧）。

    1 回复
  • 88250 •
    订阅者 作者

    场景是 HTML 渲染，比如帖子里有代码块时需要高亮。

    发这个帖的原因是最近正在做社区 Markdown 渲染改造，以前用的是 markdown-it+ highlight.js（两个项目都是 JavaScript 的），目前正在改造为 Lute + Chroma（两个项目都是 golang 的）。因为我这边还有其他项目也有这个需求，所以和大家讨论一下看看，是否还有什么我没有考虑到的情况，集思广益 🙏

  • 88250 •
    订阅者 作者

    嗯，还是看应用场景。

    Go 实现的一个静态站点生成系统 Hugo 用的也是 Chroma，这也算是“预渲染”操作吧 😅

    2 回复
  • Sunnnner • via macOS
    捐赠者

    前端吧- -后端主要还是负责数据，因为我就是负责数据的别的还没到达那种地步，另外如果放在后端，服务器一定要 hold 住，不然崩了怎么办

  • yixiangblog •

    直接 highlight.js 呗。用国内 cdn，印象中不会闪，用起来也方便，也可以不用管后端是啥语言写的。if it ain't broken, don't fix it.

  • someone27889 • via macOS
    捐赠者

    V 说怕你吃不消，那就前端渲染？

    1 回复
  • jeffjade •

    嗯嗯，是的。

  • 88250 •
    订阅者 作者

    没事，我吃得消 doge

    @Vanessa

  • krbtgt •

    后端想为前端分担压力，前端担心后端吃不消。

    我怀疑你们俩在撒狗粮，并且我有证据 😂

  • zonghua •

    当然是前端啦，减少我后端工作量，上班多摸鱼

    1 回复
  • csfwff • • 1
    捐赠者

    huaji 当然是后端啦，减少我前端工作量，上班多摸鱼

    1 回复
  • zonghua •

    工作成果我收了哈

  • 2501224066 •

    前端只会调接口，给他搞不放心

  • jenphyjohn • • 1 via macOS
    订阅者 支持者 勇士

    这狗粮我先干了！后端统一处理易于维护，但是增加服务端渲染时间，看如何取舍了。个人倾向前端处理，能提高一丁点儿的体验效果也是好的，前提是有方法能解决闪一下的问题。

  • zwxbest • • 1

    前端啊，渲染这种功能放前端，可以减轻服务器压力，同时前端调试也比较方便。

  • Blackman99 • • 1
    捐赠者

    如果可以的话不必限制在一端，两种方式都提供，使用者可以根据具体应用场景进行选择

  • K • • 1

    对与这种，不影响使用的优化项 在前端处理也算是一种边缘计算，这个的优点大家也都清楚。

    如果放到后端处理，
    对于少量用户来说 貌似也没有什么不可以〜
    但是稍稍多一点儿，就要用更多的 money（服务器）来换取用户体验来，简直不要太划算。

    但是这个时候，出与前端的求生欲： 我还是要说，支持后端渲染 +1 trollface

  • PeterChu • • 1

    我的想法是，这种问题应该不是简单一元一次方程，而应该是多元的，也就是说决定最终取舍的影响因素应该有多个，不同的影响因素大小下会产生不同的最终结果。所以，就这个问题可能需要考虑有几个，一个是服务器的能力，一个是访问量，一个是时间。🤔

  • jeffjade •

    这类帖子，社区的投票功能蛮有使用的必要，:)。

    1 回复
  • 88250 •
    订阅者 作者

    嗯嗯。

    @participants 大家来投票吧！

请输入回帖内容 ...
88250
但行好事莫问前程 昆明
回帖
34276
 帖子
713
 积分
166053

近期热议

推荐标签 标签

  • 新人

    让我们欢迎这对新人。哦，不好意思说错了，让我们欢迎这位新人！
    新手上路，请谨慎驾驶！

    52 引用 • 228 回帖 • 1 关注
  • 自由行
    • 1 关注
  • Outlook
    1 引用 • 5 回帖
  • jsoup

    jsoup 是一款 Java 的 HTML 解析器，可直接解析某个 URL 地址、HTML 文本内容。它提供了一套非常省力的 API，可通过 DOM，CSS 以及类似于 jQuery 的操作方法来取出和操作数据。

    6 引用 • 1 回帖 • 488 关注
  • Spark

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

    74 引用 • 46 回帖 • 565 关注
  • Vditor

    Vditor 是一款浏览器端的 Markdown 编辑器，支持所见即所得、即时渲染（类似 Typora）和分屏预览模式。它使用 TypeScript 实现，支持原生 JavaScript、Vue、React 和 Angular。

    366 引用 • 1842 回帖 • 1 关注
  • App

    App（应用程序，Application 的缩写）一般指手机软件。

    91 引用 • 384 回帖 • 1 关注
  • 服务

    提供一个服务绝不仅仅是简单的把硬件和软件累加在一起，它包括了服务的可靠性、服务的标准化、以及对服务的监控、维护、技术支持等。

    41 引用 • 24 回帖
  • Flume

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

    9 引用 • 6 回帖 • 651 关注
  • SMTP

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

    4 引用 • 18 回帖 • 638 关注
  • OpenCV
    15 引用 • 36 回帖
  • 思源笔记

    思源笔记是一款隐私优先的个人知识管理系统，支持完全离线使用，同时也支持端到端加密同步。

    融合块、大纲和双向链接，重构你的思维。

    24847 引用 • 102197 回帖
  • GitHub

    GitHub 于 2008 年上线，目前，除了 Git 代码仓库托管及基本的 Web 管理界面以外，还提供了订阅、讨论组、文本渲染、在线文件编辑器、协作图谱（报表）、代码片段分享（Gist）等功能。正因为这些功能所提供的便利，又经过长期的积累，GitHub 的用户活跃度很高，在开源世界里享有深远的声望，并形成了社交化编程文化（Social Coding）。

    210 引用 • 2040 回帖
  • HBase

    HBase 是一个分布式的、面向列的开源数据库，该技术来源于 Fay Chang 所撰写的 Google 论文 “Bigtable：一个结构化数据的分布式存储系统”。就像 Bigtable 利用了 Google 文件系统所提供的分布式数据存储一样，HBase 在 Hadoop 之上提供了类似于 Bigtable 的能力。

    17 引用 • 6 回帖 • 58 关注
  • 单点登录

    单点登录（Single Sign On）是目前比较流行的企业业务整合的解决方案之一。SSO 的定义是在多个应用系统中，用户只需要登录一次就可以访问所有相互信任的应用系统。

    9 引用 • 25 回帖 • 4 关注
  • GraphQL

    GraphQL 是一个用于 API 的查询语言，是一个使用基于类型系统来执行查询的服务端运行时（类型系统由你的数据定义）。GraphQL 并没有和任何特定数据库或者存储引擎绑定，而是依靠你现有的代码和数据支撑。

    4 引用 • 3 回帖 • 3 关注
  • 百度

    百度（Nasdaq：BIDU）是全球最大的中文搜索引擎、最大的中文网站。2000 年 1 月由李彦宏创立于北京中关村，致力于向人们提供“简单，可依赖”的信息获取方式。“百度”二字源于中国宋朝词人辛弃疾的《青玉案·元夕》词句“众里寻他千百度”，象征着百度对中文信息检索技术的执著追求。

    63 引用 • 785 回帖 • 109 关注
  • 机器学习

    机器学习（Machine Learning）是一门多领域交叉学科，涉及概率论、统计学、逼近论、凸分析、算法复杂度理论等多门学科。专门研究计算机怎样模拟或实现人类的学习行为，以获取新的知识或技能，重新组织已有的知识结构使之不断改善自身的性能。

    83 引用 • 37 回帖 • 1 关注
  • CodeMirror
    1 引用 • 2 回帖 • 156 关注
  • ZeroNet

    ZeroNet 是一个基于比特币加密技术和 BT 网络技术的去中心化的、开放开源的网络和交流系统。

    1 引用 • 21 回帖 • 640 关注
  • 开源中国

    开源中国是目前中国最大的开源技术社区。传播开源的理念，推广开源项目，为 IT 开发者提供了一个发现、使用、并交流开源技术的平台。目前开源中国社区已收录超过两万款开源软件。

    7 引用 • 86 回帖
  • Maven

    Maven 是基于项目对象模型（POM）、通过一小段描述信息来管理项目的构建、报告和文档的软件项目管理工具。

    186 引用 • 318 回帖 • 258 关注
  • NetBeans

    NetBeans 是一个始于 1997 年的 Xelfi 计划，本身是捷克布拉格查理大学的数学及物理学院的学生计划。此计划延伸而成立了一家公司进而发展这个商用版本的 NetBeans IDE，直到 1999 年 Sun 买下此公司。Sun 于次年（2000 年）六月将 NetBeans IDE 开源，直到现在 NetBeans 的社群依然持续增长。

    78 引用 • 102 回帖 • 701 关注
  • Windows

    Microsoft Windows 是美国微软公司研发的一套操作系统，它问世于 1985 年，起初仅仅是 Microsoft-DOS 模拟环境，后续的系统版本由于微软不断的更新升级，不但易用，也慢慢的成为家家户户人们最喜爱的操作系统。

    226 引用 • 476 回帖
  • SQLServer

    SQL Server 是由 [微软] 开发和推广的关系数据库管理系统（DBMS），它最初是由 微软、Sybase 和 Ashton-Tate 三家公司共同开发的，并于 1988 年推出了第一个 OS/2 版本。

    21 引用 • 31 回帖 • 1 关注
  • 小薇

    小薇是一个用 Java 写的 QQ 聊天机器人 Web 服务，可以用于社群互动。

    由于 Smart QQ 从 2019 年 1 月 1 日起停止服务，所以该项目也已经停止维护了！

    34 引用 • 467 回帖 • 759 关注
  • OnlyOffice
    4 引用 • 22 关注

最新标签