Demangle C++ symbols (#2)

This adds support for demangling C++ symbols automatically (they'll have a name prefix of `__Z`).

application.tsx

@@ -206,7 +206,7 @@ export class Application extends ReloadableComponent<{}, ApplicationState> {
     }
   }
 
-  loadFromString(fileName: string, contents: string) {
+  async loadFromString(fileName: string, contents: string) {
     if (!this.canvasContext) return
 
     console.time('import')
@@ -218,6 +218,8 @@ export class Application extends ReloadableComponent<{}, ApplicationState> {
       return
     }
 
+    await profile.demangle()
+
     profile.setName(fileName)
     document.title = `${fileName} - speedscope`
 

package.json

@@ -4,7 +4,7 @@
   "description": "",
   "main": "index.js",
   "scripts": {
-    "serve": "parcel dev.html --open --no-autoinstall",
+    "serve": "parcel index.html --open --no-autoinstall",
     "release": "./release.sh"
   },
   "browserslist": [

profile.ts

@@ -1,4 +1,8 @@
 import { lastOf, getOrInsert } from './utils'
+const demangleCppModule = import('./demangle-cpp')
+
+// Force eager loading of the module
+demangleCppModule.then(() => console.log('CPP demangler loaded'))
 
 export interface FrameInfo {
   key: string | number
@@ -337,6 +341,7 @@ export class Profile {
       this.groupedOrderStack.pop()
     }
   }
+
   leaveFrame(frameInfo: FrameInfo, value: number) {
     const frame = getOrInsert(this.frames, frameInfo.key, () => new Frame(frameInfo))
     this.addWeightsToFrames(value)
@@ -354,4 +359,20 @@ export class Profile {
     }
     this.lastValue = value
   }
-}
+
+  // Demangle symbols for readability
+  async demangle() {
+    let demangleCpp: ((name: string) => string) | null = null
+
+    for (let frame of this.frames.values()) {
+      // This function converts a mangled C++ name such as "__ZNK7Support6ColorFeqERKS0_"
+      // into a human-readable symbol (in this case "Support::ColorF::==(Support::ColorF&)")
+      if (frame.name.startsWith('__Z')) {
+        if (!demangleCpp) {
+          demangleCpp = (await demangleCppModule).demangleCpp
+        }
+        frame.name = demangleCpp(frame.name)
+      }
+    }
+  }
+}

tsconfig.json

@@ -1,6 +1,6 @@
 {
   "compilerOptions": {
-    "module": "commonjs",
+    "module": "es2015",
     "strict": true,
     "jsx": "react",
     "noUnusedLocals": true,