Come migliorare le prestazioni del completamento automatico di Jquery

Question

Avevo intenzione di utilizzare il completamento automatico di jquery per un sito e ho implementato una versione di prova. Ora sto usando una chiamata Ajax per recuperare un nuovo elenco di stringhe per ogni input di caratteri. Il problema è che diventa piuttosto lento, 1,5 secondi prima che venga popolato il nuovo elenco. Qual è il modo migliore per velocizzare il completamento automatico? Sto usando cakephp e sto solo facendo una ricerca e con un limite di 10 elementi.

Answer 1

Questo articolo - su come flickr il completamento automatico sia un'ottima lettura. Ne ho avuto un po '"wow" esperienze di lettura.

  

" Questo widget scarica un elenco di tutti   dei tuoi contatti, in JavaScript, in   sotto i 200ms (questo vale anche per   membri con oltre 10.000 contatti). Nel   per ottenere questo livello di   prestazione, abbiamo dovuto completamente   ripensare il modo in cui inviamo i dati dal   server al client. "

Answer 2

Prova a precaricare l'oggetto elenco invece di eseguire la query al volo.

Anche il completamento automatico ha un ritardo di 300 ms per impostazione predefinita.
Forse rimuovi il ritardo

$( ".selector" ).autocomplete({ delay: 0 });

Answer 3

Gli intervalli di 1,5 secondi sono spazi molto ampi per servire un servizio di completamento automatico.

1. Innanzitutto ottimizza la query e il db connessioni. Prova a mantenere la tua connessione db vivo con memorizzazione nella memoria.
2. Utilizza i metodi di memorizzazione nella cache dei risultati se il tuo il servizio è molto utilizzato per ignorare i recuperi.
3. Utilizzare una cache client (un elenco JS) per mantenere le vecchie richieste sul client. Se l'utente digita e cancella, sarà utile. I risultati verranno dalla cache del front-end anziché dal punto di back-end.
4. Il filtro Regex sul lato client non sarà costoso, potresti dargli una possibilità.

Answer 4

Prima di fare alcune ottimizzazioni dovresti prima analizzare dove si trova il collo di bottiglia. Prova a scoprire quanto tempo impiega ogni passaggio (input ? richiesta ? query db ? risposta ? display). Forse l'implementazione di CakePHP ha un ritardo nel non inviare una richiesta per ogni personaggio inserito.

Answer 5

Il vero problema per la velocità in questo caso credo sia il tempo impiegato per eseguire la query sul database. Se non c'è modo di migliorare la velocità della tua query, forse estendendo la tua ricerca per includere più elementi con alcuni risultati altamente classificati, puoi eseguire una ricerca ogni altro carattere e filtrare tra 20-30 risultati sul lato client.

Questo potrebbe migliorare l'aspetto delle prestazioni, ma a 1,5 secondi, proverei prima a migliorare la velocità della query.

A parte questo, se puoi darci qualche informazione in più potrei essere in grado di darti una risposta più specifica.

Buona fortuna!

Answer 6

Il lato server su PHP / SQL è lento.

Non usare PHP / SQL. Il mio completamento automatico è scritto su C ++ e usa hashtables per la ricerca. Guarda lo spettacolo qui .

Questo è un computer Celeron-300, FreeBSD, Apache / FastCGI.

E, vedi, corre veloce su enormi dizionari. 10.000.000 di record non sono un problema.

Supporta inoltre priorità, traduzioni dinamiche e altre funzionalità.

Answer 7

Il completamento automatico di per sé non è lento, sebbene l'implementazione possa certamente esserlo. La prima cosa che vorrei controllare è il valore della tua opzione di ritardo (vedi documenti jQuery). Successivamente, vorrei controllare la tua query: potresti riportare solo 10 record ma stai eseguendo un'enorme scansione della tabella per ottenere quei 10 record? Stai riportando una tonnellata di record dal database in una raccolta e quindi prendendo 10 elementi dalla raccolta invece di eseguire il paging lato server sul database? Un semplice indice potrebbe essere d'aiuto, ma per fare ciò dovrai fare alcuni test.