Impact of adding redundant IDs on html / js rendering performance

Currently, about 10 UL are working in my project, each of which will have from 10-50 elements. It was suggested that each of these elements have a unique identifier specified for it, which we will use to update the content using Javascript.

This looks like a large number of identifiers to add to the page, but each field will have a real and meaningful name.

If this is useful to us, will identifiers be added to this set of pre-existing elements that will affect performance, while at first they display the page or move / change it using javascript?

+3
source share
4 answers

In my personal experience, I have implemented pages with over 1000 unique identifiers, and even IE seems to do pretty well. However, remember that IE will create a global variable for each identifier on the page and remember that in javascript usually both global variables and function names are simply attributes of the window object.

So, in IE, the following code will break:

<div id="foo"></div>
<script>
    function foo (txt) {
        document.getElementById('foo').innerHTML = txt; // fail in IE
                                                        // because function 'foo'
                                                        // clash with ID 'foo'
    }
</script>

Just something to keep in mind, because with so many IDs, the likelihood of collision of function names increases.

+4
source

. , (< 10 ) ( > 50 ).

FF2.0, n DIV, , "":

  • 5000 Short ID: 1.022s
  • 5000 Long ID: 1.065s
  • 50 000 : 6.702s
  • 50 000 : 6.792s

, .

Edit: YSlow .

+4

, script, ul / id? , . , .;)

python script .

+2

id , , . , . , .

+2

Source: https://habr.com/ru/post/1728536/


All Articles