Изменения частичного состояния для Vaadin's AbstractJavascriptComponent

Question

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

Я стараюсь, чтобы JS-сторона была как можно более «тупой», делегируя взаимодействие пользователя с сервером с помощью RPC и обновляя общее состояние. Затем вызывается функция обертки соединителя JS onStateChange с новым состоянием, что заставляет DOM обновляться соответствующим образом.

У меня есть 2 проблемы:

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

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

Должен ли я прекратить использование механизма общего состояния Vaadin и вместо этого использовать RPC для передачи изменений в состояние?

Update: Я делал некоторые испытания, и это, безусловно, представляется, что общий государственный механизм Vaadin является ужасен с точки зрения эффективности:

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

Есть некоторые проблемы с подходом RPC, которые необходимо будет устранить, например: если вы меняете значение несколько раз за один цикл запроса/ответа, вы не хотите делать вызов RPC несколько раз. Вместо этого вы хотите, чтобы только последнее значение отправлялось так же, как механизм общего состояния, только отправляет конечное состояние в ответ. Вы можете хранить грязные флажки для каждой части состояния, которую вы хотите отправить отдельно (или просто сохранить копию предыдущего состояния и сравнить), но затем вам нужно как-то вызвать вызов RPC в конце обработки запроса. Как это может быть сделано?

Любые идеи по этому поводу приветствуются!

Обновление 2:

Vaadin 8 фиксирует корневой выпуск: он посылает только измененные свойства состояния. Кроме того, он больше не вызывает onStateChange() на JS-коннекторе, когда только выполняет вызов RPC (и не меняет состояние).

Answer 1

OP правильный, заявив, что синхронизация общего состояния неэффективна для компонентов, основанных на AbstractJavaScriptComponent. Весь объект состояния сериализуется и становится доступным для метода onStateChange соединителя Javascript всякий раз, когда соединитель помечен как грязный. Другие компоненты, отличные от javascript, обрабатывают обновления состояния более разумно, только отправляя изменения. Точное место в коде, где это происходит, строка 97 в com.vaadin.server.LegacyCommunicationManager.java

boolean supportsDiffState = !JavaScriptConnectorState.class 
      .isAssignableFrom(stateType); 

Я не уверен, почему обновление состояния обрабатывается по-разному для AbstractJavaScriptComponent -На компонентов. Возможно, это упростить javascript-коннектор и удалить необходимость создания полного объекта состояния из дельт. Было бы здорово, если бы это можно было решить в будущей версии.

Как вы предлагаете, вы можете полностью отказаться от JavaScriptComponentState и полагаться на server-> client RPC для обновлений. Храните грязные флажки в своем серверном компоненте или сравните старое состояние и новое состояние любым необходимым вам механизмом.

Чтобы объединить изменения и отправить только один вызов RPC для каждого изменения, вы можете переопределить beforeClientResponse(boolean initial) в своем серверном компоненте. Это вызвано непосредственно перед отправкой ответа клиенту, и это ваш шанс добавить набор вызовов RPC для обновления клиентского компонента.

В качестве альтернативы, вы можете переопределить encodeState, где у вас есть свободное владение, чтобы отправлять именно те JSON, которые вам нравятся. Вы можете добавить список изменений в базовый объект JSON, возвращенный super.encodeSate. Ваш javascript-коннектор может интерпретироваться соответствующим образом в своем методе onStateChange.

Отредактировано для добавления: вызывающий getState() в своем серверном компоненте будет отмечать разъем как грязный. Если вы хотите получить состояние, не отметив его как грязное, используйте вместо этого getState(false).

Answer 2

Совместное состояние Vaadin работает точно так же, как вы хотите из коробки: когда компонент добавляется в DOM в первый раз, все общее состояние передается от сервера к клиенту, так что можно отображать компонент. После этого переносятся только изменения. Например, один изменяет заголовок видимого компонента, вызывая component.setCaption("new caption"), Vaadin передает этот новый текст заголовка клиенту и «объединяет» его с экземпляром общего состояния клиента на стороне клиента.

Answer 3

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

https://github.com/emuanalytics/vaadin-enhancedjavascript

Решение обманчиво проста: в основном повторного включения вычисления состояния разницу в обход этой строки кода в com.vaadin.server.LegacyCommunicationManager.java:

boolean supportsDiffState = !JavaScriptConnectorState.class 
     .isAssignableFrom(stateType); 

Реализация решения осложняется тем фактом, что Классы Vaadin не просто расширены, поэтому мне пришлось копировать и повторно реализовывать 6 классов.