Closed Bug 830344 Opened 10 years ago Closed 9 years ago

Implement pagination when expanding objects with lots of properties

Categories

(DevTools :: Object Inspector, defect, P3)

defect

Tracking

(Not tracked)

RESOLVED FIXED
Firefox 29

People

(Reporter: vporof, Assigned: vporof)

References

Details

Attachments

(4 files, 2 obsolete files)

Performance considerations were taken care of in bug 828664, but a few UX problems remain:

1. Although the browser remains responsive, building the UI when inspecting an object with a very large number of properties may take tens of seconds. If you'd want to inspect the *last* property on an object, you're gonna' have to wait.

2. Searching for properties is easier because of bug 798874, but sometimes analyzing a subset (chunk) of needles in the haystack (at the same time) may be desirable.

Pagination would work by grouping large sets of properties under a single expando pseudo-property. I think the most optimal solution is to have inspectable "quarters" when dealing with more than a certain number of properties (1000?). For example, when inspecting arrays with 100,000 elements, you'd have

myVariable [object Array] 
  > 0 ... 25,000
  > 25,000 ... 50,000
  > 50,000 ... 75,000
  > 75,000 ... 100,000

Expanding the first set would further reveal 4 sub-chunks between 0 and 25,000  and so on:

myVariable [object Array] 
  > 0 ... 25,000
    > 0 ... 6,250
    > 6,250 ... 12,500
    > 12,500 ... 18,750
    > 18,750 ... 25,000
  > 25,000 ... 50,000
  > 50,000 ... 75,000
  > 75,000 ... 100,000

This process is repeated until a subset contains less than than a certain number of properties.

When dealing with objects and not arrays, properties can be grouped alphabetically: $ and _, A-G, H-M, N-S, T-Z, then other utf symbols.


I don't think optimizing the protocol itself to handle fetching such chunks is really necessary. This is mostly a frontend UX problem.
Assignee: nobody → vporof
Status: NEW → ASSIGNED
Priority: -- → P3
Moving stuff to the Object Inspector component.
Filter on COSMICMIGRAINE.
Component: Developer Tools: Debugger → Developer Tools: Object Inspector
Attached image screencast.gif
Started working on this again. Here's how it looks so far.
Attached file test.html
Handy test page.
Duplicate of this bug: 859685
Needs some rebasing.
Well, if you insist!
Attachment #8346566 - Attachment is obsolete: true
Attachment #8346566 - Flags: review?(past)
Attachment #8347597 - Flags: review?(past)
Attachment #8346567 - Attachment is obsolete: true
Attachment #8346567 - Flags: review?(past)
Attachment #8347598 - Flags: review?(past)
Comment on attachment 8347598 [details] [diff] [review]
Part 2: Implement pagination when expanding objects with lots of properties

Review of attachment 8347598 [details] [diff] [review]:
-----------------------------------------------------------------

::: browser/devtools/shared/widgets/VariablesView.jsm
@@ +1305,5 @@
>     *        - sorted: true to sort all the properties before adding them
>     *        - callback: function invoked after each item is added
> +   * @param string aKeysType [optional]
> +   *        Helper argument in the case of paginated items. Can be either
> +   *        "numbers" or "strings".

Why not just add an option numberKeys or keysAreNumbers to aOptions instead of an additional parameter? Cleaner, faster, better! Call 1-800-B00LEAN now for a free sample!
Attachment #8347598 - Flags: review?(past) → review+
Attachment #8347597 - Flags: review?(past) → review+
https://hg.mozilla.org/mozilla-central/rev/e472c39cc2bb
https://hg.mozilla.org/mozilla-central/rev/b48f948547ef
Status: ASSIGNED → RESOLVED
Closed: 9 years ago
Flags: in-testsuite+
Resolution: --- → FIXED
Whiteboard: [fixed-in-fx-team]
Target Milestone: --- → Firefox 29
Depends on: 1262313
Product: Firefox → DevTools
You need to log in before you can comment on or make changes to this bug.