3

I am developing a complex web application, which is working fine on Chrome and IE, but recently has developed huge performance issues on Firefox which lead us to block it's usage completely to avoid a poor UX while the problem isn't solved.

Below is a screenshot of the Firefox profiler: enter image description here The file is available here for deeper inspection (2MB JSON)

As I can understand from this, it seems that Firefox is taking a tremendous amount of time recalculating the layout, which seems to happen on each user interaction with the application.

But how do I interpret all this data? How can this help me trace the origin of the problem and remove all of these layout recalculation?

Bruno Finger
  • 139
  • 3
  • What is causing the layout to recalculate? Are you adding new CSS, JS, or iframes to the site dynamically? – TZHX Sep 28 '16 at 12:19
  • This looks like Firefox Developer Edition. Have you tried it on a stable version of Firefox? – topher Sep 28 '16 at 12:26
  • 1
    You should add which technology you use for your UX. I already had some trouble with Firefox with AngularJS, not related to performance though. – Walfrat Sep 28 '16 at 12:32
  • please don't **[cross-post](http://meta.stackexchange.com/tags/cross-posting/info "'Cross-posting is frowned upon...'")**: http://stackoverflow.com/questions/39746582/how-to-determine-the-reason-why-firefox-has-poor-performance-on-my-web-applicati "Cross-posting is frowned upon as it leads to fragmented answers splattered all over the network..." – gnat Sep 28 '16 at 12:46
  • Check your css selectors. Take them out untill you find the one that runs slow – Ewan Sep 28 '16 at 13:58
  • What is the function that setInterval keeps calling? – Erik Eidt Sep 28 '16 at 14:14
  • @TZHX That's exactly what I'm trying to find out. No I'm not adding anything dynamically, not after the application completes loading at least. – Bruno Finger Sep 28 '16 at 14:54
  • @topher That's the standard Firefox from Ubuntu repositories, with a dark theme. I also tried the nightly builds, same problem. – Bruno Finger Sep 28 '16 at 14:55
  • @gnat I'm sorry. Won't repeat. Unfortunately, we also have different experts fragmented all over the network too. – Bruno Finger Sep 28 '16 at 14:56
  • @ErikEidt Somewhere in the interface there's a clock, `setInterval` calls a function every 1000ms to update this clock. – Bruno Finger Sep 28 '16 at 14:57
  • Ok, so your concern is not the accumulated Layout time in the above graphic, but each individual one? – Erik Eidt Sep 28 '16 at 15:16
  • @ErikEidt My concern is why this page is so unresponsive compared to the rest of the system. It seems that the sum of the individual layout time is causing this, and I believe it happens for one root cause being triggered multiple times. The question here is that I can't find a way to use this data Firefox collected to help me find where the problem is... – Bruno Finger Sep 29 '16 at 09:28
  • long shot, but can you add some `console.timeStamp()` to the clock code (entry/exit). The idea is to see if the layouts are happening during/within that javascript or not. – Erik Eidt Sep 29 '16 at 14:23

0 Answers0