实时数据处理优化：解决base64图像数据处理卡顿问题

最近在维护一款需要实时预览硬件图像的应用时，我遇到了一个棘手的问题。图像数据从硬件设备不断传输过来，而我需要实时将这些数据处理后展示到页面上，但这导致了严重的性能问题。具体来说，页面频繁卡顿，无法保证流畅的用户体验。为了避免频繁请求导致的性能瓶颈，我最终使用了一段代码来解决了这个问题。

问题描述

在开发过程中，设备通过接口实时传输图像数据。每秒钟会有多帧图像传输过来，而每帧图像的处理都会触发一些后续操作，比如将图像转换为Base64格式并展示。

最初我直接在每次接收到新图像时都进行处理，这样导致了处理过于频繁，每一帧的图像都被立即处理并显示，造成了页面卡顿。尽管使用了 requestAnimationFrame 来优化性能，但还是有性能瓶颈。

挑战

• 频繁的数据处理：每一帧都被处理，导致高频率的请求和UI更