A
A
Andrei Smirnov2017-03-24 08:37:27
HTML
Andrei Smirnov, 2017-03-24 08:37:27

What renders faster?

Often in react markup you have to make "extra" , in connection with which the question is - will there be a difference in performance? between this example..<div>

<div>
  <div>
    <p>Hello</p>
  </div>
</div>

and this...
<div>
  <p>Hello</p>
</div>

... of course if you multiply this by a thousand.
UPD:
Yes, the example is of course a bit far-fetched.
I made a tooltip for the text that is truncated with ellipsis. There is a component Textthat renders any text on the page with the given parameters. Initially the component was just <p>, but for the tooltip, I need a container with display: relative:
return (
    <div style={{display: 'relative'}}>
        <p>{text}</p>
        <div className={styles.tooltip}>
            {text}
        </div>
    </div>
  )

those. if you apply this markup to all the text on the page, then a div will be added to each p.
And there is a lot of text, for example, each cell in a large table is rendered by this component.

Answer the question

In order to leave comments, you need to log in

1 answer(s)
Y
Yuri Kostin, 2017-03-24
@yurakostin

Usually your component consists of one or a set of tags.
If one tag is returned, then there seems to be no problem (correct me if I'm wrong).
If a set of tags, then you probably need a wrapper for them, which means that the output will again have one tag.
Why do you need it in this case div>div>p?

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question