I have a shiny app with good performance on desktop but terrible performance on mobile. I'm wondering if there are any standard methods for improving mobile performance. The app visualizes networks using the networkD3 package and should ideally be able to handle 100 nodes on screen at a time. Any ideas about how to profile or improve shiny app mobile performance?
Hi there! A good place to start might be the performance analysis tools in most desktop browsers. For example, Chrome has the Performance Monitor, which allows you to make a recording of your website in action and look at things like how long JavaScript functions take and what the browser is broadly doing (calculating layout, painting, etc.). Even if you're not seeing the problem on desktop, this might give you an idea of what bottlenecks performance—whether it's the page waiting on Shiny at the server end, or it's something to do with the networkD3 library, or whatever.
Chrome also allows you to do remote debugging, where you plug in an Android phone and debug it from your desktop. I'm not sure whether you can run the Performance Monitor on the remote device, but it might help!
I doubt #shiny is the bottleneck, but if you want to put that to the test, you could export the #networkd3 plot to an HTML file/s using the saveNetwork() function and test if that works better... you might be able to at least eliminate shiny as the culprit.
More likely, I would guess the performance is related to D3's SVG and DOM manipulation, and then on top of that, simulating animation by updating every element multiple times per second. You might be able to gain some insight into that by using the browser's built-in debugging tools, but practically speaking, you won't be able to change or fix anything you learn from that without hacking the JavaScript code packaged inside of networkD3, and if you're able and willing to do that, you probably don't need to use networkD3 in the first place (and if you can/are, please consider contributing to networkD3 at https://github.com/christophergandrud/networkD3).
After exporting my plot to html and opening on my iphone6s, I can confirm that the performance is still quite slow. So I can rule out shiny as the culprit. Thanks for the idea!
I don't have javascript skills, but I've been meaning to learn. Perhaps hacking the code to work well on mobile is my excuse to learn d3.
Since I've ruled out the shiny part of the app, I'll mark your reply as correct. Thanks again.
Thanks for the ideas! This is good stuff to know in general.
For now I've concluded that the issue is how the networkD3 library is calculating animations on my smartphone and the bottleneck is not with Shiny.
The remote debugging concept is very cool. Unfortunately I have a PC laptop and iphone smartphone so I don't think remote debugging is an option yet for me personally. But I am sure others who come across this post will benefit from learning about that method.