Which HTML markup is better?

Question

HTML

Hey!
I would like to know which option is better for code optimization and speed?
The first option, I saw many times similar markup:

<!-- Без оборачивания каждого "строчного" дескриптора в отдельный блок -->
<div class="some-class">
  <h1 class="some-class__h1">header</h1>
  <p class="some-class__p">description</p>
  <button class="some-class__button">click me</button>
</div>

The second option, as I write:

<!-- Оборачиваю каждый "строчный" дескриптор в отдельный блок -->
<div class="some-class">
  <div class="some-class__h1">
    <h1>header</h1>
  </div>
  <div class="some-class__p">
    <p>description</p>
  </div>
  <div class="some-class__button">
    <button>click me</button>
  </div>
</div>

In my opinion, the second option has obvious advantages. But I'm interested in the difference precisely in the speed of processing by the browser of one or another approach and which of the options is closer to the "standards" (maybe there are some).
For example, which option will work faster if we have HTML for 20 thousand lines of code. First or second option? Or is the difference so small and markup can be done in any way?

Answer 1

I don't see any merit in option 2. What is the point of doing so?
In terms of speed - the 1st one is obviously faster (stupidly fewer elements), but the difference is negligible almost always, except for especially clinical cases.