[WebAssembly] Rust 和 Wasm 的融合，使用 yew 构建 WebAssembly 博客应用的体验报告
💥 内容涉及著作权，均归属作者本人。若非作者注明，默认欢迎转载：请注明出处，及相关链接。
Summary: 目前的 Rust 生态中，WebAssembly 应用构建一直是官方推广的重点，前景十分广阔。最近几天，笔者使用 Rust WebAssembly 框架 yew 构建了一个基础的博客应用。在符合团队合作开发的模式下，大约进行了 50% 左右的优化，以及 rustwasm 团队 和 yew 官方推荐的极致压缩（包括 panic 剔除）。本文，即是对此进行一个简略的初始体验报告，后续或许有更详细的应用体验总结。
Topics: rust webassembly async-graphql wasm yew rusthub
WebAssembly 相对其它 web 标准来说，稍显新颖。但 wasm 的应用范畴和方向，却十分广阔。关于其优势所在，本文不做赘述，网上有许多分析比较的文章。我们从 Rust 周报趋势来领会，可以发现 Rust 官方在 WebAssembly 上投入了不少精力。Rust 社区中，Rust + WebAssembly 的应用也比较热门，其文章和话题增长趋势显著。
因此，笔者对 Rust 和 Wasm 的融合非常感兴趣，在此兴趣驱动之下，开发了一个前端较完整的 WebAssembly 博客应用。虽然，就开发博客而言，对 WebAssembly 技术来说，是大材小用，并且也非 wasm 技术的优势所在。但不可否认，web 应用（包括移动互联网应用）始终是主流，以及未来方向。
并且，Rust 前端开发方面，相较于其它 js 前端库/框架，也并非没有优势。关于 Rust web 前端库/框架的评测，可以参阅文章《Rust web 前端库/框架评测，以及和 js 前端库/框架的比较》。
因此，本文从一个简单但前端完整的博客，对 Rust 生态中赞数最多的 wasm 框架 yew 进行稍完整的体验。
Rust 生态中，较完整的 wasm 框架主要有
yew、seed，以及percy。笔者进行简单的试用和比较后，选择了yew：
- 关于 Rust wasm 框架的选择以及入门教程，请参阅文章《Rust 和 Wasm 的融合，使用 yew 构建 WebAssembly 标准的 web 前端（1）- 起步及 crate 选择》
- 关于 Rust wasm，具体来说 yew 获取 GraphQL 数据并解析的示例，请参阅《使用 yew 构建 web 前端（4）- 获取 GraphQL 数据并解析》
本文是体验报告的初始版本，仅从开发效率、性能、部署、团队，以及扩展 5 个方面简述。
开发效率
作为开发人员，开发效率绝对是最关心的一个技术栈选择考量点。笔者对 Python web 开发（flask、django、sanic，以及 aiohttp 等）、JavaEE，以及 NodeJS 的 react 稍有经验，可谈熟悉。需要说明的是：本文的比较，角度是独立构建一个完整的、前后端分离的 web 应用。所以不必对前述所列技术中，有些是侧重于后端，有些是纯前端，而感到疑惑。比如 react 必定要结合数据服务后端来比较的。
本次 yew 体验开发中，后端是采用 tide + async-graphql + mongodb 构建的 GraphQL API（感兴趣可参阅《基于 tide + async-graphql + mongodb 构建 Rust GraphQL 服务》，或者《基于 actix-web + async-graphql + rbatis + postgresql / mysql 构建 Rust GraphQL 服务》）。
就笔者体验而言，熟练后，开发效率非常可观。不同的技术，不能下绝对结论。但如果说新的起步项目，仅考虑技术选择，笔者一定会选择 Rust wasm/模板库 + async-graphql 的组合。
Rust 生态内部比较，笔者则可以大胆给一个说法，yew 开发 Rust web，要比 handlebars-rust 模板方式高效一些。笔者原先先用 handlebars-rust 模板构建了博客（《使用 handlebars、rhai 开发 Rust web 前端》），此次 yew 构建按的博客，是一次重写。
性能
运行性能方面，基本和《Rust web 前端库/框架评测，以及和 js 前端库/框架的比较》文中所述一致。笔者开始使用 yew v0.18，后来改为 yew master，简单测试，性能是有所提升的。相信 yew v0.19 发布后，性能会有很大提升。
部署
部署需要从 3 个方面来说：
- 打包。根据 yew 官方建议，机制压缩（包括 panic 剔除）后，此简单博客应用打包为 450k 左右。rustwasm 官方团队的
wasm-pack打包模式，对不同的 wasm 包可以分割应用的。笔者使用了trunk打包工具，若要分割 wasm 包，目前则需要通过独立的yew项目的模式。 - 发布。发布则比较简单，编译为 html 文件后，直接使用应用服务器，如 nginx、apache 则可。目前 Rust 生态中，也有专用的 wasm 服务器。
- 使用。使用方面，即是 web 应用体验。但如果希望网站对 seo 更友好，则不太合适。
团队
目前，此项目是笔者个人开发的。根据开发过程来看，如果团队应用，可能需要有较高的设计要求。否则，要么要分散为很多小项目，要么打包文件会过大。
扩展
扩展实质上是生态，目前的 Rust wasm，生态还处于起步阶段，扩展或许数量看起来还行，但和其它如 NodeJS 生态比起来，质量则差太远。比如有些 yew/wasm 的样式库，要么巨丑，要么完成度接近于 1（如果按 1-10 划分完成度）。
但是，rustwasm 官方一直致力于直接使用 js 生态，笔者本次也直接使用了不少 js 脚本，感觉总体来说，生态不是问题！无须担心，完全撑得起复杂 web 应用。
以上仅是个人使用的浅显体验，仅供参考。如果您想深入使用，建议参考一些资料，实践后再下结论。
完整源码，包括数据等，都开源在 github/zzy/surfer，欢迎您给予指导，或者功能贡献。
题外话——
- 没想到通常阅读量 300 左右的 Rust 官方周报翻译，竟然有近百位朋友联系笔者问询中断原因。笔者 7 月份外出，8 月初才回家。所以 Rust 官方周报翻译一直中断。如果您愿意翻译，欢迎有偿投稿。当然，对于其它文章，不限于技术，笔者也非常欢迎您有偿投稿。
- WebAssembly 应用开发方面，欢迎交流，特别是游戏开发、AR/VR 方面。
谢谢您的阅读！