Toggle fullscreen

Electrolysis (e10s) for Firefox Hackers

45 minutes is not enough, but please ask questions now or after

The big picture

• Separate rendering and processing of web content from the main browser process.
  • Crash a tab, not the browser (not so great with just the one content process...)
• Do not let the web content process block the main process (with caveats).
• Eventually, sandbox the web content process.

Terminology

I will likely interchange the following without noticing, purely out of habit (sorry).

• "content process", "child process", "child"
• "browser process", "chrome process", "parent process", "parent"

"IPC" stands for "inter-process communication".

A "remote browser" is a <xul:browser> with the remote="true" attribute.

A "frame script" is a script that can be sent to a child process to hear and respond to messages

Things browser hackers need to know

Message managers

There are several types, and different types are available depending on which process you're in.

Check out the documentation for message managers on MDN and the documentation in nsIMessageManager.idl for a low-level breakdown.

The one you're most likely to work with is the "browser" message manager.

        let browser = gBrowser.selectedBrowser;
        let mm = browser.messageManager;
        //  ^-- Available even if <xul:browser> is not remote!

        mm.sendAsyncMessage("Foo", {
          bar: "baz", // JSON serializable stuff and nsIPrincipal's can go in here.
        });

        mm.addMessageListener("Done", (message) => {
          dump("Child sent done.");
        });

        -- snip --

        // Inside some frame script:
        addMessageListener("Foo", (message) => {
          dump("Parent said: " + message.data.bar + "\n");
          sendAsyncMessage("Done"); // Could also use sendSyncMessage("Done");
        });

If the chrome needs to touch content...

• Send a message to a frame script to do the dirty work.
• This has to be async - the parent has no access to sendSyncMessage.
• Message name example: PopupBlocking:UnblockPopup.

If content needs to talk to chrome, send a message to the parent from a frame script.

• Events used to bubble up to browser.js. This assumption is no longer safe.
• Frame scripts have access to a number of things in their global scope. Check out this MDN article on the frame script environment.
• You have some access to Components/XPCOM here - but anything that touches the disk or tries to do things with UI is ill-advised, though there are exceptions.
• Frame scripts can import JSM's too.

Loading frame scripts

        let browser = gBrowser.selectedBrowser;
        let mm = browser.messageManager;
        mm.loadFrameScript("chrome://browser/content/foo.js", false);
        // Set second arg to true if we want to load this once remote browser
        // is ready / available. Otherwise, script will only load if remote
        // browser is ready / available.
      

Important pre-existing frame scripts

Loaded in all <xul:browser>'s, remote or not:

• browser/base/content/content.js (for Firefox-specific things)
• toolkit/content/browser-content.js

Loaded just in remote <xul:browser>'s:

• toolkit/content/browser-child.js

Bi-directional CPOWs

• CPOW -> "Cross Process Object Wrapper", sometimes pronounced "SEE-pows"
• A crutch to get add-ons and some browser code to work cross-process.
• Allows us to synchronously access / manipulate anything that can be represented as a JS object.
• Example:

              let doc = gBrowser.selectedBrowser.contentDocumentAsCPOW;
              let el = doc.getElementById("someElementInContent");
              if (el.hasAttribute("foo")) {
                el.setAttribute("bar", "baz");
              }
            

• Can result in much IPC traffic = slow, blocks main process
• Can result in dead-locks
• Can result in crashes if passed to native code
• Can unexpectedly die

• Components.utils.isCrossProcessWrapper(thing);

• If you can avoid a CPOW without too much hassle, do it.

Intentionally sending a CPOW

Sometimes, a CPOW is just the best way forward.

        // Some frame script
        addEventListener("click", (event) => {
          sendAsyncMessage("Foo:Click", null, {
            target: event.target,
          });
        });
      

        -- snip --

        // Parent process script
        let mm = gBrowser.selectedBrowser.messageManager;
        mm.addMessageListener("Foo:Click", (message) => {
          dump("I got the item with ID: " + message.objects.target.id);
        });
      

Some anti-patterns with CPOWs

Lots of CPOW traffic - use a frame script instead.

        let doc = gBrowser.selectedBrowser.contentDocumentAsCPOW;
        let anchors = doc.querySelectorAll("a");
        for (let anchor of anchors) {
          if (anchor.href.startsWith("https://")) {
            el.classList.add("ssl");
          }
        }
      

Just focus the browser element

        let win = gBrowser.selectedBrowser.contentWindowAsCPOW;
        win.focus();
      

This is likely going to explode in interesting ways.

        let win = gBrowser.selectedBrowser.contentWindowAsCPOW;
        let docShell = win.QueryInterface(Ci.nsIInterfaceRequestor)
                          .getInterface(Ci.nsIWebNavigation)
                          .QueryInterface(Ci.nsIDocShell);

        let svc = Cc["@mozilla.org/someservice;1"].getService(Ci.nsISomeService);
        svc.someMethod(docShell);
      

A few words on add-on shimming

• Get contentWindow and contentDocument without needing the AsCPOW suffix
• We can interpose fancy things for add-ons in place of various services or components - example: nsIObserverService.
• Check out toolkit/components/addoncompat for the nitty gritty.
• We're starting to measure CPOW traffic for add-ons.
• We're starting to do pre-fetching and other optimizations in these shims.

Questions!

Thanks!

• Fork mah slides github.com/mikeconley/e10s-MM-CPOW-talk
• Check out my e10s bugnotes people.mozilla.org/~mconley2/bugnotes
• Twitter: @mike_conley
• Blog: mikeconley.ca