phetsims / circuit-construction-kit-common

"Circuit Construction Kit: Basics" is an educational simulation in HTML5, by PhET Interactive Simulations.
GNU General Public License v3.0
10 stars 10 forks source link

Animation speed optical illusions? #516

Open BryceAG opened 6 years ago

BryceAG commented 6 years ago

With the circuit below, the electrons move at a speed where some optical illusions can happen. In windows 7, chrome, it looks like the electrons go only towards the positive end of the battery (circled, following arrows), so all charges head to one point and kirchoff's current law is broken. With conventional current it looks like some of the arrows travel backwards. In Firefox the same issue occasionally happens, but more often it just looks like the charge jumps back and forth in relatively the same area. Only the part of the circuit before it splits onto parallel circuits is affected. Profiler is used to show that frame rate is still optimal.

image

Whenever I try to record it, the recording itself fixes the optical illusion, and the gif made would show a lower frame rate anyway. The optical illusion is not permanent as the speed will fix itself every now and then, but it is frequent.

This appears to happen only on Bates and may be hardware specific as it is not reproducing on other computers, but this is very pedagogically misleading to anyone who might see it on their computer. Assigning to @phet-steele to determine if worth looking into

BryceAG commented 6 years ago

Related to phetsims/QA#51 tested on phettest

phet-steele commented 6 years ago

Won't happen on my device, will have to try Bates. I wonder if you're seeing phetsims/circuit-construction-kit-dc#129 on steroids?

phet-steele commented 6 years ago

Easily done on Bates, the electrons are very obviously moving the wrong way. If you start moving your mouse around, they begin to move the correct way though. Most likely this is due to a slight dip in performance while the cursor is hit-testing.

Anyway, I showed @samreid and @ariel-phet this and the leading theory is that the speed throttle is not doing its job well. Assigning to @samreid to decide where to go with this, and if this should be wrapped into phetsims/circuit-construction-kit-dc#129 as an extreme case. This is a good one @BryceAG, thanks!

samreid commented 6 years ago

I tried to set up the same circuit on my mac chrome and saw 2 differences: my battery and resistor are on fire and I get 96% instead of 97%. The electrons are going in the correct directions (no strobe effect).

image

I'll try a windows machine.

samreid commented 6 years ago

Even with 6x Chrome CPU throttling combined with phet.joist.makeEverythingSlow() the electron directions and relative speeds are still correct on Mac Chrome.

samreid commented 6 years ago

It took about 15 minutes to set up this circuit in Mac running Virtual Box running Windows 10 running Chrome, but I as able to capture a screencast of the stobing behavior. Over 1.5MB so may take a moment to load: cast-vbox-loop

UPDATE: GIF is looping now

samreid commented 6 years ago

In https://github.com/phetsims/circuit-construction-kit-dc/issues/15 we found that linking the animation speed reduction to the system clock was causing fluctuations and differing behavior across platforms. In https://github.com/phetsims/circuit-construction-kit-common/commit/4e3f1b55f7903a0781979c94e60f6d8ea766e65d we changed from a machine-specific estimation of clock timing to assume that machines would get at least 30 frames per second. Combinations of circuits and machines that get less than 30 frames per second will still be able to strobe. I do not understand why the issue description shows strobing and 60fps.

samreid commented 6 years ago

I tried reverting https://github.com/phetsims/circuit-construction-kit-common/commit/4e3f1b55f7903a0781979c94e60f6d8ea766e65d and ran the same circuit in virtual box. The "animation speed limit reached" message is not shown and the strobing behavior is still bad.

samreid commented 6 years ago

