Re-add throttling with a source queue (#4948)

src/actions/navigation.js

@@ -3,6 +3,7 @@
  * file, You can obtain one at <http://mozilla.org/MPL/2.0/>. */
 
 import { clearDocuments } from "../utils/editor";
+import sourceQueue from "../utils/source-queue";
 import { getSources } from "../reducers/sources";
 import { waitForMs } from "../utils/utils";
 import { newSources } from "./sources";
@@ -32,6 +33,7 @@ export function willNavigate(_, event) {
     clearASTs();
     clearScopes();
     clearSources();
+    sourceQueue.clear();
 
     dispatch(navigate(event.url));
   };

src/actions/sources.js

@@ -114,8 +114,19 @@ export function newSources(sources: Source[]) {
       source => !getSource(getState(), source.id)
     );
 
+    if (filteredSources.length == 0) {
+      return;
+    }
+
+    dispatch({
+      type: "ADD_SOURCES",
+      sources: filteredSources
+    });
+
     for (const source of filteredSources) {
-      dispatch(newSource(source));
+      dispatch(loadSourceMap(source));
+      dispatch(checkSelectedSource(source));
+      dispatch(checkPendingBreakpoints(source.id));
     }
   };
 }
@@ -142,6 +153,7 @@ function createOriginalSource(
 function loadSourceMap(generatedSource) {
   return async function({ dispatch, getState, sourceMaps }: ThunkArgs) {
     const urls = await sourceMaps.getOriginalURLs(generatedSource);
+
     if (!urls) {
       // If this source doesn't have a sourcemap, do nothing.
       return;

src/client/firefox/events.js

@@ -13,6 +13,7 @@ import type {
 } from "./types";
 
 import { createPause, createSource } from "./create";
+import sourceQueue from "../../utils/source-queue";
 import { isEnabled } from "devtools-config";
 
 const CALL_STACK_PAGE_SIZE = 1000;
@@ -31,6 +32,7 @@ function setupEvents(dependencies: Dependencies) {
   threadClient = dependencies.threadClient;
   actions = dependencies.actions;
   supportsWasm = dependencies.supportsWasm;
+  sourceQueue.initialize({ actions, supportsWasm, createSource });
 
   if (threadClient) {
     Object.keys(clientEvents).forEach(eventName => {
@@ -53,6 +55,7 @@ async function paused(_: "paused", packet: PausedPacket) {
 
   if (why.type != "alreadyPaused") {
     const pause = createPause(packet, response);
+    sourceQueue.flush();
     actions.paused(pause);
   }
 }
@@ -62,7 +65,7 @@ function resumed(_: "resumed", packet: ResumedPacket) {
 }
 
 function newSource(_: "newSource", { source }: SourcePacket) {
-  actions.newSource(createSource(source, { supportsWasm }));
+  sourceQueue.queue(source);
 
   if (isEnabled("eventListeners")) {
     actions.fetchEventListeners();

src/client/firefox/types.js

@@ -221,7 +221,7 @@ export type ListTabsResponse = {
 export type Actions = {
   paused: Pause => void,
   resumed: ResumedPacket => void,
-  newSource: Source => void,
+  newSources: (Source[]) => void,
   fetchEventListeners: () => void
 };
 

src/main.js

@@ -12,6 +12,7 @@ import { isFirefoxPanel } from "devtools-config";
 
 import { onConnect } from "./client";
 import { teardownWorkers } from "./utils/bootstrap";
+import sourceQueue from "./utils/source-queue";
 
 if (process.env.NODE_ENV !== "production") {
   window.Perf = require("react-addons-perf");
@@ -43,6 +44,7 @@ if (isFirefoxPanel()) {
     },
     destroy: () => {
       unmountRoot(ReactDOM);
+      sourceQueue.clear();
       teardownWorkers();
     }
   };

src/reducers/sources.js

@@ -55,16 +55,14 @@ function update(
 
   switch (action.type) {
     case "ADD_SOURCE": {
-      const source = action.source;
-      return updateSource(state, source);
+      return updateSource(state, action.source);
     }
 
     case "ADD_SOURCES": {
-      action.sources.forEach(source => {
-        state = state.mergeIn(["sources", source.id], source);
-      });
-
-      return state;
+      return action.sources.reduce(
+        (newState, source) => updateSource(newState, source),
+        state
+      );
     }
 
     case "SELECT_SOURCE":

src/utils/source-queue.js

@@ -0,0 +1,33 @@
+import { throttle } from "lodash";
+
+let newSources;
+let createSource;
+let queuedSources;
+let supportsWasm = false;
+
+const queue = throttle(() => {
+  if (!newSources || !createSource) {
+    return;
+  }
+  newSources(
+    queuedSources.map(source => {
+      return createSource(source, { supportsWasm });
+    })
+  );
+  queuedSources = [];
+}, 100);
+
+export default {
+  initialize: options => {
+    newSources = options.actions.newSources;
+    createSource = options.createSource;
+    supportsWasm = options.supportsWasm;
+    queuedSources = [];
+  },
+  queue: source => {
+    queuedSources.push(source);
+    queue();
+  },
+  flush: () => queue.flush(),
+  clear: () => queue.cancel()
+};