Troubleshooting client side UI responsiveness


#1

Hi all,

Could someone point me in the right direction on how best to find out what parts of my client-side code could be slowing UI responsiveness? I’ve ruled out server-side/DDP factors and believe the bad performance is due to unnecessary re-renders and expensive, reactively triggered, data processing functions.

I’ve tried using kadira:debug@3.2.2 for it’s client side CPU usage functionality but cannot see the Client Activities section anywhere?! I’ve also tried using the CPU profiler functionality which works but doesn’t really point me to what exactly is causing high CPU utilisation.

Any help would be greatly appreciated! Thanks in advance!

Max


#2

@maxfi I have same kind of issue. I wondered how you debugged / solved it.
I’m using Blaze and the CPU is super idle and RAM is ok (no swap) so I wonder what is happening?
To all Meteor developer, are there some guides to profile front end Meteor apps.

Thanks


#3

Unfortunately I never found an elegant way to debug UI responsiveness. :unamused:
To improve the performance of my app I basically ended up doing trial and error testing by removing components and seeing how that affected responsiveness. I also did a lot of research into the low level workings of Blaze and Tracker to get a better understanding of what could be slowing down my app.

Regarding your situation, if the CPU and memory utilisation in your browser is low then it’s possible that the responsiveness is due to something on the server-side; e.g. blocking methods, subscriptions, DDP, etc…


#4

I’ve found the profiling tool in Chrome to be pretty useful … worth learning how to get the best of its goodness (assuming you’ve got CPU over usage).


#5

^ What @dthwaite said. It’s worth learning to use these. Some profiling will usually pin-point the cause for you.