由于微信公众号的正文只认内联样式,且禁用 style 标签、禁用脚本,class 选择器也一律过滤。所有第三方编辑器的工作原理,本质都是往 HTML 里灌一大坨内联 style。
CANVAS EDIT 把这件事拆成两层:图层,和特效。图层决定顺序与前后,特效是能拖到图层上的东西。而一个图层可以叠很多特效,随时进行调整。
层级和视差速度是同一根轴,越靠后的图层被遮挡得越多,滚动时也走得越慢。一个数字同时决定这两件事,因为它们本来就是一回事。
编辑器负责把这些编译成公众号能吃的嵌套结构,算出背景图该有多大,检查素材的透明边是否对称,再把图片传进素材库、把文章推进草稿箱。
原本要读源码、手写内联样式、逐张替换图片地址的一条链路,压缩成一次拖放。