apache / echarts

Apache ECharts is a powerful, interactive charting and data visualization library for browser
https://echarts.apache.org
Apache License 2.0
60.16k stars 19.6k forks source link

[perf] websocket+A large amount of data websocket+10万级别数据+折线图 #17841

Open axz0506 opened 1 year ago

axz0506 commented 1 year ago

Version

eg.5.4.0

Link to Minimal Reproduction

No response

Steps to Reproduce

1、遇到的问题:网页卡顿、2分钟后网页崩溃 2、需要实现的业务:通过echarts的折线图观看一天的水闸开合高度 3、写代码的逻辑: 通过websocket一次性返回10万条数据用一个数组去接收数据、然后再通过websocket一秒钟传递一条数据,然后用10万条数据的那个数组先shift()数组之后在push()一条数据。在setoption更新echarts。结果2分钟之后网页崩溃了

  1. Problems encountered: the web page is stuck, and the web page crashes after 2 minutes
  2. need to achieve business: through the echarts line chart to watch the opening and closing height of the day of the sluice
  3. The logic of writing code: Return 100,000 pieces of data at a time through websocket using an array to receive data, and then pass one piece of data a second through websocket, and then shift() the array of 100,000 pieces of data and then push() one piece of data. Update echarts in setoption. Two minutes later the page crashed

Current Behavior

网页崩溃

Expected Behavior

网页崩溃

Environment

- OS:windows11
- Browser:Chrome、Edge
- Framework:Angular13

Any additional comments?

No response

echarts-bot[bot] commented 1 year ago

@axz0506 It seems you are not using English, I've helped translate the content automatically. To make your issue understood by more people and get helped, we'd like to suggest using English next time. 🤗

TRANSLATED
**TITLE** [perf] websocket+A large amount of data websocket+100,000 level data+line chart **BODY** ### Version eg.5.4.0 ### Link to Minimal Reproduction _No response_ ### Steps to Reproduce 1. Problems encountered: web page freezes, web page crashes after 2 minutes 2. The business that needs to be realized: watch the opening and closing height of the sluice one day through the line chart of echarts 2. The logic of writing code: Return 100,000 pieces of data at one time through websocket and use an array to receive data, and then pass one piece of data through websocket in one second, and then use the array of 100,000 pieces of data to shift() the array first and then push() a piece of data. Update echarts in setoption. As a result, the webpage crashes after 2 minutes 1. Problems encountered: the web page is stuck, and the web page crashes after 2 minutes 2, need to achieve business: through the echarts line chart to watch the opening and closing height of the day of the sluice 2. The logic of writing code: Return 100,000 pieces of data at a time through websocket using an array to receive data, and then pass one piece of data a second through websocket, and then shift() the array of 100,000 pieces of data and then push() one piece of data . Update echarts in setoption. Two minutes later the page crashed ### Current Behavior web page crashes ### Expected Behavior web page crashes ### Environment ````markdown - OS:windows11 - Browser: Chrome, Edge - Framework:Angular13 ```` ### Any additional comments? _No response_