рендеринг стороны сервера в AngularJS [дубликат]
Если два словаря содержат одни и те же ключи, но в другом порядке, должны ли они считаться равными? Если нет, то словари должны сравниваться путем запуска счетчиков через оба одновременно. Это, вероятно, будет быстрее, чем перечисление через один словарь и поиск каждого элемента в другом. Если у вас есть предварительное знание о том, что равные словари будут иметь свои элементы в одном порядке, такая двойная перепись, вероятно, способ пойти.
10 ответов
Я тоже ищу решение. Но это не вариант использования браузера для рендеринга html на сервере и отправки его в интерфейс. Airbnb сначала попробуйте, но отклонится, потому что медленный и ресурсный голод. Это не производственное решение.
Обновление: это скоро возможно с введением Object.observe;)
-
1В большинстве случаев рендеринг на стороне сервера будет использоваться для роботов и некоторых особых случаев, поэтому влияние производительности сервера будет пренебрежимо. Также «рендеринг» на стороне сервера - это просто обработка шаблона html, без фактического рендеринга (который является самым голодным процессором), что в любом случае происходит на стороне клиента. – setec 2 November 2014 в 09:45
-
2обычно вы хотите сделать рендеринг на стороне сервера при начальной загрузке. поэтому пользователь x отправляется на страницу списка, впервые посещая приложение. возможно, они закрыли браузер и снова открыли его. вместо того, чтобы загружать приложение, а затем делать еще один http-запрос для данных, сервер может просто сделать все это для нас при первом запуске. другая очень полезная причина для этого - для ботов в поисковых системах. не все из них столь же умны, как и боты Google, и не имеют собственных компиляторов javascript. – jemiloii 3 March 2016 в 00:06
-
3Время рендеринга имеет значение для ботов Google Adwords, которые используют время загрузки в качестве фактора качества целевой страницы . Я обнаружил, что даже безгласные браузеры, такие как PhantomJS, генерируют значительную нагрузку на ЦП. – Edward Newell 13 September 2016 в 17:17
Я знаю, что это немного поздний ответ, angular.js-server ( https://github.com/a-lucas/angular.js-server ) использует модифицированную версию углового который запускает незанятое состояние, необходимое для обнаружения, когда обрабатываются все запросы ajax и события компиляции.
Мне удалось предварительно визуализировать стек mean.js практически без изменений.
Этот новый пакет https://github.com/a-lucas/angular.js-server позволяет предварительно обработать угловое приложение и отправить HTML клиенту, который затем выполнит jS-код.
Он поддерживает кэширование на URL-адрес, и вы можете определить правила для активации предварительного рендеринга URL.
PS: Я являюсь основным источником этого пакета.
AngularJS 2.0 также может работать на сервере. Vojta Jina рассказывает об этом на шоу «JavaScript Jabber» # 109 - http://javascriptjabber.com/109-jsj-dependency-injection-in-javascript-with-vojta-jina-misko-hevery/ (32:30 в плейере). Существует ссылка на новый модуль инъекции AngularJS ' https://github.com/angular/di.js .
Один из подходов - направить HTML-запросы на сервер nodejs, на котором запущены phantomjs. Я использовал подход, основанный на phantomjs. Проверьте это, если он решает
http://himangshu.io/blog/optimizing-single-page-application-using-prerender/
@ dai-shi создал connect-prerenderer, см. здесь . Еще несколько вопросов, но, надеюсь, хорошее начало
-
1
Надеюсь, он все равно может помочь кому-то, но вот пакет npm, который я создал:
-
1Можете ли вы дать больше объяснений, как он узнает, когда трубопровод angularjs перестает работать? – IamStalker 18 December 2015 в 21:33
Вот еще одно решение: https://github.com/ithkuil/angular-on-server
wiki для получения дополнительной информации
AngularJS работает с контекстом jsdom без каких-либо трюков. Просто добавьте angular.js в список js src и главную страницу углового приложения к jsdom по его инициализации.
Итак, рендеринг очень прост: используйте угловое значение в jsdom, и оно работает.
Один из способов - изменение пакетной синхронизации DOM.
Чтобы получать динамические обновления от сервера к клиенту, вы можете использовать MutationEvents (к сожалению, jsdom does't поддержка MutationObservers, но MutationEvents работают довольно быстро). Используйте их, чтобы складывать изменения DOM в массиве накопителей и периодически нажимать их на клиентский браузер (скажем, за 25 мс).
Также, чтобы включить пользовательские события, вы должны отслеживать их по документам в браузере и схожих накопителях и нажмите их на сервер.
Одной из реализаций такого подхода является jsdom-sync ( https://www.npmjs.org/package/jsdom-sync )
Недостатком рендеринга на стороне сервера является отсутствие размера модели окна DOM, поскольку для получения ширины / высоты элемента он должен быть фактически отображен. Это решение вряд ли подходит для svg и т. Д.
Также вы можете рассмотреть возможность просмотра модели области и синхронизацию ее с областями на стороне браузера, но это совершенно другая история.
Это не работает, но я работал над простым сервером PhantomJS для Heorku , который будет анализировать любой клиентский JS. Я использую его специально для Angular и Rails для подачи HTML-запросов на бот.