万字长文，Electron高性能DLL调用实战：Worker线程处理图像

原创

已于 2025-10-19 10:29:58 修改 · 864 阅读

18 ·

CC 4.0 BY-SA版权

文章标签：

#electron #javascript #node.js #图像处理 #帧率优化 #前端

于 2025-10-17 16:06:06 首次发布

前言

在前面这篇文章中万字长文，Electron高性能DLL调用实战：手把手教你使用Koffi调用DLLhttps://blog.youkuaiyun.com/simon1030/article/details/153329559我们分享了如何通过Koffi调用DLL，并且通过回调函数，接收DLL传递过来的图像数据，今天我们将继续探讨一下，如果使用Node.js中的Worker线程来高效的处理DLL回调接收到的图像数据。

先回忆一下，在之前的回调函数中，我们解析了结构体中的图像数据，代码如下

const myImgInfoCallback = async (ImgInfoPtr) => {
 
    const imgInfo = koffi.decode(ImgInfoPtr, ImgInfo)
 
    const { deviceNum } = imgInfo
 
    const offset = koffi.sizeof(ImgInfo)
 
    const imgBuffer = koffi.decode(
        ImgInfoPtr,
        offset,
        imgInfoStruct,
        deviceNum
    )
 
}

可以看到代码中，有一个imgInfoStruct，这就是真正的图像数据了，下面结合C++头文件中的定义，先来完善一下这部分的代码，把图像数据，真正的解析到结构体中去。

解析结构体数据

在我们的C++头文件中，关于图像的相关结构体很多，主要的部分定义如下

enum MyImageAlignType
{
	DEPTH_2_COLOR = 0,
	COLOR_2_DEPTH = 1,
	UNALIGNED_TYPE = 2,
};

enum MyImageType
{
	RGB = 0,
	BGR = 1,
	GRAY = 2,
	DEPTH = 3,
	BINARY = 4,
};

typedef struct SingleImgInfo
{
	unsigned int deviceID;
	ImgInfo imgInfo;

	SingleImgInfo():deviceID(0)
	{}
}SingleImgInfo;

typedef struct ImgInfo
{
	MyImageAlignType alignType;
	MyImageType type;
	int channel;
	int width;
	int height;
	int dataLength;
	unsigned char* dataBuf;

	ImgInfo()
		: 
		alignType(UNALIGNED_TYPE), type(RGB),
		channel(0), width(0), height(0), dataLength(0), dataBuf(nullptr)
	{
	}
}ImgInfo;

现在在回调函数中，我们使用上面的结构体，将接收到的ImgInfo解析出来

const myImgInfoCallback = async (ImgInfoPtr) => {
 
    const imgInfo = koffi.decode(ImgInfoPtr, ImgInfo)
 
    const { deviceNum } = imgInfo
 
    const offset = koffi.sizeof(ImgInfo)
 
    const imgBuffer = koffi.decode(
        ImgInfoPtr,
        offset,
        koffi.struct({
            deviceID: 'unsigned int',
            colorImgInfo: koffi.struct({
                alignType: 'int',
                type: 'int',
                channel: 'int',
                width: 'int',
                height: 'int',
                dataLength: 'int',
                dataBuf: koffi.pointer('void')
            })
        }),
        deviceNum
    )
 
}

这样decode之后，就可以拿到图像数据的数组，数组中就包含了我们需要的图像buffer，以便进行下一步操作。前端同学看到这里或许有点迷茫，什么是buffer？

什么是buffer

buffer 就是一个 Node.js Buffer 对象 或 Uint8Array，里面存放着图片的原始像素字节。

Buffer = 原始的二进制数据块（内存区域）

在 C/C++ 里，图片、声音、视频、文件等数据，本质上都是一段连续的内存空间

unsigned char* dataBuf; // 指向内存首地址
int dataLength;         // 表示这块内存的长度（字节数）

这段内存就叫做一个 buffer（缓冲区）。

异步队列

接下来，我们就需要将图片保存到本地，要求保存为无损的bmp格式。

保存之前，我们先来看一下，在定义的结构体中，有一个专门定义图片类型的枚举类型：

enum MyImageType
{
	RGB = 0,
	BGR = 1,
	GRAY = 2,
	DEPTH = 3,
	BINARY = 4,
}

这个枚举类型定义了多种格式，具体是什么呢？让我们先来翻译一下

名称	整数值	含义
RGB	0	彩色图像，像素按红绿蓝通道顺序排列
BGR	1	彩色图像，像素按蓝绿红通道顺序排列（OpenCV 默认格式）
GRAY	2	灰度图像（每个像素 1 个亮度