I have a line chart from SciChart https://www.scichart.com/ on React Native app. And usually get about 3500 objects from the Rest API for it with the next type:
interface ChartItem {
time: Data;
value: number;
}
type ChartData = ChartItem[]
And after when I'm getting the data on the front part, I made some map, because I need to modify the data to ISOString with moment.js https://momentjs.com/ like this:
public get chartData() {
return this.data.map((el) => ({
time: moment(el.date).toISOString(true),
value: el.value,
}));
}
The data from the server comes usually fast, but the render of the chart is very slow. It takes about 15-30 seconds. And moreover it is so slow and luggy for the layout when to change the orientation from the portrait to the landscape mode and back. What do you think guys which the best way to improve the data performance in this situation? How about to decrease the length of the data from the server, and which the best array length would be for the line chart? And maybe to make the data modification on the backend part and send it to the front? Or maybe do you know which way will be more faster for the iteration on the long array?