Loading Message - First time app is loaded

2,170 views
Skip to first unread message

John Reeder

unread,
Feb 5, 2013, 4:47:05 PM2/5/13
to shiny-...@googlegroups.com
Some of the apps I've made require a few seconds to load, which I think can be confusing for some users.  I want to add a "Loading" message either through an animated gif, or just some text on the screen.  I tried to just do it when the iframe is loaded using jquery, but the loading message disappears before the entire app is actually loaded.  I wonder if there's another way to animate a "Loading" message through Shiny, so that the user sees something while csv files are being loaded and graphs are being rendered for the first time.

Thanks in advance for any thoughts you all might have.

Joe Cheng

unread,
Feb 5, 2013, 5:36:39 PM2/5/13
to shiny-...@googlegroups.com
Do you have an example URL? I'm wondering if you mean that it takes time before the HTML even loads (such as a lot of startup code in global.R or outside the server function) or if you mean after the app has loaded but before the first output results have come back.


On Tue, Feb 5, 2013 at 1:47 PM, John Reeder <jreed...@gmail.com> wrote:
Some of the apps I've made require a few seconds to load, which I think can be confusing for some users.  I want to add a "Loading" message either through an animated gif, or just some text on the screen.  I tried to just do it when the iframe is loaded using jquery, but the loading message disappears before the entire app is actually loaded.  I wonder if there's another way to animate a "Loading" message through Shiny, so that the user sees something while csv files are being loaded and graphs are being rendered for the first time.

Thanks in advance for any thoughts you all might have.

--
You received this message because you are subscribed to the Google Groups "Shiny - Web Framework for R" group.
To unsubscribe from this group and stop receiving emails from it, send an email to shiny-discus...@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

John Reeder

unread,
Feb 5, 2013, 5:42:35 PM2/5/13
to shiny-...@googlegroups.com
Here's an example, which takes the most time to load:


global.R does load a 9mb CSV file.  That csv file is used to generate the name list in ui.R.

If it would speed the ui loading up, I could move the load of the csv into server.R and then just load a name list separately.

But even if I did that, I do think it would be useful to have some kind of "loading" message.  I think once users can see the sidePanel, they know to wait for the rest of the page.  I'm just mostly worried about making sure that people who don't immediately see the sidePanel know that the app is still loading.

John Reeder

unread,
Feb 5, 2013, 5:55:50 PM2/5/13
to shiny-...@googlegroups.com
OK, I got rid of the need for global.R and changed the url slightly.


I think it is loading faster now.
Message has been deleted

Andrew Clark

unread,
Feb 6, 2013, 3:16:49 PM2/6/13
to shiny-...@googlegroups.com, ree...@svn.com
I'm getting page not found for the second URL

John Reeder

unread,
Feb 6, 2013, 3:24:24 PM2/6/13
to shiny-...@googlegroups.com
Sorry about that.  I think because of caching maybe I often have to rename the file folders in order to see changes when I update the code.  So in this case I renamed the directory/url.

It is here for now:


In order to speed things up I moved the loading of the csv into server.R and also changed the display of some graphs from being vertically displayed to having them in tabsets.  These two changes improved the loading time dramatically (and also improved rendering times when the selectInput changes).  Also, just to be safe I added about a 4 second loading message that fades out on the page that the iframe is loaded into.  I couldn't tie it to the iframe's ready state as it would disappear too quickly.  I still think it works as a nice cue to the user that something is being loaded.

Joe Cheng

unread,
Feb 6, 2013, 4:52:54 PM2/6/13
to shiny-...@googlegroups.com
Nice!

You might get another speed improvement by installing the latest development build of Shiny:

install.packages("devtools")
devtools::install_github("shiny", "rstudio")

Specifically, right now when you flip around between tabs, the graphs always need to recompute. I believe with our newest build you will see the graphs only recompute when something has actually changed (or if they have not been shown before).


--

Andrew Clark

unread,
Feb 6, 2013, 5:10:52 PM2/6/13
to shiny-...@googlegroups.com, ree...@svn.com
Yes that is way swifter. Did not even see the loading message. Do you have the code on github? I'd certainly be interested to see it

John Reeder

unread,
Feb 6, 2013, 5:35:48 PM2/6/13
to shiny-...@googlegroups.com
Great, I'll update to the most recent version of shiny.

I don't have the code on github or anything (I'm a self taught plodder, so my code is always gross looking, not commented well, and generally embarrassing).  

It's pretty straightforward though.  I'm just using the select2 jQuery library as demoed by Vincent in the Shiny Discuss forum.  Then all of the server.R code is basically just subsetting a dataframe and spitting it out as a ggplot graph.  One thing I was wondering about, which I haven't spent very much time on, is if I wanted to constrain the number of selections in the selectInput to 3, how I would do that.



--
Message has been deleted

John Reeder

unread,
Feb 8, 2013, 4:36:44 PM2/8/13
to shiny-...@googlegroups.com
Vincent - Thanks so much for pointing out the place to limit the input on the select2.

Zak-  The input just uses the select2 library as described by Vincent in one of the other forum messages.  Generating the plots is super easy using ggplot2.  Basically you just subset a dataframe using the input that comes back from select2 and then you do a facet based on whatever variable you want to view the different plots by.  Here's my code, which I apologize for ahead of time (let me know if something isn't clear):

  plyrs <- reactive(function() {
    
#this function just takes the input back from the select2 box PID and it returns a dataframe with two columns which are identical. 
#it contains a try function because otherwise it will throw an error message briefly
    plyrs <- data.frame(cbind(input$PID,input$PID))
    try(colnames(plyrs)[1] <- "PID",silent=TRUE)
    plyrs
  })
  
  
  output$mstd <- reactivePlot(function() {

#this function just takes the dataframe containing the players that the input had returned and it subsets the main dataframe sumTbl
#so we subset the dataframe sumTbl by merging it with the plyrs dataframe and it throws out all of the non-matches
#then we just do a ggplot bar graph with a facet.  I also have a custom annotation that includes the watermark.
    
    plyrs <- plyrs()
    
    if(nrow(plyrs)>0){
    sumTbl <- merge(sumTbl,plyrs,by.y="PID",by.x="TID")
    
    print(ggplot(sumTbl,aes(YR)) + annotation_custom(rvLogo) + geom_bar(aes(y=msTD),stat="identity",alpha=.8) + facet_wrap(~TRGNAME,nrow=1) + xlab("Year") + scale_y_continuous(labels = percent) + ylab("Market Share") + theme_bw())
    }
    
  })
Reply all
Reply to author
Forward
0 new messages