В моем веб-приложении я хотел бы полностью избежать HTML и использовать только JavaScript для создания dom дерева веб-страницы.
Что быстрее пишет веб-контент традиционным способом в HTML <div>Some text</div>
или использование JavaScript dom рендеринг, как это: div.appendChild(document.createTextNode("Some text"));
?
Придерживайтесь традиционного HTML. Это не только быстрее, чем делать все с помощью javascript, но и гораздо удобнее в обслуживании.
Если нет убедительных причин для обратного, придерживайтесь прямого HTML и используйте javascript для более интерактивных частей вашего приложения.
HTML анализируется и генерируется браузером, а затем вводится в DOM. Использование javascript для управления dom по частям требует дополнительных затрат.
Представьте, что вам нужно перепечатать статью из журнала. А теперь представьте, что вы это делаете, если бы каждое предложение было на новой странице. Хотя конечным результатом является скопированная статья, вам приходилось все это время листать страницы.
HTML (шаблоны) обычно считается более интуитивно понятным, модульным и поддерживаемым подходом к манипуляциям с DOM.
Пара мест, с которых можно начать:
Механизмы создания шаблонов jQuery: Механизмы создания шаблонов jQuery
Шаблоны закрытия Google http://code.google.com/closure/templates/
IMHO я думаю, что компиляция javascript - хорошее решение для создания быстрых приложений для web.
Скорость является второстепенной задачей по отношению к правильности - то есть сначала выполнять функциональные требования, а затем делать это быстро там, где это необходимо (в некоторых местах это может быть уже достаточно быстро).
В этом случае решение использовать статическую разметку вместо JavaScript - это вопрос о том, кто использует ваш документ - только пользователи с включенным JavaScript? Если так, то это не имеет большого значения. Вам нужно принимать во внимание поисковые системы? Пользователи с ограниченными возможностями? Тонкие клиенты, у которых нет полной поддержки JS, или параноидальные пользователи с отключенным JS? Во всех этих последних случаях наличие семантической разметки, не загроможденной лишними элементами, улучшенной с помощью JavaScript, является единственным правильным путем.
Традиционный подход будет быстрее, потому что браузеру нужно только загрузить, интерпретировать и отобразить. Предлагаемый вами подход приведет к тому, что браузеру придется скачивать, интерпретировать, изменять * n раз, а затем отображать.
Это все, что касается рендеринга.
Что касается ремонтопригодности, вы создаете кошмар. Это ключ к развитию. Количество кошмаров по ремонтопригодности пропорционально "качеству" кода, ИМХО.Производительность и оптимизация должны быть на втором месте после ремонтопригодности. (Бывают, конечно, исключения. Нет ничего черно-белого).
HTML был создан, чтобы быть выразительным языком. Javascript не было. На мой взгляд, конец истории.
Традиционный способ быстрее, пользователь загружает файл, он там, разбирается и готов.
Если вы используете JS способ, которым страница должна быть построена на стороне клиента, КАЖДЫЙ раз они загружают страницу.
Это просто ужасный способ создания страницы ИМХО и кошмар для управления / обновления / создания
Если вы собираетесь делать много изменений в html через javascript, я бы рекомендовал использовать библиотеку шаблонов, например trimpath.
Мне кажется интересным, что вы рассматриваете возможность создания документа исключительно с помощью Javascript. На самом деле быстрее создавать элементы, используя DOM и document.createElement
, чем свойство .innerHTML
. Этот метод создает объекты документа напрямую, в то время как использование innerHTML
требует от синтаксического анализатора итерации HTML и создания элементов.
С другой стороны, использование Javascript вместо непосредственного написания HTML потребует разбора и выполнения Javascript, что создаст дополнительную нагрузку на парсер HTML.
В прошлом я уже пытался сделать 100% javascript-компонент для ajax-чата. Оказалось, что он менее ремонтопригоден, требует больше времени для написания кода, а преимущества очень незначительны, даже если это был проект, который мог бы извлечь много пользы из такого подхода к javascript DOM.
Даже если вы думаете, что может быть преимущество, это не так. Придерживайтесь чистого HTML.