技术期刊 · 路尘终见泰山平 | 微前端及插件化架构在 Wix 的实践;编辑器架构的第二路径;业务中的前端组件化体系;构建网站的 Spotlight 插件;Theia 技术揭秘之插件拓展;The...

HEADER

蒲公英 · JELLY技术期刊 Vol.47

不想当架构师的程序员不是“合格”的程序员？这一类的言论在很多文章中应该很常见吧，我们需要架构思维，要有抽象能力，要学会分层……需要的太多太多，可很少有合适的项目能够帮助我们养成这些思考的习惯，比如业务组件体系的设计，又比如编辑器等等，需要权衡技术与业务之间的平衡，架构设计稳定性与拓展能力，面对业务保持思考，泰山如砥平。

观海志

登山则情满于山，观海则意溢于海

微前端及插件化架构在 Wix 的实践

梗概：微前端的概念已经出现了相当一段时间。我们从 2013 年左右就开始在 Wix 中使用这种架构，甚至早在它被命名为 Wix 之前。这也是我们在 2016 年逐渐从 AngularJS 迁移到 React 的关键因素。多年来，我们一直在改进它，并积累了大量的经验。在本文中，我想与大家分享一些我们为了发展大规模微前端开发概念所做的工作(在撰写本文时，我们有 700名 开发人员在这个体系架构上工作)。

推荐语：作为世界上最优秀的建站产品之一，Wix 的建站编辑器功能和拓展性都非常强大。他们很早就采用微前端作为可插拔系统的解决方案，并一直在这个体系上进行迭代。这篇文章详细介绍了他们可插拔式微前端架构的诞生背景及技术实践，包括一整套的开发/测试、构建/发布、监控等的工作流，对应的可插拔的微前端架构的 IoC 库已开源：https://github.com/wix/repluggable

编辑器架构的第二路径

梗概：Slate 让你构建像 Medium, Dropbox Paper 或者是 Google Docs 这样丰富，直观的编辑器，而不会让你在代码实现上深陷复杂度的泥潭。

推荐语：编辑器应用的复杂度堪称是 Web 应用中数一数二的，业内知名的多人协同编辑器难度更是堪称业内标杆，但是编辑器真的就只能设计的无比复杂么？值得一提的是 Slate 整体设计优雅且灵活，各个模块设计精巧却十分易懂，值得细细品味。高效稳健的代码有时候和设计复杂度并没有很高的关联性，这很值得我们在组织各个模块能力时思考。

业务中的前端组件化体系

梗概：组件化已经是一个老生常谈，但是又经久不衰的话题。随着技术的更迭，业务复杂度的增加，组件化被反复拿出来重新审视，可以说组件化之路一定程度上体现了程序开发的发展历程。

推荐语：本文从实际业务场景出发，针对组件实现上的常见问题，深入浅出的剖析了组件设计思路，以及业务中的前端组件化体系的搭建，可以了解到组件状态的可组合性、分层复用以及跨技术栈集成等知识点，具备很强的实操性，非常值得一读。

构建网站的 Spotlight 插件

梗概：考虑实现类似 MacOS 的 Spotlight 和 Linear 的 command+k 体验？使用 kbar 可以为您的站点添加一个快速的、可扩展的 command + k 菜单。

推荐语：提升用户体验是一个很宏大的命题，但是有的时候却只需要简单的几步，例如你可以使用 kbar 就能够为您的网站加入媲美 Spotlight 的 command + k 体验，相信这对于很多个人开发者会很有帮助～

流觞亭

因山卜地心机巧，望水如天眼力穷

Theia 技术揭秘之插件拓展

梗概：Theia 的插件化设计十分有趣，在保证功能稳定的同时赋予了系统极强的拓展能力，本文从名词开始解析，叙述在 Cloud IDE 设计的过程中，需要一个怎样的插件系统，深入浅出的讲解不同系统模块之间的架构，教你快速上手编写 Theia 插件。

推荐语：Theia 插件系统功能非常强大，如此庞大的工程，同时还耦合了繁复的能力模块，却依然能保持高质量的代码和清晰的架构，这是很多业务项目都难以做到的，这样的项目架构可能很多时候并不需要，但一定值得我们思考和学习。

Theia 技术揭秘之 Theme

梗概：Theia 的主题设计遵循了 VS Code 的 Theme 规范，本文从类型开始，详细说明了实现需要考虑的问题，以及 Theia 应用具体实现 VS Code 规范下的 Theme 插件的细节。

推荐语：对于编辑器来说，从零开始实现是不现实的，那么如果可以兼容现有的设计就是一个很棒的选择，VS Code 各种意义上来说，都是一个极好的参考对象，通过兼容 VS Code 的主题就能够极大减少用户的迁移成本。

「蒲公英」期刊，每周更新，我们专注于挖掘「基础技术、工程化、跨端框架技术、图形编程、服务端开发、桌面开发、人工智能、设计哲学、前端框架」等多个大方向的业界热点，并加以专业的解读；不仅如此，我们还会推介精选凹凸技术文章，向大家呈现团队内的研究技术方向。

抬头仰望，蒲公英的种子会生根发芽，如夏花绚烂；格物致知，我们登高远眺、沧海拾遗，以求积硅步而至千里。

蒲公英 · JELLY技术期刊贡献指南

FOOTER

欢迎关注凹凸实验室