青岛西海岸新区建设网站,400免费服务电话申请,企业信息在线查询,广东网站建设设计服务前不久做的一个项目#xff0c;需要在前端实时展示硬件设备的数据。设备很多#xff0c;并且每个设备的数据也很多#xff0c;总之就是数据很多。同时#xff0c;设备的刷新频率很快#xff0c;需要每2秒读取一遍数据。
问题来了#xff0c;我们如何读取数据#xff0c…前不久做的一个项目需要在前端实时展示硬件设备的数据。设备很多并且每个设备的数据也很多总之就是数据很多。同时设备的刷新频率很快需要每2秒读取一遍数据。
问题来了我们如何读取数据并且在前端展示
我的想法是利用多级缓存 1首先是有个数据采集程序不停地采集设备的数据。采集到数据以后写入redis的1号库 2WEB后端设置一个定时器每2秒读一次redids的1号库处理后写入redis的2号库。之所以要处理一下是因为1号库的数据比较原始处理后才适合前端处理 3前端也设置一个程序每2秒向后端请求一次数据后端将redis#2数据返回前端收到数据后写入前端缓存。我们前端是用vue搞的所以存入store。 4前端由很多个组件构成每个组件都从store中读取数据然后展示。
系统结构如图所示 优点 1数据采集程序与WEB前后端解耦职责单一除了采集数据啥都不用管。简单的往往就是最好的不容易出错 2后端定期处理原始数据将结果缓存当前端请求时返回缓存中的该结果减少重复劳动提高了性能 3前端虽有多个组件但不是每一个组件都向后端请求而是统一请求一次存入前端缓存然后全部组件都从前端缓存中读取对性能是一个保障。
事实证明这种多级缓存机制下前端展示数据非常迅速及时。虽然前端和WEB后端之间没有使用websocket进行数据传输而是使用了最笨的定期获取但丝毫没有影响前端的用户体验。
