Black Lives Matter. Please consider donating to Black Girls Code today.

Need help optimizing speed of graphing

I have an array that consist of data that is being emitting to my HTML page at 10 hertz. I want each element in the array to extend a trace (live streaming).

 Plotly.newPlot(plotDiv, data, layout);
        //creating # of traces based on array size, have an trace already so thats why it starts at 1. 
       socket.once('temp', function(temp){
              for (var i = 1, len = temp.length; i < len; i++) {
              Plotly.addTraces(plotDiv,{x: [],y: []});
            };
         });

     setInterval(function(){
        socket.once('temp', function(temp){
            for (var i = 0, len = temp.length; i < len; i++) {
            var currentdate = new Date();
            var time =currentdate.getHours()%12 + ":" + currentdate.getMinutes() + ":" + currentdate.getSeconds() + ":" + currentdate.getMilliseconds();
            var update = {
              x: [[time]],
              y: [[temp[i]]]
            };
            Plotly.extendTraces(plotDiv, update, [i], points);
          }
        });
      }, seconds * 1000);

The code runs fast with an array consisting of 2 or 3 elements, like [2,4,5]. But once I get an array of 4 or more elements, the graphs really slows down. Do you have any suggestion on increasing optimization time?