RaTeX：纯 Rust 公式渲染引擎，跨七端零 JS 依赖

2026-05-31 2026年05月 20260503-RaTeX纯Rust公式渲染引擎.md

RaTeX：纯 Rust 公式渲染引擎，跨七端零 JS 依赖

来源：群聊分享（菩提树）
整理时间：2026-05-03
标签：#RaTeX #Rust #公式渲染 #KaTeX #跨平台 #移动端 #离线 #Flutter #React-Native #iOS #Android

一、项目概览

项目	信息
GitHub	github.com/erweixin/RaTeX
语言	Rust（100% 原生实现）
平台	iOS、Android、Flutter、React Native、Web、PNG、SVG
JS 依赖	零
网络依赖	零（完全离线）
语法兼容	KaTeX 约 99%

一句话： 用纯 Rust 从零实现的公式渲染引擎，把 JavaScript 和 WebView 从渲染链路里踢出去。

二、核心问题：为什么需要 RaTeX

2.1 传统方案的痛点

方案	问题
WebView	内存消耗大、启动慢、依赖网络
JavaScript (KaTeX)	需要 JS 引擎、包体积大
原生渲染	跨平台工作量大、维护成本高

2.2 RaTeX 的解决方案

传统链路：数据 → JS引擎 → WebView → 渲染
RaTeX链路：数据 → Rust核心 → 原生渲染

优势：

优势	说明
🚀 启动快	无需启动浏览器内核
💾 内存省	直接原生渲染，无 WebView 开销
📦 体积小	无需打包 JS 引擎
🔒 隐私安全	完全离线，数据不外传
🌐 零依赖	不依赖任何外部库

三、支持的平台

3.1 平台覆盖

平台	支持情况	说明
iOS	✅	Swift 原生接口
Android	✅	Kotlin 原生接口
Flutter	✅	Dart 插件
React Native	✅	React Native 组件
Web	✅	Wasm 编译运行
PNG	✅	图片导出
SVG	✅	矢量图导出

3.2 全平台覆盖示意

        ┌─────────┐
        │  RaTeX  │
        │  Core   │
        │ (Rust)  │
        └────┬────┘
             │
    ┌────────┼────────┐
    │        │        │
    ▼        ▼        ▼
┌──────┐ ┌──────┐ ┌──────┐
│ iOS  │ │Android│ │Flutter│
│Swift │ │Kotlin │ │ Dart  │
└──────┘ └──────┘ └──────┘
    │        │        │
    ▼        ▼        ▼
┌──────┐ ┌──────┐ ┌──────┐
│ RN   │ │ Web  │ │ Image │
│组件  │ │Wasm  │ │导出  │
└──────┘ └──────┘ └──────┘

四、功能特性

4.1 公式类型支持

类型	示例
分数	`\frac{a}{b}`
根号	`\sqrt{x}`
积分	`\int_{0}^{\infty}`
矩阵	`\begin{matrix} a & b \\ c & d \end{matrix}`
求和	`\sum_{i=1}^{n}`
极限	`\lim_{x \to \infty}`
三角函数	`\sin`, `\cos`, `\tan`
化学方程式	`\ce{H2O}`
物理单位	`\SI{10}{\meter}`

4.2 导出格式

格式	用途
PNG	静态图片、文档嵌入
SVG	矢量图、无限缩放
Wasm	Web 端直接运行

五、KaTeX 兼容性

5.1 兼容度

项目	兼容度
语法兼容	约 99%
常用表达式	✅ 分数、根号、积分、矩阵
特殊符号	✅ 希腊字母、数学符号
化学支持	✅ 额外支持
物理单位	✅ 额外支持

5.2 迁移指南

从 KaTeX 迁移到 RaTeX：

// KaTeX 写法
katex.render("c = \\sqrt{a^2 + b^2}", element);

// RaTeX 写法（Web/Wasm）
ratex.render("c = \\sqrt{a^2 + b^2}", element);

