2013-10-03 3 views
1

В настоящее время я создаю веб-сайт, который полностью управляется JS. Я вообще не использую HTML-страницы (кроме индексной страницы). Каждый запрос возвращает JSON, а затем я генерирую HTML внутри JavaScript и вставляю в DOM. Есть ли недостатки в этом, вместо создания HTML-файла с компоновкой структуры, затем загрузка этого файла в DOM и изменение элементов с новыми данными из JSON?Создание HTML в JavaScript и загрузка файла HTML

EDIT: Все мои страницы загружены вызовами AJAX. Но у меня есть структура вроде этого:

<nav></nav> 
<div id="content"></div> 
<footer></footer> 

В принципе, я никогда не меняется nav или footer элементов, они загружаются только один раз, при загрузке файла index.html. Тогда на каждой странице нажмите Я посылаю вызов AJAX на сервер, он возвращает данные в формате JSON и сгенерировать HTML-код с JQuery и вставить как это $('#content').html(content);

Создание отдельных HTML-файлов, а затем, например, с помощью $('#someID').html(newContent) изменить каждый элемент с данными JSON, будет использовать еще больше кода, и мне понадобится еще 1 запрос на сервер для загрузки этого файла, поэтому я подумал, что могу просто сгенерировать его в браузере.

EDIT2: SEO не очень важен, потому что мой сайт требует входа в систему, поэтому я создам все метатеги в файле index.html.

+1

Насколько я понимаю, javascript и DOM arent друзья по этому вопросу. В моем опыте мне легче редактировать и создавать html в html-файлах. Я поклонник разделения ресурсов (js только для js, html-файлов для html и т. Д.) – Martijn

+0

Почему вы это делаете? –

+0

Почему вы задаете этот вопрос @MikeHometchko? Так работают многие одностраничные приложения. – JayC

ответ

3

В целом, это хороший способ делать вещи. Я предполагаю, что вы обновляете страницу с помощью AJAX каждый раз (хотя вы этого не говорили).

Есть некоторые вещи, на которые нужно обратить внимание. Если у вас всегда есть один и тот же URL-адрес, ваши пользователи не могут вернуться к тому же страница. И они не могут отправлять ссылки своим друзьям. Чтобы справиться с этим, вы можете использовать history.pushState() для обновления URL без перезагрузки страницы.

Кроме того, если вы отправляете более одного запроса на страницу и у вас нет структуры HTML, ожидающей их, вы можете вернуть их в другом порядке каждый раз. Это не проблема, просто то, что нужно знать.

Возврат HTML из AJAX - плохая идея. Это означает, что когда вы хотите изменить макет страницы, вам нужно отредактировать все ваши файлы. Если вы возвращаете JSON, гораздо проще вносить изменения в одно место.

+0

Я не думаю, что вопрос заключается в том, что метод AJAX является хорошим или плохим, но более подробно о загрузке html-файла через ajax или dom-элементы из файла. – Martijn

+0

@Martijn Хммм. Я думаю, ты, возможно, прав. – ColBeseder

1

Если вы заботитесь о SEO, вам нужен HTML-код на странице загрузки, что ближе к вашей второй стратегии, чем ваша первая.

Обновление от мая 2014 года: Google утверждает, что становится лучше при выполнении Javascript: http://googlewebmastercentral.blogspot.com/2014/05/understanding-web-pages-better.html Пока неясно, что работает, а что нет.

Дальнейшие обновления, вероятно, принадлежат здесь: Do Google or other search engines execute JavaScript?

1

Я думаю, что вы можете рассмотреть 3 метода:

  • Отправка только JSON клиенту и предоставление в соответствии с шаблоном (т.е. handlerbar.js)

  • Создание страниц с серверной стороны, как правило, более быстрое рендеринг, вы также можете кэшировать страницу.

  • Или смесь этого будет состоять в том, чтобы генерировать частичные виды с сервера и отправлять их клиенту, например, это похоже на наличие шаблона на клиенте и использование данных из JSON, но только с тем же шаблона на стороне сервера и рендеринга его на сервере и отправки его клиенту в конечном формате, на клиенте вы можете просто заменить частичные виды.

Кроме того, некоторые вещи, чтобы думать о том, определяется использованием случае Applicaton, является то, что если вы ориентируетесь SEO вы должны рассмотреть советы ColBeseder, от того, если вы ориентируетесь мобильных пользователей, вероятно, вы бы лучше пойти с JSON только ответ, так как это более легкий ответ.

EDIT:

Согласно тому, что вы сказали, что вы создаете одно приложение страницы, если это правильно, то, возможно, вы можете пойти с либо JSON или частичным видом на как AngularJS есть. Но если ваша серверная логика написана для обработки только ответа JSON, то, вероятно, вы можете лучше использовать механизм шаблона на клиенте, например handlerbar.js, underscore или jquery templates, и вы можете определить многократно используемые части вашего HTML и применить к нему данные от JSON.

2

Одна вещь, которая определенно имеет значение:

Как долго он будет считать вас разработать новую систему, которая будет посылать данные в JSON + коде JS, необходимые для введения его в HTML на странице?

Сколько времени потребуется, чтобы просто вернуть HTML? И как долго, если вы можете повторно использовать часть уже существующего кода на стороне сервера?

и проверить, насколько это на стороне сервера interrection ваших страниц ...

также некоторые преимущества создания чистого HTML:

1) Это простая разметка, и часто столь же компактным или на самом деле более компактным чем JSON.

2) Это меньше подвержено ошибкам, потому что все, что вы получаете, это разметка, и никакого кода.

3) В большинстве случаев программа будет быстрее запрограммировать, потому что вам не придется писать код отдельно для конца клиента.

4) HTML - это контент, JavaScript - это поведение. Вы смешаете оба без всякой веской причины.

в JavaScript или NAY другой язык сценариев .. если вы столкнулись с проблемой между остальной код не будет работать

, а также легче отлаживать в чистых страниц HTML

мое мнение. .. используйте скриптовый код везде, где это необходимо. Остальная часть кода, который вы можете сделать в html ... , сохранит триптим перехода на сервер, затем извлечет данные и снова отобразит их.

Держите пункт № 4 в своем уме во время кодирования.

Смежные вопросы