0

I have written in javascript two different ways to hover over links and have the background of the window change color, one using event delegation and one not.

How do check which option is best performance wise (probably checking something in the browser developer tools)?

From reading about conventions I have learned that event delegation is the way to go but the code seems less clear and readable so I want to check if does actually perform better.

stecd
  • 1,681
  • 6
  • 19
  • 28

1 Answers1

0

In Chrome Developer Tools you can use the Timeline section and create a recording of these events and time how long they take.

fuzzybabybunny
  • 5,146
  • 6
  • 32
  • 58
  • So the time it takes would be the milliseconds inside DETAILS on the bottom left? And I'd simply select the RECORD I want to test? A single record type changes from 140ms - 1.1s, is that normal? – stecd Jun 08 '14 at 04:42
  • You press the round record button and then do your hover events with the cursor. You then stop the recording and look at the results and find your hover events and how long they took. In your case, the performance difference between your two methods would be entirely negligible. – fuzzybabybunny Jun 08 '14 at 04:51