Changeset 196342 in webkit


Ignore:
Timestamp:
Feb 9, 2016 3:42:53 PM (8 years ago)
Author:
commit-queue@webkit.org
Message:

Web Inspector: localStorage inspector very slow on big values
​https://bugs.webkit.org/show_bug.cgi?id=123750
<rdar://problem/15384930>

Patch by Joseph Pecoraro <Joseph Pecoraro> on 2016-02-09
Reviewed by Timothy Hatcher.

It is not useful to show very large strings in the DOM Storage DataGrid.
This change truncates display strings to roughly 200 characters. If the
developer really wants the full value of the string they can just access
it through localStorage.

  • UserInterface/Models/DOMStorageObject.js:

(WebInspector.DOMStorageObject.prototype.getEntries.innerCallback):
(WebInspector.DOMStorageObject.prototype.getEntries):
(WebInspector.DOMStorageObject.prototype.itemUpdated):
Modernize.

  • UserInterface/Views/DOMStorageContentView.js:

(WebInspector.DOMStorageContentView):
(WebInspector.DOMStorageContentView.prototype.itemRemoved):
Modernize.

(WebInspector.DOMStorageContentView.prototype.itemAdded):
(WebInspector.DOMStorageContentView.prototype.itemUpdated):
(WebInspector.DOMStorageContentView.prototype._truncateValue):
(WebInspector.DOMStorageContentView.prototype._populate):
Whenever we get a value that we will display, truncate it to
just 200 characters.

Location:
trunk/Source/WebInspectorUI
Files:
3 edited

Legend:

Unmodified
Added
Removed

  • trunk/Source/WebInspectorUI/ChangeLog

    r196336 r196342  
     12016-02-09  Joseph Pecoraro  <pecoraro@apple.com>
     2
     3        Web Inspector: localStorage inspector very slow on big values
     4        https://bugs.webkit.org/show_bug.cgi?id=123750
     5        <rdar://problem/15384930>
     6
     7        Reviewed by Timothy Hatcher.
     8
     9        It is not useful to show very large strings in the DOM Storage DataGrid.
     10        This change truncates display strings to roughly 200 characters. If the
     11        developer really wants the full value of the string they can just access
     12        it through localStorage.
     13
     14        * UserInterface/Models/DOMStorageObject.js:
     15        (WebInspector.DOMStorageObject.prototype.getEntries.innerCallback):
     16        (WebInspector.DOMStorageObject.prototype.getEntries):
     17        (WebInspector.DOMStorageObject.prototype.itemUpdated):
     18        Modernize.
     19
     20        * UserInterface/Views/DOMStorageContentView.js:
     21        (WebInspector.DOMStorageContentView):
     22        (WebInspector.DOMStorageContentView.prototype.itemRemoved):
     23        Modernize.
     24
     25        (WebInspector.DOMStorageContentView.prototype.itemAdded):
     26        (WebInspector.DOMStorageContentView.prototype.itemUpdated):
     27        (WebInspector.DOMStorageContentView.prototype._truncateValue):
     28        (WebInspector.DOMStorageContentView.prototype._populate):
     29        Whenever we get a value that we will display, truncate it to
     30        just 200 characters.
     31
    1322016-02-09  Joseph Pecoraro  <pecoraro@apple.com>
    233

  • trunk/Source/WebInspectorUI/UserInterface/Models/DOMStorageObject.js

    r188993 r196342  
    7171                return;
    7272
    73             for (var entry of entries) {
    74                 if (!entry[0] || !entry[1])
     73            for (let [key, value] of entries) {
     74                if (!key || !value)
    7575                    continue;
    76                 this._entries.set(entry[0], entry[1]);
     76
     77                this._entries.set(key, value);
    7778            }
    7879
    … …  
    114115    {
    115116        this._entries.set(key, value);
    116         var data = {key, oldValue, value};
    117         this.dispatchEventToListeners(WebInspector.DOMStorageObject.Event.ItemUpdated, data);
     117        this.dispatchEventToListeners(WebInspector.DOMStorageObject.Event.ItemUpdated, {key, oldValue, value});
    118118    }
    119119};

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

    r194878 r196342  
    3838        representedObject.addEventListener(WebInspector.DOMStorageObject.Event.ItemUpdated, this.itemUpdated, this);
    3939
    40         var columns = {};
     40        let columns = {};
    4141        columns.key = {title: WebInspector.UIString("Key"), sortable: true};
    4242        columns.value = {title: WebInspector.UIString("Value"), sortable: true};
    … …  
    6969    itemRemoved(event)
    7070    {
    71         for (var node of this._dataGrid.children) {
     71        for (let node of this._dataGrid.children) {
    7272            if (node.data.key === event.data.key)
    7373                return this._dataGrid.removeChild(node);
    … …  
    7777    itemAdded(event)
    7878    {
    79         var key = event.data.key;
    80         var value = event.data.value;
     79        let {key, value} = event.data;
     80        value = this._truncateValue(value);
    8181
    8282        // Enforce key uniqueness.
    83         for (var node of this._dataGrid.children) {
     83        for (let node of this._dataGrid.children) {
    8484            if (node.data.key === key)
    8585                return;
    8686        }
    8787
    88         var data = {key, value};
    89         this._dataGrid.appendChild(new WebInspector.DataGridNode(data, false));
     88        this._dataGrid.appendChild(new WebInspector.DataGridNode({key, value}, false));
    9089        this._sortDataGrid();
    9190    }
    … …  
    9392    itemUpdated(event)
    9493    {
    95         var key = event.data.key;
    96         var value = event.data.value;
    97 
    98         var keyFound = false;
    99         for (var childNode of this._dataGrid.children) {
     94        let {key, value} = event.data;
     95        value = this._truncateValue(value);
     96
     97        let keyFound = false;
     98        for (let childNode of this._dataGrid.children) {
    10099            if (childNode.data.key === key) {
    101100                // Remove any rows that are now duplicates.
    … …  
    122121    // Private
    123122
     123    _truncateValue(value)
     124    {
     125        return value.truncate(200);
     126    }
     127
    124128    _populate()
    125129    {
    … …  
    128132                return;
    129133
    130             var nodes = [];
    131             for (var entry of entries) {
    132                 if (!entry[0] || !entry[1])
     134            for (let [key, value] of entries) {
     135                if (!key || !value)
    133136                    continue;
    134                 var data = {key: entry[0], value: entry[1]};
    135                 var node = new WebInspector.DataGridNode(data, false);
     137
     138                value = this._truncateValue(value);
     139                let node = new WebInspector.DataGridNode({key, value}, false);
    136140                this._dataGrid.appendChild(node);
    137141            }
    … …  
    145149    _sortDataGrid()
    146150    {
    147         var sortColumnIdentifier = this._dataGrid.sortColumnIdentifier || "key";
     151        let sortColumnIdentifier = this._dataGrid.sortColumnIdentifier || "key";
    148152
    149153        function comparator(a, b)
Note: See TracChangeset for help on using the changeset viewer.