I am trying to use tickvals and ticktext in the range of 10K . how can I improve the performace?

plotly.js
1

I am using 3 x axis . These xPos, YValues, x2Pos,x3Pos,x2TickVals,x3TickVals are arrays that I use as input.

var trace1 = {
x:xPos,
y:YValues,
mode:“markers”,
type:“scatter”,
xaxis:‘x’,
yaxis:‘y’
}
var trace2 = {
x:XPos,
y:YValues,
mode:“markers”,
type:“scatter”,
xaxis:‘x2’,
yaxis:‘y’
}
var trace3 = {
x:xPos,
y:YValues,
mode:“markers”,
type:“scatter”,
xaxis:‘x3’,
yaxis:‘y’
}

   this.graph = {
      data :[trace1,trace2, trace3],
      layout : {
        
       
        showlegend: false,
        yaxis: {
        
        },

        xaxis:{
   
         
         
           tickvals:XPos,
           ticktext:XVals
          ticktextsize:5,
          tickangle:45,
        
        }, 
        xaxis2:{
         
           tickvals:x2Pos,
           ticktext:x2TickVals,
          ticklen:15,
          tickangle:90,
        
          overlaying: 'x',   
          //side:'top'               
        },
         xaxis3:{
      
           tickvals:x3TickPos,
           ticktext:x3TickVals,
          ticklen:0,
          tickangle:45,
          // tickwidth:0,
         ]
          overlaying:'x',
          side:'top'  ,
                  
        }
          
      },
       config :{
        scrollZoom: true,
        displaylogo: false,
        responsive:true
        //staticPlot :true
      },
      //renderer:'webgl'
   };
  });