FF perf issue

BlcWithLeftTreeTest4.java

package com.sencha.gxt.test.client.blc;

import com.google.gwt.user.client.ui.FlowPanel;
import com.google.gwt.user.client.ui.HTML;
import com.google.gwt.user.client.ui.IsWidget;
import com.google.gwt.user.client.ui.RootPanel;
import com.google.gwt.user.client.ui.Widget;
import com.sencha.gxt.core.client.util.Margins;
import com.sencha.gxt.test.client.blc.cust.RowWidget;
import com.sencha.gxt.widget.core.client.ContentPanel;
import com.sencha.gxt.widget.core.client.container.BorderLayoutContainer;
import com.sencha.gxt.widget.core.client.container.BorderLayoutContainer.BorderLayoutData;
import com.sencha.gxt.widget.core.client.container.MarginData;
import com.sencha.gxt.widget.core.client.container.SimpleContainer;
import com.sencha.gxt.widget.core.client.container.Viewport;

public class BlcWithLeftTreeTest4 {

  private ContentPanel center;
  private ContentPanel west;

  public BlcWithLeftTreeTest4() {
    Viewport vp = new Viewport();
    RootPanel.get().add(vp);
    vp.add(getBlc());
  }

  
  private IsWidget getBlc() {
    SimpleContainer centerContainer = new SimpleContainer();
    centerContainer.setBorders(true);

    center = new ContentPanel();
    center.setHeadingText("Center");
    center.add(centerContainer, new MarginData(10));

    west = new ContentPanel();
    west.setHeadingText("West");
    west.add(new HTML("abc"));

    final BorderLayoutContainer blc = new BorderLayoutContainer();
    blc.setWestWidget(west, getLayoutDataWest());
    blc.setCenterWidget(createCenter(), new MarginData(10));

    SimpleContainer container = new SimpleContainer();
    container.add(blc);

    return container;
  }

  public BorderLayoutData getLayoutDataOuter() {
    BorderLayoutData layoutData = new BorderLayoutData(200);
    layoutData.setSplit(true);
    layoutData.setCollapsible(true);

    return layoutData;
  }

  private BorderLayoutData getLayoutDataWest() {
    BorderLayoutData layoutData = new BorderLayoutData(200);
    layoutData.setSplit(true);
    layoutData.setCollapsible(true);
    layoutData.setMargins(new Margins(0, 0, 0, 5));

    return layoutData;
  }

  private Widget createCenter() {
    FlowPanel vp = new FlowPanel();

    for (int i = 0; i < 25; i++) {
      vp.add(addHtml(i));
    }

    ContentPanel cp = new ContentPanel();
    cp.setWidget(vp);

    return cp;
  }

  private Widget addHtml(int index) {
    String s = "asdf asdf as dfas df asdf asd fas df asdf asd f";

    for (int i = 0; i < 9; i++) {
      s += s;
    }
   
    RowWidget rowWidget = new RowWidget();
    rowWidget.setText(s);

    return rowWidget;
  }

}

RowWidget.java

package com.sencha.gxt.test.client.blc.cust;

import com.google.gwt.core.client.GWT;
import com.google.gwt.uibinder.client.UiBinder;
import com.google.gwt.uibinder.client.UiField;
import com.google.gwt.user.client.ui.Composite;
import com.google.gwt.user.client.ui.HTML;
import com.google.gwt.user.client.ui.Widget;

public class RowWidget extends Composite {

  private static RowWidgetUiBinder uiBinder = GWT.create(RowWidgetUiBinder.class);

  interface RowWidgetUiBinder extends UiBinder<Widget, RowWidget> {
  }
  
  @UiField
  HTML orText;

  public RowWidget() {
    initWidget(uiBinder.createAndBindUi(this));
  }
  
  public void setText(String text) {
    orText.setText(text);
  }

}

RowWidget.ui.xml

<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">
<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
	xmlns:g="urn:import:com.google.gwt.user.client.ui">
	<ui:style>
		.outer{
			width:100%;
			padding: 5px
		}
		.textBox{
			width: 40px;
		}
		.imageContainer {
			width: 150px;
			height: 150px;
		}
		.imageContainer img {
			cursor: pointer;
			max-width: 150px;
			max-height: 150px;
			height: auto;
			width: auto;	
			border: 1px solid black;		
		}
		.textArea{
			height: 150px;
			margin-left: 5px;
			word-break: break-all;
			word-break: break-word;
			word-wrap:break-word;
		}
	</ui:style>
	<g:HTMLPanel width="100%">
		<g:HorizontalPanel ui:field="studentInfoHPanel" styleName="{style.outer}" >
			<g:cell horizontalAlignment="ALIGN_LEFT" verticalAlignment="ALIGN_MIDDLE" width="25%">
				<g:HTML ui:field="studentName"  />
			</g:cell>
			<g:cell horizontalAlignment="ALIGN_RIGHT" verticalAlignment="ALIGN_MIDDLE">
				<g:Label text="Illustration:" />
			</g:cell>
			<g:cell horizontalAlignment="ALIGN_LEFT" verticalAlignment="ALIGN_MIDDLE">
				<g:TextBox ui:field="drawingScore" styleName="{style.textBox}"/>
			</g:cell>
			<g:cell horizontalAlignment="ALIGN_RIGHT" verticalAlignment="ALIGN_MIDDLE">
				<g:Label text="Text:" />
			</g:cell>
			<g:cell horizontalAlignment="ALIGN_LEFT" verticalAlignment="ALIGN_MIDDLE">
				<g:TextBox ui:field="textScore" styleName="{style.textBox}"/>
			</g:cell>
			<g:cell horizontalAlignment="ALIGN_RIGHT" verticalAlignment="ALIGN_MIDDLE">
				<g:Label text="Results:" />
			</g:cell>
			<g:cell horizontalAlignment="ALIGN_LEFT" verticalAlignment="ALIGN_MIDDLE">
				<g:TextBox ui:field="resultScore" enabled="false" styleName="{style.textBox}" />
			</g:cell>
		</g:HorizontalPanel>
		<g:HorizontalPanel ui:field="orHPanel" styleName="{style.outer}" >
			<g:cell width="150px">
				<g:SimplePanel styleName="{style.imageContainer}">
					<g:Image ui:field="imageDraw" />
				</g:SimplePanel>
			</g:cell>
			<g:ScrollPanel ui:field="textSPanel" styleName="{style.textArea}" >
				<g:HTML ui:field="orText"  styleName="{style.textArea}"/>
			</g:ScrollPanel>
			
		</g:HorizontalPanel>
	</g:HTMLPanel>
</ui:UiBinder>