Ho una domanda generale sugli eventi/ascoltatori di javascript (jQuery). Esiste un limite per il numero di listener di clic senza problemi di prestazioni?L'aggiunta di troppi listener di eventi influisce sulle prestazioni?
risposta
In termini di prestazioni, il numero di elementi a cui è associato l'evento è dove si vedrebbero eventuali problemi.
Questo è un jsperf test. Vedrai che il binding a molti elementi è molto più lento, anche se in ciascun caso viene associato un solo evento.
Il terzo test in jsperf mostra come associare l'evento a un elemento padre e utilizzare la delega per ascoltare gli elementi desiderati. (In questo caso .many
)
n.b. Il test mostra che la terza opzione è la più veloce, ma è perché ha come target l'elemento con un id
e non una classe.
Aggiornamento: Ecco un altro che mostra perf test 3 eventi legati a un id
vs un evento legato con un class
Grazie per la risposta @atmd - Il [test jsperf] (http://jsperf.com/click-perf) ha dimostrato il problema in modo eccellente –
Ho fatto +1 anche a questa risposta In generale, se stai usando jQuery, cerca di favorire l'argomento extra delegato quando si usa '$ (elemento). on() '... quindi al posto di $ ('ul li'). on ('clic', callback)' Usa '$ ('ul'). on ('click', 'li', callback) '. – ded
@ded Concordato. Potrei aggiornare la risposta ad un certo punto con un jsperf per mostrare gli effetti della delega. sarebbe interessante vedere se/come il numero di elementi figlio (nel tuo esempio il 'li') gli effetti – atmd
- 1. L'offuscamento influisce sulle prestazioni?
- 2. setTimeout() influisce sulle prestazioni
- 3. In che modo Object.observe() influisce sulle prestazioni?
- 4. fa favicon 404 influisce sulle prestazioni
- 5. L'ordine Sql JOIN influisce sulle prestazioni?
- 6. L'hard coding della stringa influisce sulle prestazioni?
- 7. Perché document.write influisce negativamente sulle prestazioni Web?
- 8. In che modo l'architettura NUMA influisce sulle prestazioni di ActivePivot?
- 9. L'utilizzo di un framework PHP influisce sulle prestazioni?
- 10. Il numero di colonne influisce sulle prestazioni della query?
- 11. Symfony2 listener di eventi
- 12. La lunghezza della chiave influisce sulle prestazioni del dizionario?
- 13. La dimensione della tabella influisce sulle prestazioni INSERT?
- 14. L'omissione dei punti e virgola influisce sulle prestazioni in JavaScript?
- 15. L'incapsulamento del codice Javascript negli oggetti influisce sulle prestazioni?
- 16. Che cos'è l'aliasing e in che modo influisce sulle prestazioni?
- 17. NHibernate listener di eventi
- 18. Prestazione listener di eventi JavaScript per centinaia di elementi DOM
- 19. Eventi Java e listener di eventi
- 20. Il caricamento di molti pacchetti influisce sulle prestazioni generali di un'applicazione Symfony2?
- 21. Primefaces Domande sulle prestazioni
- 22. Listener di eventi personalizzati JavaScript
- 23. Listener di eventi personalizzati Android
- 24. refresh listener di eventi Javascript
- 25. View listener di eventi - Javascript
- 26. Listener di eventi in Java
- 27. performance listener di eventi Javascript
- 28. Implicazioni sulle prestazioni di BeginInvoke
- 29. In che modo Dateadd influisce sulle prestazioni di una query SQL?
- 30. In che modo un vincolo univoco influisce sulle prestazioni di scrittura in Postgres DB
bisogno di maggiori contenuti davvero. un click handler non ti dà problemi di perfomance, è che le azioni intraprese al clic che 'possono' causare problemi. inoltre, un clic potrebbe essere associato a 1 elemento o 20.000 elementi, quindi sono necessarie ulteriori informazioni. – atmd
Se inserisco più elementi, un click listener con jquery. Questo è ciò che intendo. L'intera app deve ascoltarla. Sto parlando di un ascoltatore di clic su 5-20. Non so se questo è un problema, è per questo che sto chiedendo :) –
Ecco un test [jsperf] (http://jsperf.com/click-perf) sugli eventi click associati a uno o più elementi, vedrai che anche se è associato un solo evento, il numero di elementi che corrispondono a quella selezione ha un impatto maggiore. in modo tale da ottenere risultati perf molto più del numero di eventi. Il test (appena aggiornato) mostra anche come ti legherei a un genitore, per migliorare il legame del legame con molti elementi. (funziona il più veloce qui visto che è un 'id' – atmd