Проблемы с производительностью GXT - PullRequest
3 голосов
/ 19 мая 2010

Мы работаем над довольно сложной системой, использующей GXT. Хотя в FF все отлично работает, IE (особенно IE6) - это отдельная история (более 10 секунд, пока браузер отображает страницу).

Я понимаю, что одной из основных причин является манипулирование DOM, которое является катастрофой под IE6 (см. http://www.quirksmode.org/dom/innerhtml.html).

Считается, что это общая проблема интерфейсной среды Javascript (т.е. GWT), но простой код (см. Ниже), который выполняет те же функциональные доказательства в противном случае. На самом деле, под IE6 getSomeGWT () занимает 400 мс, а getSomeGXT () - 4 секунды. Это фактор x10, который сильно меняет пользовательский интерфейс !!!

private HorizontalPanel getSomeGWT() {
        HorizontalPanel pointsLogoPanel = new HorizontalPanel();
        for (int i=0; i<350; i++) {
            HorizontalPanel innerContainer = new HorizontalPanel();
            innerContainer.add(new Label("some GWT text"));
            pointsLogoPanel.add(innerContainer);
        }
        return pointsLogoPanel;
    }

    private LayoutContainer getSomeGXT() {
        LayoutContainer pointsLogoPanel = new LayoutContainer();
        pointsLogoPanel.setLayoutOnChange(true);
        for (int i=0; i<350; i++) {
            LayoutContainer innerContainer = new LayoutContainer();
            innerContainer.add(new Text("just some text"));
            pointsLogoPanel.add(innerContainer);
        }
        return pointsLogoPanel;
    }

Таким образом, чтобы решить / смягчить проблему, нужно - а. Уменьшить количество манипуляций с DOM; или же б. Замените их на innerHTML.

AFAIK, (a) это просто побочный эффект от использования GXT, а (b) возможно только с UiBinder, который еще не поддерживается GXT.

Есть идеи?

Заранее спасибо!

Ответы [ 2 ]

0 голосов
/ 05 июля 2012

Контейнеры макетов GXT являются более мощными, но они стоят дорого. Они могут быть довольно мощными, особенно при использовании макетов, таких как RowLayout и т. Д.

Мой первый вопрос: какие возможности вы хотите использовать для этих вложенных контейнеров? динамические размеры, расширенные возможности изменения размера / дозирования? Или достаточно контейнеров GWT или HTML?

Если вы решили использовать GXT Layout Containers, вам следует начать с отключения опции layoutOnChange. Поскольку включение этой опции вызывает дополнительную обработку каждый раз, когда вы добавляете дочерний элемент в контейнер, и потенциально заставляет браузер повторно визуализировать в этот момент времени.

Таким образом, если layoutOnChange отключен, просто вызовите layout () для pointsLogoPanel после цикла for. Хотя вы еще не добавили его в родительский контейнер, вы можете просто вызвать layout () для родительского контейнера после добавления pointsLogoPanel. Это не решит всех проблем с производительностью, но, вероятно, будет иметь большое значение.

0 голосов
/ 25 мая 2011

Я подозреваю, что это как-то связано с:

pointsLogoPanel.setLayoutOnChange(true);

Это приведет к вызову макета для каждого дополнительного компонента и может вызвать различия, которые вы видите.

...