6

I have been doing some work with the canvas using JavaScript and I have noticed the FPS in Chrome seems to cap out at 60fps until such point as opening the inspector up (the dev tools accessed from right clicking and clicking "Inspect Element").

If I run my own code in other browsers there is no FPS issues, likewise if I run in Chrome when the inspector tools are open there is no issue, it instantly shoots up to 120 frames per second.

As a means of showing a practical example, take a look at this page: http://mbostock.github.io/d3/talk/20111018/collision.html

If I view this page without my inspector tools open, the FPS graph shows between 40 and 60 frames per second. However, as soon as the inspector is open, the FPS instantly jumps to 120 FPS again and is visually and physically more responsive.

I'm really struggling to understand why this is and ideally would like to have my code running as if the inspector window was open. As essentially the amount of time being given for processing seems to be dropping by a substantial amount.

Is this a known limit of code being executed in a non-debugging environment?

Any insight would be much appreciated, thank you :)

  • 2
    How are you measuring FPS? Which "FPS graph" are you referring to? – user229044 Dec 09 '13 at 23:04
  • 2
    It might just be that with the inspector open the page is smaller and quicker to draw. Resizing the browser window in that example seems to have the same effect as opening the inspector. – sbking Dec 09 '13 at 23:04
  • The fps measure tool of Chrome is very expensive, it seems both to slow down display and to create quite some garbage (which cause frame miss) : do not use it, rather measure time / fillText by yourself. – GameAlchemist Dec 09 '13 at 23:06
  • Did you activate the option "Force accelerated compositing" in the dev tools? – ComFreek Dec 09 '13 at 23:08
  • @meagar - the one that you can enable within Chrome itself –  Dec 09 '13 at 23:09
  • 2
    @Cuberto - you're right, it did the same for me, after further investigation it seems as though it may be due to having two monitors setup (see my answer I posted) –  Dec 09 '13 at 23:13
  • @ComFreek - I made sure it was disabled and it still had the huge FPS increase, however as per my answer I've just posted I think it may be due to having two monitors setup. –  Dec 09 '13 at 23:14
  • if the app is visually smoother at 120 than at 60, then it's waiting on something besides frames... – dandavis Dec 09 '13 at 23:15
  • @dandavis - sorry, I should have been more clear, the visual issues are when it's dropping into the 30-40 region, the maximum it hits is 60 without the inspector tools open; when the inspector tools are open though the maximum it will hit is 120 (i.e. matching the refresh rate of the monitor) and thus the lower end is a bit higher then too. As per my answer I've posted though I think it may be a bug when running two monitors, as by disabling a monitor it removes the 60 FPS cap. –  Dec 09 '13 at 23:18

2 Answers2

1

After experimenting a bit further after reading Cuberto's findings, it seems that this may be a bug with Chrome and dual monitor setups.

As Cuberto suggested, I tried resizing my window a bit smaller, and this made the FPS shoot back up. Even if didn't have the screen maximised, but still had it spanning most of the screen it would be at max FPS.

Curiously, I disabled my second monitor and then put Chrome back into the maximised state, and it was fine.

As soon as I re-enabled my second monitor the FPS shot down again, so it would appear this is the problem.

Upd: it seems someone else has had this same problem with dual monitors (see comments): Why would Chrome cap frame rate at 30fps?

Community
  • 1
  • 1
0

This is a question of resolution. When opening the inspector in chrome, you're basically changing the resolution of the current window, which means it runs faster. That's all folks.

Valentin Roudge
  • 555
  • 4
  • 14