Обработка на стороне клиента или на стороне сервера?

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

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

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

Ответ 1

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

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

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

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

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

Удачи!

Ответ 2

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

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

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

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

Ответ 3

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

Ответ 4

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

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

Ответ 5

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

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

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

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

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

Ответ 6

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

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

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

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

короче.

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

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