Итак, я новичок в динамическом веб-дизайне (мои сайты были в основном статичными с некоторым PHP), и я пытаюсь изучить новейшие технологии в веб-разработке (которая, кажется, AJAX), и мне было интересно, если вы Передача большого количества данных, лучше ли построить страницу на сервере и «протолкнуть» ее пользователю, или лучше «вытянуть» необходимые данные и создать HTML-код на стороне клиента с помощью JavaScript?

Точнее говоря, я использую CodeIgniter в качестве своей PHP-среды и jQuery для JavaScript, и если бы я хотел отобразить таблицу данных для пользователя (динамически), было бы лучше отформатировать HTML с помощью CodeIgniter (создать таблицы, добавить классы CSS к элементам и т. д.), или было бы лучше просто обработать необработанные данные с помощью JSON, а затем встроить их в таблицу с помощью jQuery? Моя интуиция говорит, что делать это нужно на стороне клиента, так как это сэкономило бы пропускную способность, и страница, вероятно, загружалась бы быстрее с новыми оптимизациями JavaScript, которые есть у всех этих браузеров, однако, тогда сайт сломался бы для того, кто не использует JavaScript ...

Спасибо за помощь

17
Nick 17 Июн 2010 в 21:29

6 ответов

Лучший ответ

Поздравляем с переходом на динамические сайты! Я бы сказал, что для выполнения клиентской разметки должны быть выполнены следующие условия (само собой разумеется, что вы всегда должны делать такие вещи, как фильтрация запросов к БД и управление правами доступа на стороне сервера):

  • Браузер клиента и возможности подключения к нему в большинстве случаев не работают
  • SEO и мобильные / устаревшие браузеры не представляют серьезной проблемы (гораздо проще, когда вы синтезируете серверную часть HTML)

Даже тогда выполнение клиентской разметки значительно усложняет тестирование. Это также вызывает довольно неприятные проблемы с синхронизацией. С сайтом AJAX, который загружает партиалы, если часть страницы испортится, вы, возможно, никогда об этом не узнаете, но при обычной компоновке на стороне сервера вся страница перезагружается при каждом запросе. Это также добавляет дополнительные проблемы к обработке ошибок / тайм-аутов, обработке сессий / файлов cookie, кешированию и навигации (браузер назад / вперед).

Наконец, немного сложнее создать URL-адреса perma на случай, если кто-то захочет поделиться ссылкой со своими друзьями или добавить в закладки ссылку для себя. Я обхожу обходной путь в своем блоге здесь, или у вас может быть выдающийся " постоянная ссылка ", которая отображает динамически отображаемую постоянную ссылку.

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

Удачи!

9
Steven 17 Июн 2010 в 17:46

Вы получили компромисс правильно. Однако имейте в виду, что вы можете активировать сжатие на стороне сервера, что, вероятно, приведет к добавлению повторяющейся разметки для форматирования таблицы с небольшой пропускной способностью.

Имейте также в виду, что написание Javascript, который работает во всех браузерах (включая портативные), сложнее, чем в PHP на одной и той же стороне сервера. И не забывайте, что «новые JavaScript-оптимизации» не относятся в той же степени к браузерам портативных устройств.

2
Artefacto 17 Июн 2010 в 17:35

намного лучше выполнять тяжелую работу на стороне сервера.

В CodeIgniter вы создаете представление, циклически перебирая все строки в таблице, добавляя в классы или все, что вам нужно. нет причин вообще делать это в Javascript.

Javascript - это плохо используемый язык с неудачным синтаксисом. С какой стати вы захотите загрузить страницу, а затем выполнить AJAX-вызов для загрузки некоторых объектов JSON, чтобы вставить их в таблицу, мне не под силу. Существует мало причин для этого.

Javascript (и JQuery) для улучшения конечного пользователя. Заставь вещи скользить, мигать, исчезать! Он не для обработки данных даже при самых низких нагрузках. Для конечного пользователя это будет чушь, потому что вы полагаетесь на его машину для обработки всех данных, когда у вас есть сервер, который обладает бесконечно большими возможностями и даже предназначен специально для этого .

5
Josh K 17 Июн 2010 в 18:14

Это зависит от вашего целевого рынка и цели вашего сайта.

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

На сайтах, где важна поддержка no-js (общедоступные сайты и т. Д.), У вас могут быть запасные варианты на сервере. Вы заканчиваете тем, что удваиваете код в этих ситуациях, но выгоды очень полезны.

Для продвинутых веб-приложений вы можете решить, стоит ли делать требование JS потерей (очень) небольшого числа пользователей. Для меня, если у меня есть некоторый контроль над целевым рынком, я делаю это требованием и иду дальше. Почти никогда имеет смысл потратить кучу времени на поддержку небольшого процента потенциальной аудитории. (Если только время не тратится на доступность , которая ОЧЕНЬ важна, независимо от того, сколько людей входит в эту группу на вашем сайте.)

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

2
Doug Neiner 17 Июн 2010 в 17:39

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

Делайте необработанные данные на стороне сервера, но используйте javascript для внесения любых необходимых вам изменений. такие как подкачка страниц, сортировка столбцов, чередование строк и т. д.

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

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

Короче говоря.

Необработанные данные: отправка на сервер клиенту необработанных данных в формате html (таблицы для структурированных данных таблиц, однако я делаю все остальное в div и других гибких тегах html, только таблицы для данных в виде столбцов / строк)

Форматирование данных: на стороне клиента, которое также включает в себя любые средства взаимодействия с данными. добавление к нему, удаление из него, сортировка по-разному и т. д. Это позволяет достичь двух вещей. SEO и пользовательский опыт (UX).

2
Jubair 18 Июн 2010 в 00:19

Лучше сделать как можно больше на стороне сервера, потому что 1) вы не знаете, будет ли на клиенте даже включен JavaScript, и 2) вы не знаете, как быстро будет выполняться обработка на стороне клиента. Если у них медленный компьютер, и вы заставляете их обрабатывать весь сайт, они будут довольно галочки. JavaScript / jQuery должен использоваться только для улучшения вашего сайта, а не для его обработки.

3
animuson 17 Июн 2010 в 17:32