Каковы наилучшие методы для ввода DOM?
innerHTML Вставка немного быстрее, чем DOM-манипуляция 1:1, и получает больше для случаев, когда вы фактически вставляете несколько узлов и атрибутов и т.д., но это больше подвержено ошибкам и опасностям, учитывая, что это по сути сводная инструкция в маскировке.
По моему опыту, в наши дни JS настолько быстр, что выигрыш в скорости innerHTML не оправдывает риски ни для чего, кроме самой большой из серий вставки/итерации.
Короче говоря, вы хотите сделать наименьшее количество манипуляций с DOM, поэтому один совет при создании иерархии для вставки - это создать их друг против друга в памяти, а затем вставить самый последний элемент в DOM в последний момент. Это оставляет меньше всего обновлений для браузера. Конечно, снова мы говорим о долях миллисекунд...
Настройка innerHTML часто быстрее, чем вставка отдельных узлов.
Другая возможность заключалась бы в создании DocumentFragment, который позволяет вставлять узлы все сразу. Еще одно преимущество использования DocumentFragments заключается в том, что они могут легко быть клонированы, что может заменить множество вариантов использования для innerHTML и потенциально быстрее, чем нет используется разбор.
innerHTML на самом деле медленнее, а затем во многих случаях направляет DOM-манипуляцию. проверьте тест на jsperf
Нет "правильного ответа", вам нужно будет найти правильный, наиболее эффективный метод для вашего конкретного случая использования
Для больших фрагментов html, определенно быстрее назначить текст innerHTML. Хотя он поддерживается всем основным браузером, innerHTML не входит в стандарт w3c, поэтому некоторые программисты не решаются его использовать.
Это определенно быстрее сделать все сразу. Также проверьте блог Стива Саудера и его книга.