Come ottimizzare le richieste Ajax in Jquery?

Question

Sto costruendo un'app mobile con jquery mobile, jquery e php back-end. Il mio problema è in alcune pagine Sto inviando e ricevendo più richieste Ajax che rallentano visibilmente le prestazioni e causano perdite di memoria che portano al crash dell'app in connessioni di rete basse

Quali sono i possibili modi di ottimizzare l'ajax richieste?

nota: - io mando alcune richieste ajax periodicamente (come una volta in un secondo) Alcuni ajax vengono inviati in base agli eventi

Answer 1

Prima di tutto, il codice Ajax scritto correttamente non perdere la memoria. Quindi, se si dispone effettivamente di una perdita, ciò è probabilmente causato da codice scritto in modo errato, non utilizzando Ajax.

Quindi, è possibile prendere in considerazione una serie di ottimizzazioni.

1. Combinare più richieste al server in una richiesta più grande. Ciò consente di risparmiare roundtrip sul server, risparmiare larghezza di banda, risparmiare batteria e aumentare le prestazioni.

2. Non eseguire il polling ogni secondo. Essere più intelligenti su quanto spesso si esegue il polling del server.

3. Allungare l'intervallo di polling per variare in base all'attività probabile, passare a "polling lungo" o passare a un webSocket in modo da poter eseguire push del server senza polling.

4. Analizzare cosa causa un eccessivo consumo di memoria e correggere bug o riprogettazione per ridurlo. Non c'è ragione per cui molte chiamate Ajax debbano "perdere" memoria. Masticherà la durata della batteria, ma non è necessario perdere memoria se codificata correttamente.

Oh, e non esitate a tirare su alcune applicazioni web di social alta scala che già esistono, aprire il debugger, passare alla scheda di rete e studiare il heck fuori di ciò che stanno facendo. Puoi anche imparare da app su vasta scala che hanno già risolto questo problema.

Answer 2

Inoltre, se si desidera creare un server di chat o inviare messaggi veloci al server, è necessario utilizzare webSockets come socket.io.

Answer 3

Qui ci sono alcune cose che potete fare

In primo luogo

• sbarazzarsi di tutte le perdite di memoria. Metti la tua applicazione in una sandbox e datti il ​​tempo più difficile che puoi per registrare eventuali perdite di memoria. Esaminali e correggi il tuo codice.

Poi

• Ridurre il numero di richieste. Ricercare attentamente le soglie migliori nella domanda e attivare solo le vostre richieste a tesi. Prova a raggruppare le tue richieste e inserirle in una singola richiesta ogni volta che è possibile.

• Utilizzare le richieste GET quando possibile. Sono relativamente semplici e agirebbero rapidamente.Questo passaggio è importante per un'applicazione che attiva molte richieste nel suo funzionamento.

• Scegliere con attenzione il formato dei dati. Potrebbe essere un testo semplice, JSON o XML. Scopri quello che ha l'impatto più basso sull'applicazione e passa a quello in modo appropriato. Configura il tuo server per utilizzare la compressione dei dati, se possibile.

• Ottimizza il server. Utilizzare le intestazioni o appropriate per il contenuto dei server. Utilizzare ETags se possibile.

• Prova a mettere il tuo contenuto su un CDN. Questo può collocare le risorse in un punto geografico più vicino a e rendere l'applicazione più veloce.

Answer 4

ci sono principalmente 3 passi per l'ottimizzazione (ridurre) jQuery chiamate AJAX:

• sia passare la funzione di callback fatto come argomento quando si chiama la funzione
• restituire l'oggetto jqXhr dalla funzione , e assegnare il callback fatto
• alternativa passare all'utilizzo jQuery.ajax() invece, e passano le intere opzioni oggetto

prega di fare riferimento questo link: How to optimize (minimize) jQuery AJAX calls

Answer 5

È possibile utilizzare la funzionalità di cache della chiamata Ajax per questo che vi aiuta a ottenere tutti i dati nella prima durante la richiesta e memorizzato nella cache e dalla prossima volta non richiesta Ajax è successo e dati manipolazione eseguita utilizzando solo dati memorizzati nella cache.

Inoltre, è possibile ottimizzare solo la richiesta di chiamata Ajax e il tempo di risposta riducendo la quantità di dati richiesti e inviati durante la chiamata Ajax. Questo può essere fatto solo rimuovendo i dati indesiderati durante la chiamata Ajax.

Oltre a ciò, tutta l'ottimizzazione dipende dal codice e dalla logica del database. Per aumentare le prestazioni e ridurre il crash delle app, il codice ottimizzato e la logica del database ti aiutano.

Answer 6

polling lungo è meglio di Polling

Se si effettua il prelevamento in un intervallo di set è probabilmente meglio se si imposta un timeout sul lato server e l'ora di tornare un messaggio fino a quando un certo numero di cicli. Questo ha particolarmente senso per SPA. Tuttavia, se si esegue il polling, è necessario aumentare l'intervallo di tempo con ogni risposta vuota ricevuta.

richieste di gruppo dagli eventi, non per entità

Diciamo che si effettua il prelevamento ogni 10 secondi, per recuperare i nuovi messaggi. Inoltre, si esegue il polling ogni 10 secondi per recuperare più notifiche. Invece di fare due richieste, dovresti fare una sola richiesta Ajax e restituire una grande risposta JSON, che poi usi per modificare gli elementi DOM sul lato client.

utilizzare gli eventi o le prese Server-Sent se possibile

Sockets o eventi Server-Sent si tradurrà in molto meno richieste e solo vi comunicheremo se qualcosa è effettivamente accaduto sul lato server. Ecco un buon comparison.

Answer 7

1. Crea variabile con callback ajax e usarlo
2. Ogni secondo si crea nuova istanza di richiesta XHR, che si terrà a memoria fino a quando fatto modo di callback executes.Better è quello di creare nuova ajax richiesta su precedente Ajax completo , questo significa che avrai una sola istanza di richiesta xhr alla volta.

3. Dopo che i dati inviano al server, pulire i dati degli oggetti, ad esempio:

   array.length = 0; oggetto = null; image.src = ""; file = null;

Answer 8

Come @ jfriend00 detto, richieste Ajax non generano perdite di memoria problemi ...

questo è ciò che il vostro codice probabilmente fare!

Il modo migliore per fare ciò che è necessario è aprire un Socket Layer con il servizio Data Layer, così, invece di un polling, è possibile ricevere una notifica quando si verifica una modifica del modello di dominio.

Checkout in Socket.io ...

Se non si desidera implementare un Socket Layer, penso che non ci sono molti modo per aumentare le prestazioni ...

Una cosa che, oltre - ovviamente - (. refactoring, ecc) per le operazioni di miglioramento del codice, a mio parere, si può fare è quello di implementare un "sistema di Gestione coda" ...

• studiare come promette il lavoro (es6, jQuery, Q, bluebird)
• Creare un QueueService, una semplice classe Javascript che sa come serializzare tutte le attività (Ajax) (promesse);
• Interporre il QueueService tra controller e servizi di accesso al livello dati
• Implementare un CacheSystem leggero e leggero che prevenga le richieste Ajax non necessarie!