Changeset 179701 in webkit


Ignore:
Timestamp:
Feb 5, 2015 12:12:38 PM (9 years ago)
Author:
Brian Burg
Message:

Web Inspector: eliminate some unnecessary layout/painting in timeline overview and ruler
​https://bugs.webkit.org/show_bug.cgi?id=141293

Reviewed by Timothy Hatcher.

The timeline overview's ruler was forcing repaints of divider labels even if the labels
had not changed since the last requestAnimationFrame. Bail out early if nothing changed.

The timeline overview and its graphs were updating layout using requestAnimationFrame
even when the TimelineContentView is not visible. Fix this by propagating visibility
changes to subviews, and not updating layout when hidden.

The above change also fixes an assertion sometimes encountered when the timeline view
tries to cache an element's offset width, but cannot because it isn't visible.

  • UserInterface/Views/TimelineContentView.js:

(WebInspector.TimelineContentView.prototype.shown):
(WebInspector.TimelineContentView.prototype.hidden):

  • UserInterface/Views/TimelineOverview.js:

(WebInspector.TimelineOverview.prototype.get visible):
(WebInspector.TimelineOverview.prototype.shown):
(WebInspector.TimelineOverview.prototype.hidden):
(WebInspector.TimelineOverview.prototype._needsLayout):

  • UserInterface/Views/TimelineOverviewGraph.js:

(WebInspector.TimelineOverviewGraph.prototype.get visible):
(WebInspector.TimelineOverviewGraph.prototype.shown):
(WebInspector.TimelineOverviewGraph.prototype.hidden):
(WebInspector.TimelineOverviewGraph.prototype.needsLayout):

  • UserInterface/Views/TimelineRuler.js:

(WebInspector.TimelineRuler.prototype.updateLayout):

Location:
trunk/Source/WebInspectorUI
Files:
5 edited

Legend:

Unmodified
Added
Removed

  • trunk/Source/WebInspectorUI/ChangeLog

    r179659 r179701  
     12015-02-05  Brian J. Burg  <burg@cs.washington.edu>
     2
     3        Web Inspector: eliminate some unnecessary layout/painting in timeline overview and ruler
     4        https://bugs.webkit.org/show_bug.cgi?id=141293
     5
     6        Reviewed by Timothy Hatcher.
     7
     8        The timeline overview's ruler was forcing repaints of divider labels even if the labels
     9        had not changed since the last requestAnimationFrame. Bail out early if nothing changed.
     10
     11        The timeline overview and its graphs were updating layout using requestAnimationFrame
     12        even when the TimelineContentView is not visible. Fix this by propagating visibility
     13        changes to subviews, and not updating layout when hidden.
     14
     15        The above change also fixes an assertion sometimes encountered when the timeline view
     16        tries to cache an element's offset width, but cannot because it isn't visible.
     17
     18        * UserInterface/Views/TimelineContentView.js:
     19        (WebInspector.TimelineContentView.prototype.shown):
     20        (WebInspector.TimelineContentView.prototype.hidden):
     21        * UserInterface/Views/TimelineOverview.js:
     22        (WebInspector.TimelineOverview.prototype.get visible):
     23        (WebInspector.TimelineOverview.prototype.shown):
     24        (WebInspector.TimelineOverview.prototype.hidden):
     25        (WebInspector.TimelineOverview.prototype._needsLayout):
     26        * UserInterface/Views/TimelineOverviewGraph.js:
     27        (WebInspector.TimelineOverviewGraph.prototype.get visible):
     28        (WebInspector.TimelineOverviewGraph.prototype.shown):
     29        (WebInspector.TimelineOverviewGraph.prototype.hidden):
     30        (WebInspector.TimelineOverviewGraph.prototype.needsLayout):
     31        * UserInterface/Views/TimelineRuler.js:
     32        (WebInspector.TimelineRuler.prototype.updateLayout):
     33
    1342015-02-04  Joseph Pecoraro  <pecoraro@apple.com>
    235

  • trunk/Source/WebInspectorUI/UserInterface/Views/TimelineContentView.js

    r178544 r179701  
    168168            return;
    169169
     170        this._timelineOverview.shown();
    170171        this._currentTimelineView.shown();
    171172        this._clearTimelineNavigationItem.enabled = this._recording.isWritable();
     173
     174        if (!this._updating && WebInspector.timelineManager.activeRecording === this._recording && WebInspector.timelineManager.isCapturing())
     175            this._startUpdatingCurrentTime();
    172176    },
    173177
    … …  
    177181            return;
    178182
     183        this._timelineOverview.hidden();
    179184        this._currentTimelineView.hidden();
     185
     186        if (this._updating)
     187            this._stopUpdatingCurrentTime();
    180188    },
    181189

  • trunk/Source/WebInspectorUI/UserInterface/Views/TimelineOverview.js

    r171786 r179701  
    212212    },
    213213
     214    get visible()
     215    {
     216        return this._visible;
     217    },
     218
     219    shown: function()
     220    {
     221        this._visible = true;
     222
     223        for (var timelineOverviewGraph of this._timelineOverviewGraphsMap.values())
     224            timelineOverviewGraph.shown();
     225
     226        this.updateLayout();
     227    },
     228
     229    hidden: function()
     230    {
     231        this._visible = false;
     232
     233        for (var timelineOverviewGraph of this._timelineOverviewGraphsMap.values())
     234            timelineOverviewGraph.hidden();
     235    },
     236
    214237    addMarker: function(marker)
    215238    {
    … …  
    299322    _needsLayout: function()
    300323    {
     324        if (!this._visible)
     325            return;
     326
    301327        if (this._scheduledLayoutUpdateIdentifier)
    302328            return;
     329
    303330        this._scheduledLayoutUpdateIdentifier = requestAnimationFrame(this.updateLayout.bind(this));
    304331    },

  • trunk/Source/WebInspectorUI/UserInterface/Views/TimelineOverviewGraph.js

    r172094 r179701  
    140140    },
    141141
     142    get visible()
     143    {
     144        return this._visible;
     145    },
     146
     147    shown: function()
     148    {
     149        this._visible = true;
     150        this.updateLayout();
     151    },
     152
     153    hidden: function()
     154    {
     155        this._visible = false;
     156    },
     157
    142158    reset: function()
    143159    {
    … …  
    166182    needsLayout: function()
    167183    {
     184        if (!this._visible)
     185            return;
     186
    168187        if (this._scheduledLayoutUpdateIdentifier)
    169188            return;

  • trunk/Source/WebInspectorUI/UserInterface/Views/TimelineRuler.js

    r173431 r179701  
    349349            ++dividerCount;
    350350
     351        var dividerData = {
     352            count: dividerCount,
     353            firstTime: firstDividerTime,
     354            lastTime: lastDividerTime,
     355        }
     356
     357        if (Object.shallowEqual(dividerData, this._currentDividers))
     358            return;
     359        this._currentDividers = dividerData;
     360
    351361        var markerDividers = this._markersElement.querySelectorAll("." + WebInspector.TimelineRuler.DividerElementStyleClassName);
    352362
Note: See TracChangeset for help on using the changeset viewer.