I'm thinking about DOM modification performance.In a perfect way, we alter each element but DOM modification is really heavy and alter many elements at same time froze the browser. I didn't make any performance tests but I want to know if the second way can be more powerful.In my head, the first way will ask the browser to refresh the display for each div. So logically, with the second way, the browser will refresh only once per injection. Is that correct?HTML:<body><header></header><div id=container>    <div id=test1 alt=test1alt></div>    <div id=test2 alt=test2alt></div>    <div id=test3 alt=test3alt></div>    <div id=test4 alt=test4alt></div>    <div id=test5 alt=test5alt></div>    <div id=test6 alt=test6alt></div>    <!--[...200 more div]--></div></body><script>JS first way: alter each element$(document).ready(function() {    setInterval(function() {        var value;        $('#container div').each(function() {            if(randNum(0, 10) != 1) {                return true;            }            value = randString();            if($(this).attr('alt') != value) {                $(this).attr('alt', value);            }        });    }, 100);});JS second way: rewrite base HTML and inject when modifiedvar myDOM = {};function domConstruct(obj) {    $('> div', obj).each(function() {        myDOM[$(this).attr('id')] = $(this).attr('alt');    });}function domAlter(id, value) {    if(myDOM[id] == value) {        return;    }    myDOM[id] = value;    return true;}function domUpdate(obj) {    var buf = '';    $.each(myDOM, function(id, value) {        buf += '<div id='+id+' alt='+value+'></div>';    });    obj.html(buf);}$(document).ready(function() {    domConstruct($('#container'));    setInterval(function() {        var inject = false;        $.each(myDOM, function(id) {            if(randNum(0, 10) != 1) {                return true;            }            if(domAlter(id, randString())) {                inject = true;            }        });        if(inject) {            domUpdate($('#container'));        }    }, 100);});JS Utils funcs:function randNum(a, b) {    var argc = arguments.length;    if(argc == 1) {        return 1;       }    if(argc == 0) {        a = 0;        b = 2147483647;    }    return Math.floor(Math.random() * (b - a + 1))+a;}function randString() {    return Math.random().toString(36).replace(/[^a-z]+/g, '');}</script>
JavaScript DOM modification
javascript;jquery;html