Could someone please explain the significant difference in speed between a firefox updatepanel async postback and one performed in IE?
Average Firefox Postback Time For 500 objects: 1.183 Second
Average IE Postback Time For 500 objects: 0.295 Seconds
Using firebug I can see that the majority of this time in FireFox is spent on the server side. A total of 1.04 seconds.
Given this fact the only thing I can assume is causing this problem is the way that ASP.Net renders its controls between the two browsers.
Has anyone run into this problem before?
VB.Net Code
Protected Sub Button1_Click(ByVal sender As Object, ByVal e As EventArgs) Handles Button1.Click
GridView1.DataBind()
End Sub
Public Function GetStockList() As StockList
Dim res As New StockList
For l = 0 To 500
Dim x As New Stock With {.Description = "test", .ID = Guid.NewGuid}
res.Add(x)
Next
Return res
End Function
Public Class Stock
Private m_ID As Guid
Private m_Description As String
Public Sub New()
End Sub
Public Property ID() As Guid
Get
Return Me.m_ID
End Get
Set(ByVal value As Guid)
Me.m_ID = value
End Set
End Property
Public Property Description() As String
Get
Return Me.m_Description
End Get
Set(ByVal value As String)
Me.m_Description = value
End Set
End Property
End Class
Public Class StockList
Inherits List(Of Stock)
End Class
Markup
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<script type="text/javascript" language="Javascript">
function timestamp_class(this_current_time, this_start_time, this_end_time, this_time_difference) {
this.this_current_time = this_current_time;
this.this_start_time = this_start_time;
this.this_end_time = this_end_time;
this.this_time_difference = this_time_difference;
this.GetCurrentTime = GetCurrentTime;
this.StartTiming = StartTiming;
this.EndTiming = EndTiming;
}
//Get current time from date timestamp
function GetCurrentTime() {
var my_current_timestamp;
my_current_timestamp = new Date(); //stamp current date & time
return my_current_timestamp.getTime();
}
//Stamp current time as start time and reset display textbox
function StartTiming() {
this.this_start_time = GetCurrentTime(); //stamp current time
}
//Stamp current time as stop time, compute elapsed time difference and display in textbox
function EndTiming() {
this.this_end_time = GetCurrentTime(); //stamp current time
this.this_time_difference = (this.this_end_time - this.this_start_time) / 1000; //compute elapsed time
return this.this_time_difference;
}
//-->
</script>
<script type="text/javascript" language="javascript">
var time_object = new timestamp_class(0, 0, 0, 0); //create new time object and initialize it
Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequestHandler);
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
function BeginRequestHandler(sender, args) {
var elem = args.get_postBackElement();
ActivateAlertDiv('visible', 'divAsyncRequestTimer', elem.value + '');
time_object.StartTiming();
}
function EndRequestHandler(sender, args) {
ActivateAlertDiv('visible', 'divAsyncRequestTimer', '(' + time_object.EndTiming() + ' Seconds)');
}
function ActivateAlertDiv(visstring, elem, msg) {
var adiv = $get(elem);
adiv.style.visibility = visstring;
adiv.innerHTML = msg;
}
</script>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Button1" EventName="click" />
</Triggers>
<ContentTemplate>
<asp:Button ID="Button1" runat="server" Text="Button" />
<div id="divAsyncRequestTimer" style="font-size:small;">
</div>
<asp:GridView ID="GridView1" runat="server" DataSourceID="ObjectDataSource1" AutoGenerateColumns="False">
<Columns>
<asp:BoundField DataField="ID" HeaderText="ID" SortExpression="ID" />
<asp:BoundField DataField="Description" HeaderText="Description"
SortExpression="Description" />
</Columns>
</asp:GridView>
<asp:ObjectDataSource ID="ObjectDataSource1" runat="server"
SelectMethod="GetStockList" TypeName="WebApplication1._Default">
</asp:ObjectDataSource>
</ContentTemplate>
</asp:UpdatePanel>
</form>