Question about bubbling phase, capturing phase in JS

I am reading this article, https://js.plainenglish.io/3-phases-of-javascript-event-2ff09aa76b03
Then, I saw the graphic like this


Therefor, I got three questions that are very confused and curious:

  1. Since it go down to find the element … is it better if we design the less html tag to wrap the element? maybe will trigger the event faster?
    2.what is the benefit if we also set the capturing phase to true? what’s the different?
    3.In what case, we must to set the Capturing phase to true?

Thank you very much.