Don't attempt to connect to React devtools every 2s

Summary:
When testing out the NetworkOverlay, I noticed that we were creating a lot of WebSocket connections for localhost:8097. Rick found that this is because we're trying to connect to React devtools every 2 seconds: https://github.com/facebook/react/blob/master/packages/react-devtools-core/src/backend.js#L67 and it appears we create a new WebSocket every time.

Dan suggested that we use opening the dev menu as a trigger for attempting to connect to React devtools. This diff uses RCTNativeAppEventEmitter to emit an event from native when the dev menu/dialog is shown, and listening to that event in JS to attempt to connect to devtools.

I'm also making the change of passing in a websocket instead of just passing in the host + port; this way it will only attempt to connect once on each call to `connectToDevTools` (otherwise, we would attempt to reconnect every 2 seconds as soon as the dev menu is opened, and then the next time the menu is opened we'd so start that *again*, and so on - I could have it keep track of whether it's already connecting and avoid doing it again, but this is easier and should be sufficient, I think).

We should probably also update the suggested troubleshooting tips on the devtools page to reflect this change, so that people don't get confused.

Changelog: [General] [Fixed] Fix issue where we attempt to connect to React devtools every 2 seconds

Reviewed By: mmmulani

Differential Revision: D17919808

fbshipit-source-id: 4658d995c274574d22f2f54ea06d7f29ef2f54dc
This commit is contained in:
Emily Janzer
2019-10-23 10:30:43 -07:00
committed by Facebook Github Bot
parent c7ed3981ee
commit e7f6210d5d
4 changed files with 70 additions and 34 deletions
@@ -47,6 +47,7 @@ import com.facebook.react.devsupport.interfaces.DevSupportManager;
import com.facebook.react.devsupport.interfaces.ErrorCustomizer;
import com.facebook.react.devsupport.interfaces.PackagerStatusCallback;
import com.facebook.react.devsupport.interfaces.StackFrame;
import com.facebook.react.modules.core.RCTNativeAppEventEmitter;
import com.facebook.react.modules.debug.interfaces.DeveloperSettings;
import com.facebook.react.packagerconnection.RequestHandler;
import com.facebook.react.packagerconnection.Responder;
@@ -621,6 +622,9 @@ public class DevSupportManagerImpl
})
.create();
mDevOptionsDialog.show();
if (mCurrentContext != null) {
mCurrentContext.getJSModule(RCTNativeAppEventEmitter.class).emit("RCTDevMenuShown", null);
}
}
/** Starts of stops the sampling profiler */