注意： 大部分 KaTeX 语法直接可用，无需修改。

六、应用场景

6.1 理工科教育

场景	说明
数学公式展示	在线课程、教材 App
化学方程式	化学实验报告
物理计算	公式推导展示
考试系统	题目录入、答案展示

6.2 学术应用

场景	说明
论文写作	LaTeX 公式预览
学术搜索	公式渲染展示
知识库	数学知识库
文档系统	API 文档、技术文档

6.3 移动端 App

场景	说明
教育 App	数学辅导、题库
计算器	科学计算器
笔记应用	支持数学笔记
阅读器	学术论文阅读

七、性能对比

7.1 渲染性能

方案	首次渲染	内存占用	包体积
WebView + KaTeX	500ms+	50MB+	200KB+
RaTeX (原生)	<10ms	5MB	2MB
RaTeX (Wasm)	<50ms	10MB	500KB

7.2 离线能力

方案	离线可用	数据隐私
WebView + CDN	❌ 需要网络	❌ 数据外传
RaTeX	✅ 完全离线	✅ 数据本地

八、快速上手

8.1 Flutter 集成

# pubspec.yaml
dependencies:
  ratex_flutter: ^1.0.0

import 'package:ratex_flutter/ratex_flutter.dart';

// 渲染公式
RaTeX.render(
  r'\int_{0}^{\infty} e^{-x^2} dx = \frac{\sqrt{\pi}}{2}',
  controller: RaTeXController(),
);

8.2 React Native 集成

npm install @ratex/react-native

import { MathView } from '@ratex/react-native';

// 渲染公式
<MathView math={r'\frac{-b \pm \sqrt{b^2-4ac}}{2a}'} />

8.3 iOS Swift 集成

import RaTeX

let renderer = RaTeXRenderer()
renderer.render(string: "\\sum_{i=1}^{n} i = \\frac{n(n+1)}{2}")

8.4 Android Kotlin 集成

import com.ratex.RaTeXView

val view = RaTeXView(context)
view.setLatex("\\int_{a}^{b} f(x) dx")

8.5 Web/Wasm 集成

<script type="module">
  import init, { render } from './ratex_core.js';
  await init();
  render('\\frac{a}{b}', document.getElementById('output'));
</script>

九、项目结构

9.1 核心模块

RaTeX/
├── core/               # Rust 核心渲染引擎
│   ├── parser/         # LaTeX 语法解析
│   ├── layout/         # 排版引擎
│   └── render/         # 渲染输出
├── platforms/          # 各平台适配
│   ├── ios/            # iOS Swift SDK
│   ├── android/        # Android Kotlin SDK
│   ├── flutter/        # Flutter 插件
│   ├── react-native/   # RN 组件
│   └── web/            # Wasm 编译
└── tools/              # 工具
    ├── png-export/     # PNG 导出
    └── svg-export/     # SVG 导出

十、适用人群

人群	原因
移动开发者	跨平台公式渲染，无 WebView 开销
教育 App	离线可用，适合无网环境
学术应用	KaTeX 兼容，迁移成本低
性能敏感场景	启动快、内存省、包体积小
隐私敏感场景	完全离线，数据不外传

十一、总结

11.1 一句话评价

RaTeX = Rust 原生渲染 + 七端覆盖 + 零 JS 依赖 + KaTeX 99% 兼容 + 完全离线，移动端公式渲染的最优解。

11.2 优势汇总

特性	传统方案	RaTeX
启动速度	500ms+	<10ms
内存占用	50MB+	5MB
包体积	200KB+	2MB
离线可用	❌	✅
跨平台	需分别实现	✅ 七端统一
维护成本	高	低

11.3 局限性

局限	说明
生态	新项目，社区较小
完整度	约 99% KaTeX 兼容
高级特性	部分边缘语法不支持

十二、资源链接

资源	链接
GitHub	github.com/erweixin/RaTeX
相关项目	KaTeX (语法参考)

本文由 AI 辅助整理，供技术学习参考。