焦作会计做继续教育在哪个网站/seo模拟点击工具

在QQ聊天中有时会遇到一种神奇的图片,看起来是一张图,打开一看是另一张图,我们称这种图片为“幻影坦克”。
于是我产生了一个想法,如果能实现自动合成“幻影坦克”,为什么不把它做成一个WASM应用呢?
在本系列文章中,我将使用Rust
与TypeScript
逐步实现幻影坦克制作工具,最终以静态单页应用的形式发布。
理论基础
ElPsyCongree:幻影坦克架构指南(一)zhuanlan.zhihu.com



感谢作者 @ElPsyCongree,以上文章讲解得很清楚。
事实上,幻影坦克没有那么神秘,只需要将两张图片按简单的公式计算,合成一张新的图片就行了。
架构设计
底层: 通用算法库,实现算法,暴露一个通用的抽象,这样可以同时给binary和wasm使用。
绑定:将Rust数据结构导出为js风格的对象,便于操作。
应用:使用html实现界面,js调用wasm进行计算。
算法库
基础图像处理库:image-rs/image
首先,虽然这是一个接收两张图片,输出一张图片的纯函数,但用Rust特色的面向对象范式来写会比较舒服。
用一个结构体来存储输入的两张图片。
pub struct MirageTank {wimage: DynamicImage,bimage: DynamicImage,
}
定义两个构造函数,new
直接由结构体内字段构造,from_raw
从内存中载入图片,让wasm调用时减少数据复制。
impl MirageTank {#[inline]pub fn new(wimage: DynamicImage, bimage: DynamicImage) -> Self {Self { wimage, bimage }}pub fn from_raw(wbuffer: &[u8], bbuffer: &[u8]) -> ImageResult<Self> {let wimage = load_from_memory(wbuffer)?;let bimage = load_from_memory(bbuffer)?;Ok(Self { wimage, bimage })}
}
直接实现处理算法。
impl MirageTank {pub fn grey_output(&self,width: u32,height: u32,checkerboarded: bool,wlight: f32,blight: f32,) -> RgbaImage { ... }pub fn colorful_output(&self,width: u32,height: u32,checkerboarded: bool,wlight: f32,blight: f32,wcolor: f32,bcolor: f32,) -> RgbaImage { ... }
}
看起来几步就写完了,实际上需要阅读算法理论,借鉴已有的实现,考虑如何尽量减少数据复制,精简API。如果这一步没有做好,在往高层应用走的时候会经常返工。
想要阅读完整代码,请移步GitHub仓库:
Nugine/mirage-tankgithub.com后篇:
Nugine:幻影坦克与WASM (二)zhuanlan.zhihu.com