Сокращение дерева / состояния компонента JSF альтернативным подходом.Это нормально? - PullRequest
Новая
       0

Сокращение дерева / состояния компонента JSF альтернативным подходом.Это нормально?

10 голосов
/ 15 марта 2012

К сожалению, я ошибся, выбрав JSF для интернет-приложения с высоким трафиком, теперь мне интересно, как улучшить масштабируемость этого веб-приложения JSF.

У меня есть страница JSF, которая отображаетбольшое количество предметов, каждый из которых может быть прокомментирован.Чтобы уменьшить состояние и улучшить производительность, я пытаюсь уменьшить число forms / commandButtons на странице.

1. Каким образом можно уменьшить компонентДерево / Statefulness JSF?Являются ли простые html-элементы (которые смешиваются между тегами jsf) также частью дерева компонентов?Я не знаю, как сохранение состояния компонента было полезным для моего приложения, поскольку при разработке приложения я следовал простой модели запросов / ответов (может быть, это полезно только для внутренних требований JSF)!?

2. Я думал о подходе, где вместо создания отдельного <h:form> (каждый с отдельным commandButton) для каждого элемента, как показано ниже,

(Обычный подход) 

<h:form> <!-- for each item a separately -->
      <h:outputText value="Add comment"/>
      <h:inputTextarea value="#{itemController.comment}"  required="true"/>

      <p:commandButton actionListener="#{itemController.addUserComment(123)}" value="Add" />
</h:form>

(альтернативный подход)

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

<form>
   <input id="item1_comment"/>
   <button onclick="addComment(123, 'item1_comment');"/>  
</form>    

<script type="text/javascript">
    function addComment(itemId, id) {
        $('#comment_in').attr('value', $('#'+id).attr('value'));
        $('#forItem_in').attr('value', itemId);
        addComment_RC(); // call remoteCommand to show the content in dialog
    }
</script>

<h:form prependId="false" >  <!-- for all items, just single remoteCOmmand -->
    <h:inputHidden id="comment_in" value="#{itemController.comment}"/>
    <h:inputHidden id="forItem_in" value="#{itemController.forItem}"/>
    <p:remoteCommand name="addComment_RC" process="@form" actionListener="#{itemController.addComment()}" />
</h:form>

Лучше сделать это таким образом (или есть какие-то проблемы с этим подходом)?

1 Ответ

6 голосов
/ 16 марта 2012

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

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

Поместите все элементы в одну форму.Поля комментариев не связаны.

  <h:form>

       // first element 
       <h:outputText value=#{first element}
       // first comment 
       <h:inputTextarea id="comment1"/> <-- notice there is no EL expression 
                                            But we use a unique id for each comment 

       // second element 
       <h:outputText value=#{second element}
       // second comment 
       <h:inputTextarea id="comment2"/> 
       .
       .
       .



</h:form>

Отсюда вы можете либо

1. после каждого события размытия в любом из полей комментариев, ajax сервер и передатьв качестве параметров комментарий и id комментария, из которого был сделан вызов ajax.на сервере обновите свою модель соответственно

Или Вы также можете собрать все комментарии на стороне клиента и отправить их на сервер одновременно.

2. Когдапользователь нажимает кнопку отправки, вызывая функцию js, чтобы объединить все комментарии в структуру, которую вы сможете легко проанализировать на стороне сервера (т. е. "{c1,comment a};{c2,comment b};{c5=,comment e}...").передайте эту строку на сервер, проанализируйте ее и обновите вашу модель соответствующим образом.

3. после каждого события размытия в любом из полей комментария вызовите функцию js, которая обновляет скрытое поле.

<h:inputHidden value="{myClass.allComments}" />

, когда пользователь отправляет форму, анализирует allComments и соответственно обновляет вашу модель.

РЕДАКТИРОВАТЬ:

Для решения общей проблемы производительности IДобавил рекомендации из статьи, которая мне показалась полезной ускорить часть 1 ускорить часть 2 .

Надеюсь, это поможет

кстати, ярекомендовал бы первый подход, а не последние два.

...