Delay durante a renderização de gráficos no Shiny

Eu tenho um ShinyApp e estou tentando fazer com que os gráficos não sofram com a demora da renderização quando eu omito e ativo o sidebar no shinydashboard. Os meus gráficos estão dentro de um shiny::box e sempre ocorre esse delay quando o gráfico muda de tamanho. Este é meu app reprodutível:

library(shiny)
library(shinydashboard)

header <- dashboardHeader(title = "Dashboard", titleWidth = 300)

sidebar <- dashboardSidebar(width = 300, 
                        
                            sidebarMenu(id = "tabs",
                                    
                                        menuItem(text = "Plot", tabName = "plot", icon = icon("chart-pie")) 
                                    
                                        )
                            )

body <- dashboardBody(

  tabItem(tabName = "plot",

  fluidPage(

    column(width = 12, 
       
           box(plotOutput(outputId = "plot1", click = "plot_click"), width = 6, title = 
"Gráfico 1"), 
       
           box(plotOutput(outputId = "plot2", click = "plot_click", width = "75%"), width = 6, title = "Gráfico 2")
       
           ) 
    )
  )

)

ui <- dashboardPage(header, sidebar, body, skin = "blue")

server <- function(input, output) {

  output$plot1 <- renderPlot({

    plot(x = data.frame(x = replicate(n = 1, expr = runif(n = 1, min = 1, max = 7))), 
         xlab = "A", ylab = "B")

  })

  output$plot2 <- renderPlot({

    plot(x = data.frame(x = replicate(n = 1, expr = runif(n = 1, min = 1, max = 7))), 
         xlab = "A", ylab = "B")

  })

}

shinyApp(ui, server)

Note que, no momento em que se esconde o sidebar e quando ele é ativado de novo, ocorre um leve delay da renderização. Eu tenho duas perguntas:

  • Como acabar com esse delay?

  • Como centralizar este gráfico dentro de shiny::box, como se o gráfico fosse um elemento que eu aplicasse a propriedade CSS justify-content: center? Por exemplo, no segundo gráfico o width é de 75%, mas o gráfico fica alinhado a esquerda do shiny::box.

O que eu tentei: usar a função graphics::par para tentar solucionar a segunda pergunta, mas não adiantou. O delay eu tentei algumas alternativas apresentadas no SOen mas nenhuma adiantou pra mim.

***Estou no ambiente golem.

Eu agradeço a atenção.

Para o primeiro caso, adiciona-se o CSS no body:

          fluidPage(
            
            tags$head(
              tags$style(HTML("
      img {
          max-width: 100%;
          }"))
            ),
            
            column(width = 12,
                   box(plotOutput(outputId = "plot1", click = "plot_click"), width = 6, title = "Gráfico 1"), 
                   
                   box(plotOutput(outputId = "plot2", click = "plot_click", width = "75%"), width = 6, title = "Gráfico 2")
                   
            ) 
          )

E a largura máxima nunca ultrapassará 100% do box.

Para o segundo caso, envolva a função plotOutput dentro de column com align = "center":

column(12, align = "center", plotOutput("plot1", click = "plot_click"))

Para centralizar os gráficos dentro de shiny::box.

1 curtida