最近一年的个人研究
这一年来,由于工作原因,我接触的技术有
- 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 沙箱。