View takes too long to render - ajax

I have to fill a partial view with a lot of data. I first do an ajax call on the server:
$.ajax({
url: '/Monitoring/_Thresholds?workspaceID=' + workspaceID,
type: "POST",
data: new FormData(form),
cache: false,
contentType: false,
processData: false,
}).success(function (result) {
resultsDiv.innerHTML = result;
}).error(function (response) {
resultsDiv.innerHTML = response.responseText;
});
However due to the large number of data it takes too long to do this and I get:
HTTP Error 502.3 - Bad Gateway
The specified CGI application encountered an error and the server
terminated the process.
Most likely causes:
The CGI application did not return a valid set of HTTP errors.
A server acting as a proxy or gateway was unable to process the request due to an error in a parent gateway.
Things you can try:
Use DebugDiag to troubleshoot the CGI application.
Determine if a proxy or gateway is responsible for this error.
The BL stuff takes 2-3 seconds but rendering the view a lot more.
Is there any way to solve this?

There's a known performance issue in rc1-final rendering large views.
Fix ready for rc2. Try to make the view smaller I guess.

Related

ajax call timeout with 502 error

We have a report where it will pull data from server with jQuery ajax call, since data growing, server taking long time to return the data but after 30secs request getting timeout with 502 error. Kindly let me know alternatives to get data in 1-5mins without getting timeout.
502's are usually thrown server-side, i.e. the server, or something in-between such as a proxy, is temporarily overloaded.
Not usually something that is controllable on the clientside (apart from retrying, but that's usually not the best option)
Is there a timeout on the server itself?
Try This
$.ajax({
type:"POST",
url:"data.php",
data:dataString,
timeout:5000,
success: function(response) {
alert(response);
},
});
Note: timeout:5000,

How to set a timeout on a Primefaces ajax request?

I ame facing issues with Primefaces Ajax requests where the Server does not respond for a longer time (say 30 seconds). In that case, it seems that the Ajax request is running into a timeout (either the browser or the Network stack times out). Essentially, what happens then is that the Ajax Animation (that turning circle) runs indefinitely (even if the Response arrives after that time, it does not get considered).
Since users reported to face that Kind of issue espacially during mobile usage, I started to investigate further. To reproduce, I use fiddler and set the oSession["response-trickle-delay"] = "30000";
I tried to search on Google and Stackoverflow but most of the other questions seem to be related to session timeout. There, the proposed solution is to implement an exception handler on the Server. In my case though, there is no session timeout.
I assume that in all the cases where it Comes to a request timeout, poor Network is the cause. Therefore, I rather would want to set something like a timeout on the cient side to tell the application to stop waiting for the Response to return.
I know that in jquery something like this can be done with the following code. Is there an equivalent Approach for Primefaces?
$.ajax({
url: "/your_ajax_method/",
type: "GET",
dataType: "json",
timeout: 3000,
success: function(response) { alert(response); },
error: function(jqXHR, textStatus, errorThrown) {... }
});​
Thanks!

AJAX Requests and Connection Timeout: Chrome doesn't timeout after over 15 hours, but what about IE?

I am writing a web application that takes a script input from a client-side browser and sends it to a Java servlet through AJAX. Upon receiving the script, the Java class executes the script and sends some information back to the web page.
An important component of the web application that I am testing right now is the connection timeout and when/if a browser connection will timeout after long periods of time. For me, it is important that the connection does NOT timeout before the Java servlet sends a response, or at least the timeout should be handled.
I have researched ways of handling this and I have a vague understanding of what needs to be done, but first thing is first, I decided to try to get the connection to timeout in order to understand how everything will behave WITHOUT any sort of error handling. Yesterday, I sent the servlet a command from the script input of the client-side which told the servlet to sleep until this morning. I come back this morning to find that in Chrome, the servlet response was successfully received and happily showing itself in the browser.
In IE7, I did not have as much luck :(
After over 15 hours of waiting on a response, IE7 timed out and Chrome did not. I figured either both would time out or neither would.
Also, it might be helpful to know that I am using Struts2 framework.
Can anyone explain this?
Thanks!
P.S. I tried to be as detailed as I could in my question explanation, but I will be happy to include any extra information. I also did not include code, because I did not think any would be relevant, but again, please tell me what code you'd want me to include if you'd like to see some.
Turns out that Chrome is just awesome and IE is not (surprise!). Here's what I am pretty sure happened:
On the ajax call, since no timeout was set, Chrome let the timeout default to 0 i.e. never timeout.
IE7 being the obnoxious browser that it is (and unfortunately the one I MUST develop for), didn't want that to happen, so it stuck with its registry-set default timeout of 60 minutes.
JQuery and AJAX made handling this error a breeze with a bit of longpolling, or at least what I understand to be longpolling. Here's what I did:
Initial AJAX Request (contained in a function):
$.ajax({
beforeSend: function() {
inUse = true;
disableInput();
},
url: "executeScript.do",
data: params,
dataType: "text",
type: "post",
success: function(responseText) {
onSuccess(responseText);
},
error: function(jqXHR, textStatus, errorThrown) {
if(textStatus == "timeout") {
pollServlet();
}
}
});
...
Longpolling(?)
function pollServlet() {
var params = "testID=" + document.getElementById("testIDValue").value;
$.ajax({
url: "servletQuery.do",
dataType: "text",
type: "post",
data: params,
success: function(response) {
if(!isNaN(parseInt(response, 10))) {
setTimeout(pollServlet, parseInt(response, 10));
} else {
onSuccess(response);
}
}
});
}
This works! One thing I noticed, however, is IE7 returns a textStatus of "error" on a timeout instead of "timeout"... odd!

JQuery Ajax call is taking much time

I am using JQuery ajax call which is perfectly running in local server. but when i deploy it on the actuall server. Ajax call is taking much time almost 1 second for every call [In some cases there is no data in return]. I am populating 5 dropdowns from Ajax call and it is taking 5 seconds which is very much. Please can anyone guide me towards the actuall solution. Thanks in Advanced.
Here is my code
function DropDownList() {
$.ajax({
data: '{}',
url: urlAddress + 'LoadDropDown',
contentType: "application/json; charset=utf-8",
async: false,
dataType: "json",
type: "POST"
success: OnSuccess,
error: OnError
});
}
The slow down maybe because of a number of reasons. It might be that the server is overloaded or that your internet bandwidth is slow. Since the response is fast on your local machine then slowdown is obviously not because of jQuery.
check the response time in firebug's net tab. also check the data returned from the server. it might be that the data returned might be taking too much time to process in your success method.
please avoid using remote jquery server like
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
instead u can download from source and use it like
<script src="JS/jquery-1.10.1.min.js"></script>
so only ajax and jquery functions and events will perform faster.

How to implement an ajax request queue using jQuery

What is the best way to implement an Ajax request queue using jQuery? Specifically, I want to accomplish the following:
A user triggers any number of Ajax requests within a web page, which need to be queued up and submitted sequentially.
The web page needs to receive responses from the server and adjust itself accordingly.
Finally, if an error occurs (connection lost, server failed to respond, etc.), I want jQuery to invoke a JavaScript function.
I'm struggling with the last requirement in particular, as the error handling mechanism in jQuery's Ajax functions is not very intuitive. Are there any examples/tutorials that could help me with this task?
Thanks!
I've made a few buffers like this. Some examples can be found simple task Buffer and deferred item queue.
As for error handling you can always use .ajaxError
jQuery ajax has an error attribute where you can attach a function and the method will only fire if an error occurs. See the below example:
jQuery.ajax({
type: "POST",
url: "url",
dataType:"json",
data:{},
success:function(data){
alert("Succeed!");
},
error:function (xhr, ajaxOptions, thrownError){
alert(xhr.status);
alert(thrownError);
}
});
I hope you find this helpful.

Resources