dt is being capped to 1/30 anyways, so this prevents us from using the true machine dts in the downstream code:

    step: function( dt ) {

      if ( this.charges.length === 0 || this.circuit.circuitElements.length === 0 ) {
        return;
      }

      // dt would ideally be around 16.666ms = 0.0166 sec.  Cap it to avoid too large of an integration step.
      dt = Math.min( dt, MAX_DT );

      // Find the fastest current in any circuit element
      var maxCurrentMagnitude = CURRENT_MAGNITUDE( _.maxBy( this.circuit.circuitElements.getArray(), CURRENT_MAGNITUDE ) );
      assert && assert( maxCurrentMagnitude >= 0, 'max current should be positive' );

      var maxSpeed = maxCurrentMagnitude * SPEED_SCALE;
      var maxPositionChange = maxSpeed * dt; // Use the max dt instead of the true dt to avoid fluctuations

      // Slow down the simulation if the fastest step distance exceeds the maximum allowed step
      this.scale = (maxPositionChange >= MAX_POSITION_CHANGE) ? (MAX_POSITION_CHANGE / maxPositionChange) : 1;

According to the docs, we are capping it to avoid too large of an integration step. Maybe this is important so that an electron doesn't try to go across many circuit elements in a single step?

samreid commented 6 years ago

I tried changing the MAX_DT from 1/30 to 1 and recorded the circuit in virtual box.

loop2

NOTE: the stutter is from the GIF looping, not from the sim. However, the max dt is used like so:

      var maxPositionChange = maxSpeed * MAX_DT; // Use the max dt instead of the true dt to avoid fluctuations

      // Slow down the simulation if the fastest step distance exceeds the maximum allowed step
      this.scale = (maxPositionChange >= MAX_POSITION_CHANGE) ? (MAX_POSITION_CHANGE / maxPositionChange) : 1;

And hence this will change the speed threshold for every platform, I'm not sure the impact this will have in other situations.

samreid commented 6 years ago

The effect is that everything is throttled--creating a default battery + default bulb throttles to 54% and everything looks slow.

image

samreid commented 6 years ago

I tried eliminating the dt cap and using the former code

var maxPositionChange = maxSpeed * dt; // Use the max dt instead of the true dt to avoid fluctuations

I also reduced the MAX_POSITION_CHANGE like so:

var MAX_POSITION_CHANGE = CCKCConstants.CHARGE_SEPARATION * 0.2;

This looked great and throttled perfectly on mac/chrome (aside from fluctuations in the exact speed reduction value). But when I tried this on virtualbox/win10/chrome I saw this:

loop4

@ariel-phet I'm not sure how to proceed. Do you want to ask if the reviewer @jonathanolson can help investigate?

phet-steele commented 6 years ago

I tried to set up the same circuit on my mac chrome and saw 2 differences: my battery and resistor are on fire and I get 96% instead of 97%.

I don't know how important it is now that you have investigated this quite a bit, but turn wire resistivity to max to get 97%.

ariel-phet commented 6 years ago

@samreid might be good to first verify on an actual windows chrome set-up, not the virtual machine (just in case. Maybe publish a dev version so @phet-steele and I can try?

samreid commented 6 years ago

@ariel-phet to clarify, are you requesting a dev version with the changes described in https://github.com/phetsims/circuit-construction-kit-dc/issues/164#issuecomment-334942997 ?

samreid commented 6 years ago

I tested the original behavior on my Windows 10 laptop running Chrome 61.0.3163.100 and there is no strobing.

samreid commented 6 years ago

I do not understand the mechanism of what is causing this problem. I tried a variety of CPU throttling and phet.joist.makeEverythingSlow and makeRandomSlowness and couldn't simulate the behavior on my Mac. I wonder if Win/Chrome is sometimes dropping frame display updates, that might explain it?

samreid commented 6 years ago

@ariel-phet suggested working on this with @jonathanolson

samreid commented 6 years ago

@jonathanolson and I reviewed it and agreed the given algorithm seems to be logically correct and it is unclear why it is misbehaving on Win/Chrome machines. To simulate the problem on Mac, @jonathanolson suggested putting dt = MAX_DT and this did a good job of showing uneven and strobing behavior. We tried reducing the strobe threshold from 0.43 to 0.15 and it worked much better when MAX_DT, however at dt around 1/60 it throttles much too eagerly.

samreid commented 6 years ago

Testing with a dynamic dt for scaling instead of MAX_DT and 0.25 instead of 0.43 looked great on Mac (even when simulating dt=MAX_DT), but still showed the same bad behavior on Win as in https://github.com/phetsims/circuit-construction-kit-dc/issues/164#issuecomment-334942997

@ariel-phet it would be good to check in with you. Can you reproduce this problem on your hardware with the latest dev version?

ariel-phet commented 6 years ago

I see no strobing on my Win 10 or Win 7 chrome. My Win 10 machine is pretty speedy. My Win 7 is a desktop but at least 5 years old.

samreid commented 6 years ago

@ariel-phet do you want me and @jonathanolson to spend any more time on this before 1.0?

ariel-phet commented 6 years ago

@samreid I think you can defer, since it appears machine specific and not a general issue on chrome. However, lets have QA first verify that it does not happen on chromebook.

@phet-steele can you check latest dev on chromebook and verify no strobing is seen?

phet-steele commented 6 years ago

@phet-steele can you check latest dev on chromebook and verify no strobing is seen?

I tried all of the chromebooks in the office and none had the extreme strobing herein.

ariel-phet commented 6 years ago

@samreid just assigning to you to note that we are deferring

samreid commented 6 years ago

Duly noted.