2016-05-06 4 views
1

Предположим, у нас есть следующая ситуация: у нас есть блог с фидами сообщений. Когда страница загружается, должно быть уже загружено 3 <PostCard> s, созданное на стороне сервера; пользователь прокрутит вниз или нажмите Загрузите еще кнопку, а некоторые новые открытки должны быть динамически добавлены на страницу.Как успешно сочетать реализацию XHP и ReactJS компонента

У меня есть компонент XHP Hack <PostCard>, и у нас есть компонент ReactJS <PostCard>.

Итак, я должен:

  1. Реализовать все вещи на стороне клиента, в React и имеют render() метода, XHP компонента только constructReactInstance()? (В какой-то момент я сделал что-то подобное, но заметил, что на загрузке страницы есть некоторые задержки, что-то вроде «отставания»).
  2. Внедрите компонент дважды, как на стороне сервера, так и на стороне клиента? (Это полная боль ...)
  3. Что-то еще ...?

Я надеюсь, что я ясно и кто-то сможет мне помочь: smile_cat:

+1

Как справиться с этим - отличный вопрос, и я бы хотел, чтобы я знал достаточно для хорошего ответа для вас. Я попытаюсь заставить некоторых из моих коллег из FB написать что-то. Я понимаю, что мы в FB в основном делаем (1) для нетривиальных компонентов, но некоторые из наших более простых вещей, которые мы делаем (2), так как у нас есть хороший бит полностью обработанного сервером материала и нужны базовые компоненты на обоих языках. –

+0

@JoshWatzman, я с нетерпением жду ответа, о котором вы говорили. Спасибо за эту идею. Я попытался сделать (1), что связано с XHPJS, и я узнал, что репо для XHPJS устарело и не поддерживается. Я и многие другие люди по достоинству оценят некоторые обновления этого наверняка! – Victor

ответ

0

Там нет открытого источника решения, насколько мне известно, что делает Реагировать на сервере HHVM, так что вы собираетесь чтобы где-то торговать. То, как вы вызываете XHP RenderReactInstance, является одним из действительных решений для интеграции XHP и React, но вы будете страдать от воспринимаемого «запаздывания» при загрузке страницы, а затем анализирует и выполняет JS. Кэширование может помочь, но все равно придется разбирать и запускать JS. В качестве альтернативы, вы можете просто создать это компонент XHP и сохранить компоненты React для элементов с более мелкой детализацией. В частности, вам может потребоваться только отредактировать раздел комментария, если это преобладающий интерактивный компонент и что-то, что можно загрузить немного позже, чем что-либо еще. Это позволило бы размещать контент в блоге при загрузке страницы, но вам, возможно, придется написать другую не-React JS для обработки асинхронной загрузки новых компонентов. Это все компромисс, и я думаю, вам просто нужно определить, что вы считаете более важным для вас.

+0

Существует много поддержки для рендеринга с серверами. Http://facebook.github.io/react/docs/environments.html – Hamms

+0

Позвольте мне перефразировать, нет никакого открытого решения _Hack_ для рендеринга. Реагировать на сервере. Будет обновлен ответ. –

+0

[php-v8js] (http://php.net/manual/en/book.v8js.php) запуск демона nodejs, вероятно, будет довольно простым – Hamms

0

Конечно, есть среда для XHP и React JS. Вы можете найти то, что вам нужно здесь: https://github.com/hhvm/xhp-js

Вы можете сделать очень мощную вещь со всем этим вместе. Время адаптации требуется, но есть большой учебник, который делает какой-то парень в Facebook, и он хорошо объясняется: https://github.com/hhvm/xhp-js-example