2012-11-05 14 views
15

Costruiamo un'applicazione aziendale complessa utilizzando KnockoutJS e abbiamo riscontrato scarse prestazioni soprattutto in IE8. L'applicazione potrebbe richiedere più di 1 GB di RAM e non consente mai di liberare memoria. Durante le indagini abbiamo scoperto che KnockoutJS mantiene i riferimenti ai nodi DOM e non lo elimina mai. Questo può essere riprodotto usando IESieve contro qualsiasi esempio di KnockoutJS pubblico, basta guardare l'utilizzo del DOM mentre si gioca con un esempio che aggiunge ed elimina i nodi DOM.KnockoutJS IE8 problemi di prestazioni e perdite di memoria

Qualcuno ha affrontato questo problema e ha qualche idea su come risolvere questo problema?

+0

Non ho riscontrato questo problema. Forse c'è un problema con la tua applicazione. – Tyrsius

+0

fortunato, tuttavia ci sono diverse persone che si lamentano troppo forum @ knockoutjs. Fai qualcosa di speciale per trattare IE8? –

+3

Non ho familiarità con Knockoutjs ma ho familiarità con lo sviluppo basato su IE. Se Knockoutjs utilizza le chiusure javascript che fanno riferimento al DOM, queste potrebbero portare a riferimenti penzolanti che comportano scarso rendimento e perdite di memoria. Per risolvere questi problemi è molto probabile che sia necessario modificare la libreria di javascript. – Anthill

risposta

1

Probabilmente a che fare con i binding di eventi che non vengono rilasciati quando i loro elementi DOM vengono eliminati. Se è qualcosa che sta accadendo sotto il cofano con knockout, dovrai applicare una patch e inviare una richiesta di pull.

Ho avuto questo genere di cose anche con backbonejs. JavascriptMVC è un po 'meglio per ripulire se stesso.

+2

Quello che hai menzionato qui è vero. Il problema sono i binding di eventi e anche alcuni dei riferimenti dom non vengono rilasciati correttamente. – ryadavilli

2

Abbiamo avuto problemi simili con knockout JS su IE 8. Una delle aree problematiche era avere un array osservabile (con oltre 500 elementi) e costruire un'interfaccia utente (immagina una tabella simile o lista come struttura) con tutti quelli . L'unico lavoro che ha funzionato per noi è stato modificare il modello di visualizzazione in modo che contenga solo pochissimi elementi che potrebbero adattarsi allo schermo. Inoltre, abbiamo dovuto aggiungere gestori per gli eventi di scorrimento in modo che l'array osservabile continuasse a essere aggiornato. E (non troppo orgoglioso di questo), abbiamo dovuto aggiungere un div vuoto nella parte superiore dei record visualizzati per dare l'illusione che la vista avesse scrollato.

+0

Puoi condividere qualche codice sullo stesso? Anche noi stiamo cercando qualcosa di simile. – Rups

+1

Impossibile dare alcun codice ma la logica di alto livello era così. Tenuto tutti i record in un array javascript, diciamo masterData. In base all'interfaccia utente, è stato identificato il numero di record visualizzati sulla pagina alla volta, ad esempio pageSize. Ora al primo caricamento, da masterData aggiungere solo pageSize numero di record alla matrice osservabile VM. Calcolato anche quale sarebbe la dimensione totale della pagina visualizzata per il numero totale di record. Ora per la parte a scorrimento. Più sotto. – ryadavilli

+1

Aggiunto un gestore di scorrimento per la pagina, in cui in base alla posizione di scorrimento e all'altezza totale della pagina Web, calcolare l'indice corrente. Ora svuota la VM e aggiungi dai dati anagrafici, i record a partire dall'indice corrente all'indice corrente + pageSize. Aggiungi un div vuoto di dimensione recordize * indice corrente prima del primo elemento reso per dare l'illusione di una scroll corretta. Spero che questo aiuti – ryadavilli