[Devtools] Network waterfall to use Path2D to draw in layers

[Devtools] Network waterfall to use Path2D to draw in layers

This patch introduces changes network waterfall canvas to use Path2D to
draw it's canvas items. This is in preporation to move it to use full
layers. (Followup patch will move the code to use the same path
for artifacts that are the same style)

R=caseq
BUG=697668
Review-Url: https://codereview.chromium.org/2731633002
Cr-Commit-Position: refs/heads/master@{#455992}
Committed: https://chromium.googlesource.com/chromium/src/+/09a524bf16691a0fd873d1d24edf04c8aae8874d

[allada, 2017-03-03 01:45:14]

PTL. However I cannot commit this patch until we update closure with a patch to
add Path2D data to the definitions.

https://codereview.chromium.org/2731633002/diff/1/third_party/WebKit/Source/d...
File
third_party/WebKit/Source/devtools/front_end/network/NetworkWaterfallColumn.js
(left):

https://codereview.chromium.org/2731633002/diff/1/third_party/WebKit/Source/d...
third_party/WebKit/Source/devtools/front_end/network/NetworkWaterfallColumn.js:400:
* @return {number}
Unused function.

https://codereview.chromium.org/2731633002/diff/1/third_party/WebKit/Source/d...
third_party/WebKit/Source/devtools/front_end/network/NetworkWaterfallColumn.js:458:
context.translate(0, y);
Important to remember that we are no longer offsetting anything with transform
so "y" is added inline a lot.

https://codereview.chromium.org/2731633002/diff/1/third_party/WebKit/Source/d...
File
third_party/WebKit/Source/devtools/front_end/network/NetworkWaterfallColumn.js
(right):

https://codereview.chromium.org/2731633002/diff/1/third_party/WebKit/Source/d...
third_party/WebKit/Source/devtools/front_end/network/NetworkWaterfallColumn.js:518:
hoverLinePath.moveTo(ranges.start - barDotLineLength, y + Math.floor(height /
2));
This is needed because arc will try and connect the previous path to it unless
it's moved.

https://codereview.chromium.org/2731633002/diff/1/third_party/WebKit/Source/d...
third_party/WebKit/Source/devtools/front_end/network/NetworkWaterfallColumn.js:530:
hoverLinePath.moveTo(endX, y + Math.floor(height / 2));
Same as above.

[caseq, 2017-03-09 00:44:12]

Can you elaborate a bit on 'Followup patch will move the code to use the same
path for items artifacts that are the same style'? I would expect different
items to have different sizes...

> I cannot commit this patch until we update closure 
> with a patch to add Path2D data to the definitions.

Can you use this as a temporary fix for the context problem:

https://cs.chromium.org/chromium/src/third_party/WebKit/Source/devtools/front...

https://codereview.chromium.org/2731633002/diff/1/third_party/WebKit/Source/d...
File
third_party/WebKit/Source/devtools/front_end/network/NetworkWaterfallColumn.js
(right):

https://codereview.chromium.org/2731633002/diff/1/third_party/WebKit/Source/d...
third_party/WebKit/Source/devtools/front_end/network/NetworkWaterfallColumn.js:64:
this._pathForStyle = new Map();
Is there any reason for this to be a map? Why not just an array of pairs?

[allada, 2017-03-09 01:24:09]

Description was changed from

==========
[Devtools] Network waterfall to use Path2D to draw in layers

This patch introduces changes network waterfall canvas to use Path2D to
draw it's canvas items. This is in preporation to move it to use full
layers. (Followup patch will move the code to use the same the same path
for items artifacts that are the same style)

R=caseq
BUG=697668
==========

to

==========
[Devtools] Network waterfall to use Path2D to draw in layers

This patch introduces changes network waterfall canvas to use Path2D to
draw it's canvas items. This is in preporation to move it to use full
layers. (Followup patch will move the code to use the same path
for artifacts that are the same style)

R=caseq
BUG=697668
==========

[allada, 2017-03-09 01:29:53]

> Can you elaborate a bit on 'Followup patch will move the code to use the same
> path for items artifacts that are the same style'? I would expect different
> items to have different sizes...

This is the reason I used the map instead of array of tuples.

There will be a map of precomputed styles tied to an enum of styles. This will
allow the code to ask for a Path2D based on a style and amend it.

> Can you use this as a temporary fix for the context problem:

This is not needed any more. I landed the patch to closure and chrome to fix
this:

https://github.com/google/closure-compiler/commit/681c8521a7e7c3dd2306e584bf0...

https://codereview.chromium.org/2734033003/

(ie: This is no longer a blocker)

https://codereview.chromium.org/2731633002/diff/1/third_party/WebKit/Source/d...
File
third_party/WebKit/Source/devtools/front_end/network/NetworkWaterfallColumn.js
(right):

https://codereview.chromium.org/2731633002/diff/1/third_party/WebKit/Source/d...
third_party/WebKit/Source/devtools/front_end/network/NetworkWaterfallColumn.js:64:
this._pathForStyle = new Map();
On 2017/03/09 00:44:12, caseq wrote:
> Is there any reason for this to be a map? Why not just an array of pairs?

Because in a follow up patch it'll lookup the Path2D based on which style it is
going to use and append data to the Path2D.

[caseq, 2017-03-09 21:31:48]

lgtm

[allada, 2017-03-10 01:11:11]

The CQ bit was checked by allada@chromium.org to run a CQ dry run

[commit-bot: I haz the power, 2017-03-10 01:11:39]

Dry run: CQ is trying da patch. Follow status at
 
https://chromium-cq-status.appspot.com/v2/patch-status/codereview.chromium.or...

[allada, 2017-03-10 01:22:46]

The CQ bit was checked by allada@chromium.org to run a CQ dry run

[commit-bot: I haz the power, 2017-03-10 01:23:09]

Dry run: CQ is trying da patch. Follow status at
 
https://chromium-cq-status.appspot.com/v2/patch-status/codereview.chromium.or...

[commit-bot: I haz the power, 2017-03-10 02:47:18]

The CQ bit was unchecked by commit-bot@chromium.org

[commit-bot: I haz the power, 2017-03-10 02:47:19]

Dry run: This issue passed the CQ dry run.

[allada, 2017-03-10 04:15:23]

The CQ bit was checked by allada@chromium.org

[allada, 2017-03-10 04:15:24]

The patchset sent to the CQ was uploaded after l-g-t-m from caseq@chromium.org
Link to the patchset: https://codereview.chromium.org/2731633002/#ps40001
(title: "Path2D slightly changes tests.")

[commit-bot: I haz the power, 2017-03-10 04:15:40]

CQ is trying da patch. Follow status at
 
https://chromium-cq-status.appspot.com/v2/patch-status/codereview.chromium.or...

[commit-bot: I haz the power, 2017-03-10 04:20:38]

CQ is committing da patch.

Bot data: {"patchset_id": 40001, "attempt_start_ts": 1489119323664250,
"parent_rev": "57310cedbe5d558ba806b3f60f752b84e20a65eb", "commit_rev":
"09a524bf16691a0fd873d1d24edf04c8aae8874d"}

[commit-bot: I haz the power, 2017-03-10 04:21:18]

Description was changed from

==========
[Devtools] Network waterfall to use Path2D to draw in layers

This patch introduces changes network waterfall canvas to use Path2D to
draw it's canvas items. This is in preporation to move it to use full
layers. (Followup patch will move the code to use the same path
for artifacts that are the same style)

R=caseq
BUG=697668
==========

to

==========
[Devtools] Network waterfall to use Path2D to draw in layers

This patch introduces changes network waterfall canvas to use Path2D to
draw it's canvas items. This is in preporation to move it to use full
layers. (Followup patch will move the code to use the same path
for artifacts that are the same style)

R=caseq
BUG=697668

Review-Url: https://codereview.chromium.org/2731633002
Cr-Commit-Position: refs/heads/master@{#455992}
Committed:
https://chromium.googlesource.com/chromium/src/+/09a524bf16691a0fd873d1d24edf...
==========

[commit-bot: I haz the power, 2017-03-10 04:21:19]

Committed patchset #3 (id:40001) as
https://chromium.googlesource.com/chromium/src/+/09a524bf16691a0fd873d1d24edf...