2009-12-18 4 views
7

Sto utilizzando jQuery.getJSON (...) per effettuare una risposta di chiamata/processo per un set di dati leggermente grande. È previsto un tempo di risposta di un paio di secondi (c'è un grafico di caricamento animato per placare l'utente)."Interrompere l'esecuzione di questo script" - IE per richieste AJAX di grandi dimensioni

Tutto detto, il grafico di caricamento, la risposta, il processo, ecc. Funzionano perfettamente in tutti i browser. In Internet Explorer (6/7/8), tuttavia, viene visualizzato l'errore "Interrompi l'esecuzione di questo script". Se è consentito procedere, lo script termina senza alcun problema.

$(document).ready(function() { 
    $("#tree").treeview({ collapsed: true, animated: "slow" }); 
    $("#tree").hide(); 

    $("#loadingGraphic").fadeIn("slow"); 

    $.getJSON("mygenerichandler.ashx", function(data) { 
     //manipulate data and add to treeview 

     $("#loadingGraphic").fadeOut("slow", function() { 
      $("#tree").slideDown("slow"); 
     }); 
    }); 
}); 

Mi rendo conto che Internet Explorer ha una preferenza è possibile impostare tramite il registro di Windows, tuttavia, sono curioso come gli altri sviluppatori manico prevede risposte di grandi dimensioni o lenti di nuovo in una richiesta di AJAX.

+0

Il tuo albero deve essere mostruoso. –

+0

Sì, la gerarchia non è piccola. Questo in realtà mi ha fatto pensare al pigro caricamento di ogni albero figlio. –

+0

'for..in' in genere non è un buon modo per scorrere gli array. Anche per gli oggetti, si consiglia un controllo 'hasOwnProperty'. http://stackoverflow.com/questions/500504/javascript-for-in-with-arrays –

risposta

4

La notifica di script lento molto probabilmente non è per la richiesta effettiva, ma per lo script che si sta eseguendo per elaborare i dati ricevuti dalla richiesta. Questo potrebbe anche essere il codice jQuery che analizza il tuo JSON.

Se pubblichi il tuo script che sta "manipolando i dati" (cioè la porzione commentata nel tuo frammento di codice), potremmo forse aiutare a ottimizzarlo.

[Modifica] Hai ragione. Dovresti considerare il carico pigro dell'albero. Quanti nodi radice hai di solito? Potresti avere un po 'di fortuna a prendere il appendTo() fuori dal giro. O costruisci l'intero HTML in un colpo solo e fai un enorme appendTo() o usa un div intermedio non collegato al DOM per accumulare i nodi e quindi aggiungere l'elemento principale #tree.

var tempDiv = $('<div></div>'); 
for (var i in data) { 
    tempDiv.append($(buildHierarchy(data[i])); 
} 
$("#tree").append(tempDiv); 
$("#tree").treeview({ add: tempDiv }); //don't know if this works? Maybe tempDiv.children() ? 
+0

Punto ben preso. Ho aggiornato lo snippet di script sopra con l'esempio completo del codice, anche se potrei aver bisogno di ristrutturare il modo in cui vengono fatte le richieste (cioè non popolare l'intero albero in una sola volta). –

0

Si potrebbe refactoring del codice in modo che hai chiamato setTimeout (0) prima di ogni chiamata ricorsiva in modo che l'interfaccia utente prende il controllo del filo e può essere sensibile. Google "setTimeout threading" per maggiori informazioni.

È inoltre possibile suddividere il set di dati di grandi dimensioni in blocchi gestiti da richieste successive. In IE8, potresti voler controllare che sia utilizzato il metodo nativo JSON.parse(), poiché è più veloce di un'implementazione JS.

2

Non è il momento della richiesta il problema. La richiesta è asincrona, quindi non c'è nessuno script in esecuzione mentre si attende la risposta.

È lo script che sta elaborando il risultato che sta impiegando troppo tempo. Inviarlo a una funzione che gestisce una parte dei dati, e si definisce utilizzando un timer per restituire il controllo al browser per un attimo:

function handleData(data, offset) { 
    // pick the next 1000 items or so: 
    var size = Math.min(1000, data.length - offset); 
    // process [offset .. offset+size-1] of the data 
    // ... 
    offset += size; 
    if (offset < data.length) { 
    window.setTimeout(function() { handleData(data, offset); }, 1); 
    } else { 
    $("#loadingGraphic").fadeOut("slow", function() { 
     $("#tree").slideDown("slow"); 
    }); 
    } 
} 

chiamarlo con:

$.getJSON("mygenerichandler.ashx", function(data) { 
    handleData(data, 0); 
}); 
4

La mia ipotesi è che non è il caricamento dei dati né l'elaborazione dei dati che stai facendo nel codice. Penso che sia la trasformazione dei dati JSON ricevuti tramite HTTP in un oggetto Javascript.

IE fondamentalmente fa un eval() per costruire un hash dai dati di stringa. Questo è molto, molto, molto inefficiente per le stringhe lunghe. Sospetto che ci sia un algoritmo Schlemiel the Painter. Ho avuto esattamente la stessa cosa un anno o due fa e l'ho risolto rimuovendo i dati inutilizzati o ridondanti dalla stringa JSON.

Se non riesci ad abbreviare la stringa rimuovendo gli elementi, puoi provare a tagliare la stringa sul server suddividendola in oggetti componente ("pagine" se lo desideri) e recuperarli uno ad uno . In questo modo non è necessario pagare la tassa di elaborazione inefficiente per le stringhe lunghe e elaborare invece alcune stringhe brevi.

+0

pensa che sia il mio problema –

Problemi correlati