mozilla / lightbeam-we

Web Extension version of the Firefox Lightbeam add-on
https://addons.mozilla.org/en-GB/firefox/addon/lightbeam/
Mozilla Public License 2.0
178 stars 61 forks source link

Low framerate on visualization #232

Open kottkrig opened 6 years ago

kottkrig commented 6 years ago

I'm seeing very low framerates on my machine when looking at the visualization. It makes it very difficult to navigate inside of it.

According to the dev tools I get an average framerate of 6,65 FPS and minimum framerate of 1,66 FPS.

skarmavbild 2017-10-18 kl 11 12 13
{
  "application": {
    "name": "Firefox",
    "osVersion": "Darwin 17.0.0",
    "version": "58.0a1",
    "buildID": "20171017220415",
    "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10.13; rv:58.0) Gecko/20100101 Firefox/58.0",
    "safeMode": false,
    "updateChannel": "nightly",
    "supportURL": "https://support.mozilla.org/1/firefox/58.0a1/Darwin/sv-SE/",
    "numTotalWindows": 1,
    "numRemoteWindows": 1,
    "remoteAutoStart": true,
    "currentContentProcesses": 4,
    "maxContentProcesses": 4,
    "autoStartStatus": 1,
    "styloBuild": true,
    "styloDefault": true,
    "styloResult": true,
    "keyGoogleFound": true,
    "keyMozillaFound": true
  },
  "modifiedPreferences": {
    "accessibility.typeaheadfind.flashBar": 0,
    "browser.cache.disk.filesystem_reported": 1,
    "browser.cache.disk.smart_size.first_run": false,
    "browser.cache.frecency_experiment": 1,
    "browser.cache.disk.capacity": 358400,
    "browser.places.smartBookmarksVersion": 8,
    "browser.sessionstore.upgradeBackup.latestBuildID": "20171017220415",
    "browser.startup.homepage_override.mstone": "58.0a1",
    "browser.startup.homepage": "resource://activity-streams/data/content/activity-streams.html#/",
    "browser.startup.homepage_override.buildID": "20171017220415",
    "browser.tabs.warnOnClose": false,
    "browser.urlbar.lastSuggestionsPromptDate": 20170720,
    "browser.urlbar.timesBeforeHidingSuggestionsHint": 0,
    "browser.urlbar.usepreloadedtopurls.enabled": false,
    "browser.urlbar.maxRichResults": 12,
    "dom.push.userAgentID": "e00a25ba6b934b8a98b1fe146fb0099f",
    "dom.forms.autocomplete.formautofill": true,
    "extensions.lastAppVersion": "58.0a1",
    "font.internaluseonly.changed": false,
    "media.webrtc.debug.log_file": "/var/folders/k5/brbds4150m5f138jn_9brwv80000gn/T/WebRTC.log",
    "media.benchmark.vp9.versioncheck": 2,
    "media.gmp-widevinecdm.lastUpdate": 1504256630,
    "media.gmp-gmpopenh264.lastUpdate": 1500552591,
    "media.gmp-widevinecdm.version": "1.4.8.1008",
    "media.gmp-gmpopenh264.abi": "x86_64-gcc3",
    "media.gmp-manager.lastCheck": 1508310512,
    "media.gmp-widevinecdm.abi": "x86_64-gcc3",
    "media.gmp.storage.version.observed": 1,
    "media.benchmark.vp9.fps": 139,
    "media.gmp-gmpopenh264.version": "1.6",
    "media.gmp-manager.buildID": "20171017220415",
    "network.prefetch-next": false,
    "network.dns.disablePrefetch": true,
    "network.http.speculative-parallel-limit": 0,
    "network.predictor.cleaned-up": true,
    "network.cookie.prefsMigrated": true,
    "places.history.expiration.transient_current_max_pages": 125044,
    "places.database.lastMaintenance": 1508082595,
    "plugin.disable_full_page_plugin_for_types": "application/pdf",
    "print.printer__.print_margin_top": "0.5",
    "print.printer__.print_reversed": false,
    "print.printer__.print_footerright": "&D",
    "print.printer__.print_unwriteable_margin_bottom": 57,
    "print.printer__.print_shrink_to_fit": true,
    "print.printer__.print_oddpages": true,
    "print.printer__.print_duplex": -437918235,
    "print.printer__.print_to_file": false,
    "print.printer__.print_resolution": -437918235,
    "print.printer__.print_unwriteable_margin_top": 25,
    "print.printer__.print_orientation": 0,
    "print.printer__.print_footercenter": "",
    "print.printer__.print_margin_right": "0.5",
    "print.printer__.print_unwriteable_margin_right": 25,
    "print.printer__.print_edge_left": 0,
    "print.printer__.print_headerright": "&U",
    "print.printer__.print_edge_bottom": 0,
    "print.printer__.print_headerleft": "&T",
    "print.printer__.print_paper_width": "  8.26",
    "print.printer__.print_scaling": "  1.00",
    "print.printer__.print_margin_left": "0.5",
    "print.printer__.print_paper_size_unit": 0,
    "print.printer__.print_bgimages": false,
    "print.printer__.print_headercenter": "",
    "print.printer__.print_footerleft": "&PT",
    "print.printer__.print_edge_right": 0,
    "print.printer__.print_evenpages": true,
    "print.printer__.print_paper_height": " 11.69",
    "print.printer__.print_unwriteable_margin_left": 25,
    "print.printer__.print_page_delay": 50,
    "print.printer__.print_paper_name": "iso-a4",
    "print.printer__.print_in_color": true,
    "print.printer__.print_bgcolor": false,
    "print.printer__.print_paper_data": 0,
    "print.printer__.print_edge_top": 0,
    "print.printer__.print_margin_bottom": "0.5",
    "privacy.userContext.extension": "{0ad88674-2b41-4cfb-99e3-e206c74a0076}",
    "security.sandbox.content.tempDirSuffix": "{79b1eacf-7227-9d4d-9fe6-30081cc2793e}",
    "security.ssl.errorReporting.automatic": true,
    "services.sync.declinedEngines": "",
    "services.sync.lastPing": 1508257285,
    "services.sync.lastSync": "Wed Oct 18 2017 10:59:56 GMT+0200 (CEST)",
    "services.sync.engine.bookmarks.validation.lastTime": 1508257287,
    "services.sync.engine.addresses.available": true,
    "services.sync.engine.prefs.modified": false,
    "storage.vacuum.last.places.sqlite": 1505905001,
    "storage.vacuum.last.index": 1
  },
  "lockedPreferences": {},
  "media": {
    "currentAudioBackend": "audiounit",
    "currentMaxAudioChannels": 2,
    "currentPreferredChannelLayout": "stereo",
    "currentPreferredSampleRate": 44100,
    "audioOutputDevices": [
      {
        "name": "Inbyggda högtalare",
        "groupId": "AppleHDAEngineOutput:1F,3,0,1,1:0",
        "vendor": "Apple Inc.",
        "type": 2,
        "state": 2,
        "preferred": 15,
        "supportedFormat": 12336,
        "defaultFormat": 4096,
        "maxChannels": 2,
        "defaultRate": 44100,
        "maxRate": 96000,
        "minRate": 44100,
        "maxLatency": 4514,
        "minLatency": 432
      }
    ],
    "audioInputDevices": [
      {
        "name": "Inbyggd mikrofon",
        "groupId": "AppleHDAEngineInput:1F,3,0,1,0:1",
        "vendor": "Apple Inc.",
        "type": 1,
        "state": 2,
        "preferred": 15,
        "supportedFormat": 12336,
        "defaultFormat": 4096,
        "maxChannels": 2,
        "defaultRate": 44100,
        "maxRate": 96000,
        "minRate": 44100,
        "maxLatency": 4162,
        "minLatency": 80
      }
    ]
  },
  "javaScript": {
    "incrementalGCEnabled": true
  },
  "accessibility": {
    "isActive": false,
    "forceDisabled": 0,
    "handlerUsed": false,
    "instantiator": ""
  },
  "libraryVersions": {
    "NSPR": {
      "minVersion": "4.17",
      "version": "4.17"
    },
    "NSS": {
      "minVersion": "3.34 Beta",
      "version": "3.34 Beta"
    },
    "NSSUTIL": {
      "minVersion": "3.34 Beta",
      "version": "3.34 Beta"
    },
    "NSSSSL": {
      "minVersion": "3.34 Beta",
      "version": "3.34 Beta"
    },
    "NSSSMIME": {
      "minVersion": "3.34 Beta",
      "version": "3.34 Beta"
    }
  },
  "userJS": {
    "exists": false
  },
  "crashes": {
    "submitted": [],
    "pending": 0
  },
  "sandbox": {
    "contentSandboxLevel": 3,
    "effectiveContentSandboxLevel": 3
  },
  "graphics": {
    "numTotalWindows": 1,
    "numAcceleratedWindows": 1,
    "windowLayerManagerType": "OpenGL",
    "windowLayerManagerRemote": true,
    "windowUsingAdvancedLayers": false,
    "adapterDescription": "",
    "adapterVendorID": "0x8086",
    "adapterDeviceID": "0x1927",
    "adapterRAM": "",
    "adapterDrivers": "",
    "driverVersion": "",
    "driverDate": "",
    "offMainThreadPaintEnabled": false,
    "webgl1Renderer": "Intel Inc. -- Intel(R) Iris(TM) Graphics 550",
    "webgl1Version": "4.1 INTEL-10.28.26",
    "webgl1DriverExtensions": "GL_ARB_blend_func_extended GL_ARB_draw_buffers_blend GL_ARB_draw_indirect GL_ARB_ES2_compatibility GL_ARB_explicit_attrib_location GL_ARB_gpu_shader_fp64 GL_ARB_gpu_shader5 GL_ARB_instanced_arrays GL_ARB_internalformat_query GL_ARB_occlusion_query2 GL_ARB_sample_shading GL_ARB_sampler_objects GL_ARB_separate_shader_objects GL_ARB_shader_bit_encoding GL_ARB_shader_subroutine GL_ARB_shading_language_include GL_ARB_tessellation_shader GL_ARB_texture_buffer_object_rgb32 GL_ARB_texture_cube_map_array GL_ARB_texture_gather GL_ARB_texture_query_lod GL_ARB_texture_rgb10_a2ui GL_ARB_texture_storage GL_ARB_texture_swizzle GL_ARB_timer_query GL_ARB_transform_feedback2 GL_ARB_transform_feedback3 GL_ARB_vertex_attrib_64bit GL_ARB_vertex_type_2_10_10_10_rev GL_ARB_viewport_array GL_EXT_debug_label GL_EXT_debug_marker GL_EXT_framebuffer_multisample_blit_scaled GL_EXT_texture_compression_s3tc GL_EXT_texture_filter_anisotropic GL_EXT_texture_sRGB_decode GL_APPLE_client_storage GL_APPLE_container_object_shareable GL_APPLE_flush_render GL_APPLE_object_purgeable GL_APPLE_rgb_422 GL_APPLE_row_bytes GL_APPLE_texture_range GL_ATI_texture_mirror_once GL_NV_texture_barrier",
    "webgl1Extensions": "ANGLE_instanced_arrays EXT_blend_minmax EXT_color_buffer_half_float EXT_frag_depth EXT_sRGB EXT_shader_texture_lod EXT_texture_filter_anisotropic EXT_disjoint_timer_query OES_element_index_uint OES_standard_derivatives OES_texture_float OES_texture_float_linear OES_texture_half_float OES_texture_half_float_linear OES_vertex_array_object WEBGL_color_buffer_float WEBGL_compressed_texture_s3tc WEBGL_compressed_texture_s3tc_srgb WEBGL_debug_renderer_info WEBGL_debug_shaders WEBGL_depth_texture WEBGL_draw_buffers WEBGL_lose_context",
    "webgl1WSIInfo": "CGL",
    "webgl2Renderer": "Intel Inc. -- Intel(R) Iris(TM) Graphics 550",
    "webgl2Version": "4.1 INTEL-10.28.26",
    "webgl2DriverExtensions": "GL_ARB_blend_func_extended GL_ARB_draw_buffers_blend GL_ARB_draw_indirect GL_ARB_ES2_compatibility GL_ARB_explicit_attrib_location GL_ARB_gpu_shader_fp64 GL_ARB_gpu_shader5 GL_ARB_instanced_arrays GL_ARB_internalformat_query GL_ARB_occlusion_query2 GL_ARB_sample_shading GL_ARB_sampler_objects GL_ARB_separate_shader_objects GL_ARB_shader_bit_encoding GL_ARB_shader_subroutine GL_ARB_shading_language_include GL_ARB_tessellation_shader GL_ARB_texture_buffer_object_rgb32 GL_ARB_texture_cube_map_array GL_ARB_texture_gather GL_ARB_texture_query_lod GL_ARB_texture_rgb10_a2ui GL_ARB_texture_storage GL_ARB_texture_swizzle GL_ARB_timer_query GL_ARB_transform_feedback2 GL_ARB_transform_feedback3 GL_ARB_vertex_attrib_64bit GL_ARB_vertex_type_2_10_10_10_rev GL_ARB_viewport_array GL_EXT_debug_label GL_EXT_debug_marker GL_EXT_framebuffer_multisample_blit_scaled GL_EXT_texture_compression_s3tc GL_EXT_texture_filter_anisotropic GL_EXT_texture_sRGB_decode GL_APPLE_client_storage GL_APPLE_container_object_shareable GL_APPLE_flush_render GL_APPLE_object_purgeable GL_APPLE_rgb_422 GL_APPLE_row_bytes GL_APPLE_texture_range GL_ATI_texture_mirror_once GL_NV_texture_barrier",
    "webgl2Extensions": "EXT_color_buffer_float EXT_texture_filter_anisotropic EXT_disjoint_timer_query OES_texture_float_linear WEBGL_compressed_texture_s3tc WEBGL_compressed_texture_s3tc_srgb WEBGL_debug_renderer_info WEBGL_debug_shaders WEBGL_lose_context",
    "webgl2WSIInfo": "CGL",
    "info": {
      "AzureCanvasBackend": "skia",
      "AzureFallbackCanvasBackend": "none",
      "AzureContentBackend": "skia",
      "AzureCanvasAccelerated": 1,
      "ApzWheelInput": 1,
      "ApzDragInput": 1,
      "ApzKeyboardInput": 1,
      "ApzAutoscrollInput": 1,
      "TileHeight": 1024,
      "TileWidth": 1024
    },
    "featureLog": {
      "features": [
        {
          "name": "HW_COMPOSITING",
          "description": "Compositing",
          "status": "available",
          "log": [
            {
              "type": "default",
              "status": "available"
            }
          ]
        },
        {
          "name": "OPENGL_COMPOSITING",
          "description": "OpenGL Compositing",
          "status": "available",
          "log": [
            {
              "type": "default",
              "status": "available"
            }
          ]
        },
        {
          "name": "WEBRENDER",
          "description": "WebRender",
          "status": "opt-in",
          "log": [
            {
              "type": "default",
              "status": "opt-in",
              "message": "WebRender is an opt-in feature"
            }
          ]
        },
        {
          "name": "OMTP",
          "description": "Off Main Thread Painting",
          "status": "blocked",
          "log": [
            {
              "type": "default",
              "status": "disabled",
              "message": "Disabled by default"
            },
            {
              "type": "runtime",
              "status": "blocked",
              "message": "OMTP does not yet support tiling"
            }
          ]
        }
      ],
      "fallbacks": []
    },
    "crashGuards": []
  },
  "experiments": [],
  "extensions": [
    {
      "name": "1Password Beta",
      "version": "4.6.12.2",
      "isActive": true,
      "id": "onepassword4@agilebits.com"
    },
    {
      "name": "Firefox Lightbeam",
      "version": "2.0.4",
      "isActive": true,
      "id": "jid1-F9UJ2thwoAm5gQ@jetpack"
    },
    {
      "name": "Instapaper",
      "version": "1.0.2",
      "isActive": true,
      "id": "{d0210f13-a970-4f1e-8322-0f76ec80adde}"
    },
    {
      "name": "Min Vid",
      "version": "0.4.5",
      "isActive": true,
      "id": "@min-vid"
    },
    {
      "name": "Multi-Account Containers",
      "version": "4.0.3",
      "isActive": true,
      "id": "@testpilot-containers"
    },
    {
      "name": "Pinboard+",
      "version": "1.0.2",
      "isActive": true,
      "id": "pinboard-plus@lsproc.com"
    },
    {
      "name": "snoozetabs",
      "version": "1.0.19",
      "isActive": true,
      "id": "snoozetabs@mozilla.com"
    },
    {
      "name": "Tab Center Redux",
      "version": "0.4.2",
      "isActive": true,
      "id": "{0ad88674-2b41-4cfb-99e3-e206c74a0076}"
    },
    {
      "name": "Test Pilot",
      "version": "2.0.4-dev-18ce799",
      "isActive": true,
      "id": "@testpilot-addon"
    },
    {
      "name": "Tree Tabs",
      "version": "0.0.16",
      "isActive": true,
      "id": "TreeTabs@jagiello.it"
    },
    {
      "name": "uBlock Origin",
      "version": "1.14.15b1",
      "isActive": false,
      "id": "uBlock0@raymondhill.net"
    }
  ],
  "features": [
    {
      "name": "Activity Stream",
      "version": "2017.10.13.1281-6245c446",
      "id": "activity-stream@mozilla.org"
    },
    {
      "name": "Application Update Service Helper",
      "version": "2.0",
      "id": "aushelper@mozilla.org"
    },
    {
      "name": "Firefox Screenshots",
      "version": "19.2.0",
      "id": "screenshots@mozilla.org"
    },
    {
      "name": "FlyWeb",
      "version": "1.0.0",
      "id": "flyweb@mozilla.org"
    },
    {
      "name": "Follow-on Search Telemetry",
      "version": "0.9.5",
      "id": "followonsearch@mozilla.com"
    },
    {
      "name": "Form Autofill",
      "version": "1.0",
      "id": "formautofill@mozilla.org"
    },
    {
      "name": "Multi-process staged rollout",
      "version": "3.05",
      "id": "e10srollout@mozilla.org"
    },
    {
      "name": "Photon onboarding",
      "version": "0.1",
      "id": "onboarding@mozilla.org"
    },
    {
      "name": "Pocket",
      "version": "1.0.5",
      "id": "firefox@getpocket.com"
    },
    {
      "name": "Presentation",
      "version": "1.0.0",
      "id": "presentation@mozilla.org"
    },
    {
      "name": "Shield Recipe Client",
      "version": "76",
      "id": "shield-recipe-client@mozilla.org"
    },
    {
      "name": "Web Compat",
      "version": "1.1",
      "id": "webcompat@mozilla.org"
    },
    {
      "name": "WebCompat Reporter",
      "version": "1.0.0",
      "id": "webcompat-reporter@mozilla.org"
    }
  ]
}
jonathanKingston commented 6 years ago

So it looks like the worst comes from when dragging a node: https://github.com/mozilla/lightbeam-we/blob/master/src/js/viz.js#L375

I see in some cases requestAnimationFrame even on a powerful machine take +150ms

I think there are a few things we could do here:

princiya commented 6 years ago

Thanks @kottkrig for reporting the issue.

@jonathanKingston yes there is scope to improve, looking into it.

jonathanKingston commented 6 years ago

I managed to get the graph vastly faster by removing the manual ticking without causing obvious bugs.

My hunch is we should be doing something smarter there with ticking and rate limiting at times of stress. I also couldn't work out what the alpha stuff was doing and the documentation isn't super clear.

jonathanKingston commented 6 years ago

I think we might have just made this worse with the latest update. We should look into querying the history in chunks before rendering to reduce the time to showing some nodes on the graph. The latest update actually crashed my browser @princiya. I don't have time at the moment to debug this though so help very much wanted here.