Клиентская сторона против шаблонов на стороне сервера (какой?)

В последнее время я читал очень интересные статьи о рендеринге всего клиента и сервера.

http://www.onebigfluke.com/2015/01/experimentally-verified-why-client-side.html

http://www.quirksmode.org/blog/archives/2015/01/angular_and_tem.html

http://tomdale.net/2015/02/youre-missing-the-point-of-server-side-rendered-javascript-apps/

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

  • 1) Вы можете обновить свой сервер, но не ваше пользовательское устройство. Это значит, что да... вы контролируете сервер, поэтому, если он будет выполнять вас может выбрать обновление/масштабирование. Вы не можете заставить пользователей обновлять свои устройства.

  • 2) Первая краска против последней краски. Теперь по ссылке experimentally verified... выше показано, когда пользователи сначала видят страницу (первая краска) и когда пользователи могут использовать страницу 100% (последняя краска), Теперь из того, что я могу придумать, когда пользователь видит эту страницу, требуется некоторое время, чтобы обработать сигналы от зрительной коры до лобной коры, а затем до предгорной коры, где пользователь на самом деле начинает нажимать на свой палец, что конечно, если html визуализируется первым, поэтому мозг должен что-то обрабатывать, пока загрузка происходит в фоновом режиме (файлы js, привязка и т.д.).

То, что действительно получило меня, было то, что в twitter сообщалось, что люди имеют до 10 секунд времени загрузки для рендеринга на стороне клиента, никто не должен когда-либо испытывать это! Это вроде как сказать: "Хорошо, если у вас недостаточно устройства, извините, вам просто нужно подождать".

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

В любом случае, поделитесь своими мыслями о моих высказываниях и статьях, если хотите. Я все уши!

Ответы

Ответ 1

В основном вы смотрите на изоморфное веб-приложение, которое имеет один и тот же код для интерфейса и бэкэнд.

Изоморфный JavaScript

Приложения JavaScript, которые работают как на стороне клиента, так и на стороне сервера. Изоморфные рамки JavaScript являются следующим шагом в эволюции JavaScript-фреймворков. Эти новые библиотеки и фреймворки решают проблемы, связанные с традиционными фреймворками JavaScript.

Я ставлю этот парень объясняет, что намного лучше, что я.

введите описание изображения здесь

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

Итак, ПОЧЕМУ Я ПОМОЧЬ?

  • Старые браузеры/Слабые устройства/Отключено Javascript
  • SEO
  • Некоторые улучшения загрузки страницы.

Старые браузеры/Слабые устройства/Отключено Javascript

Например, IE9 не поддерживает API истории. Итак, для старых браузеров (и если пользователь отключает JavaScript), они просто будут перемещаться по страницам так же, как они делали это в старые добрые времена.

SEO

Google говорит он поддерживает SPA, но SPA вряд ли появятся в лучших результатах поиска Google, не так ли?

Скорость страницы

Как было сказано, первая страница загружается с одним HTTP-запросом и все.

ОК, поэтому

Есть много статей по этому поводу:

Но СЛЕДУЕТ ЛИ УХОДИТЬ?

Это вам, конечно.

Да, это круто, но для перезаписи/адаптации существующего приложения требуется много работы. И если ваш backend находится в PHP/Ruby/Python/Java/Что бы ни случилось, у меня плохие новости для вас (это не обязательно невозможно, но близко к этому).

Это зависит от веб-сайта, вы можете попытаться собрать некоторую статистику, и если процент пользователей со старыми устройствами мал, это не стоит проблем, так почему бы не...

ПОЗВОНИТЬ СЕМЬЮ

Если вы заботитесь только о пользователях со старыми устройствами, то c'mon, 2015, и это ваша проблема с пользователем, если он использует IE8 для просмотра веб-сайтов с iPod Touch 2. Например, Angular потеряла поддержку IE8 в 1.3 примерно год назад, так почему бы вам просто не предупредить пользователей, что им нужно обновить;)

Ура!

Ответ 2

Все разговоры по этой теме пропускают одну точку. Байты отправляются клиенту. Страницы, отображаемые как HTML на сервере, намного меньше. Меньше переданных байтов лучше для всех, как для сервера, так и для клиента. Я видел затраты на пропускную способность на облачных сайтах, и даже уменьшение на 10% может стать огромной экономией. Страницы JS на стороне клиента всегда жирны.