这一年来，由于工作原因，我接触的技术有

  • Yoga-Layout: RN 的布局引擎。
  • WebRTC: Leader 想推，但是在现实网络情况下不太实用的方案。
  • 阿里云函数计算：一种 Serverless 方案，开发体验说不上便利。
  • EggJS: 阿里的后端框架、用起来确实挺方便的，可以抛下成见去试一下。

上面的都是因为工作原因而去研究的。在业余，我主要是研究了这几项：

流程图编辑器

Draw.io 提供了在线流程图编辑器，而且开源了他们的代码。出于技术崇拜和好奇，我研究了他们的代码。

他们的是用 ES5 写的，对于这样的代码，我都喜欢改成 TS 进行研究。所以就埋头弄了几个月，将他们改写完，而且也能正常地跑起来。

不过这并没有给我带来太多喜悦，他们的编辑器代码是在有太多和流程图编辑相关的业务代码。如果把这样的代码都清理掉，剩下的架子并没有太多价值。所以我尝试去写一个自己的编辑器框架。

公司现在是有一个核心编辑器，其他业务可以用它来进行扩展。不过这个编辑器的代码扩展性是在太差了，在代码体积上来说，多其他业务是一种负担。所以我根据在这时研究了一个基于 TS 的框架，参考了 VSCode 代码做了一下全部 class 都能注入覆盖的设计。

这套 class 注入系统是我的研究成果；虽然他没有机会发挥，也没能在公司实际业务中去落地，不过以后应该有机会的吧。

CSS 广告编辑器

这个广告编辑器是我在网页编辑器弄完之后的空余时间里研究的。国外有些「古典」的 GIF 小广告，所以这样的广告编辑器可能会有些需求。出于给团队找活的目的，我就自己研究了一下。

这样的编辑器实现起来应该不难，我们团队的 H5 编辑器改一下应该就能做成。但是对于隔壁组提供的核心编辑器的厌恶。我想写一个 100% 可控的编辑器。

因为之前有写 Canvas 和动画经验，我就用以前的代码改写了一下，最后挺简单地就能兼容别人家的数据结构、实现动画播放。而且比起原来的编辑器，还实现了时间轴的 Seek 功能。

这个研究很快就结束，因为可能前景不佳。

视频编码和 FFMPEG 和 WASM

有个新闻是某个在线编辑网站拿了挺多风投，公司也开始在视频编辑方向发力。虽然我不是视频组的，但是多媒体相关的技术都没有研究过。

我从零了解了容器格式、编码格式这些基础内容，也编译了个 FFMPEG 的 WASM 版本用于播放 H.265 编码的视频。我甚至想去了解 MP4 的 SPE。不过出于实用角度考虑，需要为一个有商业价值的产品去研究技术。

我想到的是 LogRocket 那样的操作录屏，通过前端截图去完成记录用户操作。通过 HTML2Canvas 去做前端截图，然后用视频编码技术去压缩传输。不过考虑到 HTML2Canvas 和前端视频编码都效率不佳，就放弃了。

JS 沙箱

我入职 G 公司之后就开始做插件机制；但是插件并没有运行在沙箱，而且直接在主线程运行，所以会有安全问题。

最近公司的前端基建团队讨论了微前端方案，还有就是阅读了 Figma 的技术 Blog，我现在开始研究 QuickJS VM 打包成 WASM，然后配合类似 WorkerDOM 的设施完成一个安全的 JS 沙箱。