First time load

[Neil]

I'm in a project where I'm replacing our silverlight image viewer with the RadImageEditor. I can get images to display but the first time I hit the page there is a very long (5-10 second) delay before the image first appears. Now if I hard code the imageurl to a particular file then it's nearly instant. But I am using the technique of handling the OnImageLoading event and manually setting the EditableImage to the image editor. I do this because I have a grid with rows and each grid selection causes the image editor to display a different preview.

Once the first image gets displayed, all subsequent image changes are nearly instant. Is there something I'm doing wrong that is causing the 5-10 second delay on first time page load? In debug the event gets fired and processed right away but it doesn't get displayed right away. Just default image editor settings, nothing specific.

In short this is what I'm doing:

private void DisplayFax()
{
    faxImage.ImageUrl = GetRandom();
}

protected void faxImage_OnImageLoading(object sender, ImageEditorLoadingEventArgs e)
{
    EditableImage img = new EditableImage(GetMemoryStreamOfFile());
    e.Image = img;
    e.Cancel = true;
}

The image editor is in an UpdatePanel set to conditional and all defaults:

<asp:UpdatePanel ID="previewFaxUpdatePanel" runat="server" UpdateMode="Conditional" RenderMode="Inline">
     <ContentTemplate>
          <telerik:RadImageEditor ID="faxImage" OnImageLoading="faxImage_OnImageLoading" runat="server" Width="100%" Height="100%" Skin="Windows7" />
     </ContentTemplate>
</asp:UpdatePanel>

Any advice? The silverlight viewer displays my image immediately and the customer won't accept a 5-10 second delay on first load.

[Neil]

OK, I think I figured out why it's going so slowly. When I use the width and height on the control with percentages (like 100%) the image editor slows down terribly. If I set a hard sizing the image snaps in place as I expected it. So I guess my only option is to resize in javascript to the relative size I need?

[Pero]

Hi Neil,

I tried to reproduce the problem with the source code you provided, but everything turned out OK. There is no difference in performance when the dimensions are set in percent values and when set in pixels. The image is loaded instantly. Would be possible to provide a live URL where we can observe the problem, and see what's causing the slowdown in performance?

This is the first time someone reports issues with application responsiveness caused by width and height set in percent values, and I'm not really sure what exactly might be the reason for this behavior.


All the best,
Pero
the Telerik team

[Neil]

Unfortunately it's a business intranet app. What I found is that in IE 9 if I specify a width in percentage then it would take 10-20 seconds for the image to show up. And if I don't use a position:absolute then Firefox 11 positions the viewport of the image weirdly (places it in the bottom half of the image control's div area) where IE 9 handles it fine.

It may be related to the div structure of the page. It's not too complicated a setup but essentially:

overall div
container div
header div
left div - fixed size
right div - unbounded but with a min width
footer fiv

There are a number of UpdatePanels with render inline around key controls. The ImageEditor is in a MultiView control.

[Niko]

Hello Neil,

Unfortunately I wasn't able to reproduce the slow loading of the ImageEditor, just as my colleague, Pero. Also note that there is no way that we would be able to perfectly reproduce your scenario. For that it would be best if you could come up with a separate sample runnable project that demonstrates the issue at hand. Until then we can only speculate on what may be causing your delay.
Also note that if you are using large images this may be a reason for a slow start, although this will be reproducible in all situations, not sporadically occurring.

Looking forward to your sample project and comments.

Kind regards,
Niko
the Telerik team