Changeset 147076 in webkit


Ignore:
Timestamp:
Mar 28, 2013 12:40:37 AM (11 years ago)
Author:
loislo@chromium.org
Message:

Web Inspector: Timeline. Refresh is slow when user drags the overview window.
https://bugs.webkit.org/show_bug.cgi?id=113371

Reviewed by Pavel Feldman.

The root of problem is the 300ms delay in scheduleRefresh method.
It was introduced for the case when we add a huge number of records per second.
The scheduleRefresh was written such a way that refresh happened immediately
only for the scrolling operations. Actually we would like to see fast
refresh every time when it is forced by an user action.

In this patch additional flag newRecordWasAdded was added to the
_invalidateAndScheduleRefresh. I made it mandatory because the function
is also used as a callback for an event and it is easy to make a mistake and
interpret the event as the flag.

  • inspector/front-end/TimelinePanel.js:

(WebInspector.TimelinePanel.prototype._onCategoryCheckboxClicked):
(WebInspector.TimelinePanel.prototype._durationFilterChanged):
(WebInspector.TimelinePanel.prototype._repopulateRecords):
(WebInspector.TimelinePanel.prototype._onTimelineEventRecorded):
(WebInspector.TimelinePanel.prototype._onRecordsCleared):
(WebInspector.TimelinePanel.prototype._invalidateAndScheduleRefresh):
(WebInspector.TimelinePanel.prototype._scheduleRefresh):
(WebInspector.TimelinePanel.prototype._revealRecord):
(WebInspector.TimelinePanel.prototype._refreshRecords):
(WebInspector.TimelinePanel.prototype.performFilter):

