Graphical Timeline – Mid Term report

Midterm is over, I passed . So much for seeking attention, let’s get back to the updates.

There was no report last week and this week also, as I was fine tuning many things to be ready for mid-term and an AMO push bound this week. I will mention the changes from the previous meeting, the overall progress of the project and the future plans (tentative) in this post.

Changes from the last report:

1. The zoomed out view is complete, and the default view when you start the timeline.
2. The timeline will only squeeze when any new events are available.
3. The detailed view is complete and it will show all the details related to the event.
   1. It only works when the Timeline is not in overview mode (just move the time ruler or select a time range #4) and when you hover the event.
   2. You can pin the detail box by clicking once the box is visible (click again to unpin it)
4. You can select any time range and zoom into that. Just click and drag a time range on the canvas. It’s very simple, give it a try.
5. Some performance gains by combining the 3 mozRequestAnimationFrames calls.
6. Nothing is hard-coded into the timeline.jsm anymore. The producers themselves register the things to be displayed in the detailed box, and there are more than 5 types available (namely date, string, enum, url, object, etc.). I will soon start writing wiki for all these things.
7. Many issues related to producers pane were fixed as the pane is not collapsed anymore. It just slides away from view.
8. The play button is gone. Maybe the remaining two text button will also become images (maybe).

Now the overall progress in a little medium-sized nut shell:

1. The timeline records three types of events:
   1. Network calls: Any kind of GET or POST calls.
   2. DOM Events: Events like click, mouseup etc. for the page, the timeline is active.
   3. Garbage collection and Cycle collection: Incase of Incremental GC, the slices are also visible.
   4. More producers can be added to record more type of events as everything is modular (just like GCLI commands).
2. The UI for displaying these events is also in good shape and close to being perfect. (I know any UI will never be actually perfect).
3. The interactions between the UI and the producers is async and handled using custom events for now. Soon RDP will be the way.

Future Plans:

1. Code cleanup and performance optimizations.
2. Linking Style Editor, Scratchpad, Script Debugger and Inspector with the Timeline.
3. Using Remote Debugging protocol to transfer event data and any other message.
4. Proper documentation so that others can also add some producers, or may some UI components too.
5. May be some more kind of producers, most probably recording timers.

As always, try out the add-on using this xpi file, until the add-on is hosted on AMO.

I have started using the github issues to track changes, as the code is almost stable. So feel free to open a new issue for any bug or feature request after trying out the add-on.