Location:
trunk/Source/WebCore
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • trunk/Source/WebCore/ChangeLog

    r147070 r147076  
     12013-03-27  Ilya Tikhonovsky  <loislo@chromium.org>
     2
     3        Web Inspector: Timeline. Refresh is slow when user drags the overview window.
     4        https://bugs.webkit.org/show_bug.cgi?id=113371
     5
     6        Reviewed by Pavel Feldman.
     7
     8        The root of problem is the 300ms delay in scheduleRefresh method.
     9        It was introduced for the case when we add a huge number of records per second.
     10        The scheduleRefresh was written such a way that refresh happened immediately
     11        only for the scrolling operations. Actually we would like to see fast
     12        refresh every time when it is forced by an user action.
     13
     14        In this patch additional flag newRecordWasAdded was added to the
     15        _invalidateAndScheduleRefresh. I made it mandatory because the function
     16        is also used as a callback for an event and it is easy to make a mistake and
     17        interpret the event as the flag.
     18
     19        * inspector/front-end/TimelinePanel.js:
     20        (WebInspector.TimelinePanel.prototype._onCategoryCheckboxClicked):
     21        (WebInspector.TimelinePanel.prototype._durationFilterChanged):
     22        (WebInspector.TimelinePanel.prototype._repopulateRecords):
     23        (WebInspector.TimelinePanel.prototype._onTimelineEventRecorded):
     24        (WebInspector.TimelinePanel.prototype._onRecordsCleared):
     25        (WebInspector.TimelinePanel.prototype._invalidateAndScheduleRefresh):
     26        (WebInspector.TimelinePanel.prototype._scheduleRefresh):
     27        (WebInspector.TimelinePanel.prototype._revealRecord):
     28        (WebInspector.TimelinePanel.prototype._refreshRecords):
     29        (WebInspector.TimelinePanel.prototype.performFilter):
     30
    1312013-03-27  Keishi Hattori  <keishi@webkit.org>
    232
  • trunk/Source/WebCore/inspector/front-end/TimelinePanel.js

    r146970 r147076  
    5454
    5555    this._overviewPane = new WebInspector.TimelineOverviewPane(this._model);
    56     this._overviewPane.addEventListener(WebInspector.TimelineOverviewPane.Events.WindowChanged, this._invalidateAndScheduleRefresh.bind(this, false));
     56    this._overviewPane.addEventListener(WebInspector.TimelineOverviewPane.Events.WindowChanged, this._invalidateAndScheduleRefresh.bind(this, false, true));
    5757    this._overviewPane.addEventListener(WebInspector.TimelineOverviewPane.Events.ModeChanged, this._overviewModeChanged, this);
    5858    this._overviewPane.show(this.element);
     
    329329    {
    330330        category.hidden = !event.target.checked;
    331         this._invalidateAndScheduleRefresh(true);
     331        this._invalidateAndScheduleRefresh(true, true);
    332332    },
    333333
     
    605605        this._overviewPane.setMinimumRecordDuration(minimumRecordDuration);
    606606        this._durationFilterSelector.element.title = option.title;
    607         this._invalidateAndScheduleRefresh(true);
     607        this._invalidateAndScheduleRefresh(true, true);
    608608    },
    609609
     
    629629        for (var i = 0; i < records.length; ++i)
    630630            this._innerAddRecordToTimeline(records[i]);
    631         this._invalidateAndScheduleRefresh(false);
     631        this._invalidateAndScheduleRefresh(false, true);
    632632    },
    633633
     
    635635    {
    636636        if (this._innerAddRecordToTimeline(event.data))
    637             this._invalidateAndScheduleRefresh(false);
     637            this._invalidateAndScheduleRefresh(false, false);
    638638    },
    639639
     
    689689    {
    690690        this._closeRecordDetails();
    691         this._scheduleRefresh(false);
     691        this._scheduleRefresh(false, true);
    692692        this._graphRowsElementWidth = this._graphRowsElement.offsetWidth;
    693693        this._containerElementHeight = this._containerElement.clientHeight;
     
    706706    {
    707707        this._resetPanel();
    708         this._invalidateAndScheduleRefresh(true);
     708        this._invalidateAndScheduleRefresh(true, true);
    709709    },
    710710
     
    749749        var dividersTop = Math.max(0, this._scrollTop);
    750750        this._timelineGrid.setScrollAndDividerTop(this._scrollTop, dividersTop);
    751         this._scheduleRefresh(true);
    752     },
    753 
    754     _invalidateAndScheduleRefresh: function(preserveBoundaries)
     751        this._scheduleRefresh(true, true);
     752    },
     753
     754    /**
     755     * @param {boolean} preserveBoundaries
     756     * @param {boolean} userGesture
     757     */
     758    _invalidateAndScheduleRefresh: function(preserveBoundaries, userGesture)
    755759    {
    756760        this._presentationModel.invalidateFilteredRecords();
    757761        delete this._searchResults;
    758         this._scheduleRefresh(preserveBoundaries);
     762        this._scheduleRefresh(preserveBoundaries, userGesture);
    759763    },
    760764
    761765    /**
    762766     * @param {boolean} preserveBoundaries
    763      */
    764     _scheduleRefresh: function(preserveBoundaries)
     767     * @param {boolean} userGesture
     768     */
     769    _scheduleRefresh: function(preserveBoundaries, userGesture)
    765770    {
    766771        this._closeRecordDetails();
     
    770775            return;
    771776
    772         if (preserveBoundaries)
     777        if (preserveBoundaries || userGesture)
    773778            this._refresh();
    774779        else {
     
    847852        }
    848853        if (treeUpdated)
    849             this._invalidateAndScheduleRefresh(true);
     854            this._invalidateAndScheduleRefresh(true, true);
    850855
    851856        var recordsInWindow = this._presentationModel.filteredRecords();
     
    888893        this._itemsGraphsElement.removeChild(this._graphRowsElement);
    889894        var graphRowElement = this._graphRowsElement.firstChild;
    890         var scheduleRefreshCallback = this._invalidateAndScheduleRefresh.bind(this, true);
     895        var scheduleRefreshCallback = this._invalidateAndScheduleRefresh.bind(this, true, true);
    891896        this._itemsGraphsElement.removeChild(this._expandElements);
    892897        this._expandElements.removeChildren();
     
    12621267            this._presentationModel.addFilter(this._searchFilter);
    12631268        }
    1264         this._invalidateAndScheduleRefresh(true);
     1269        this._invalidateAndScheduleRefresh(true, true);
    12651270    },
    12661271
     
    14991504    {
    15001505        this._record.collapsed = !this._record.collapsed;
    1501         this._scheduleRefresh(false);
     1506        this._scheduleRefresh(false, true);
    15021507    },
    15031508
Note: See TracChangeset for help on using the changeset viewer.