2012-04-15 14 views
14

Sto costruendo un'applicazione che include un UIWebView contenente un numero elevato di immagini, CSS, video incorporato e gestori di tap JavaScript. Lo scorrimento delle prestazioni è stuttery e sto cercando informazioni sui modi più efficaci per migliorare questo.Modi per migliorare le prestazioni di scorrimento di UIWebView?

Quale delle seguenti caratteristiche può causare uno scorrimento lenta dello UIWebView? Quali altri fattori potrebbero ostacolare le prestazioni?

  • quantità di immagini
    • dovrei rimuovere le immagini dal DOM come l'utente scorre davanti a loro, e l'aggiunta di nuovo se scorrere il backup?
  • Dimensioni di immagini
      immagini
    • Will Retina qualità in una vista web influenzano lo scorrimento prestazioni molto di più rispetto alle versioni più piccole sarebbero?
  • Immagine ridimensionamento
    • Volesse il ridimensionamento delle immagini prima del tempo fare una grande differenza, piuttosto che fare affidamento sulla vista web di scala basata sulle dichiarazioni come width: 100%;?
  • CSS
    • ho evitato box-shadow, ma ci sono altre proprietà CSS che sono noti anche per influire negativamente sulle prestazioni di scorrimento?

Se ci sono altre risorse o strumenti che possono essere utilizzati per la profilazione, ho l'amore di sentire su di loro.

risposta

1

Ho avuto un problema simile qualche tempo fa. Ho scoperto che mettere la vista web all'interno di una scrollview ha migliorato notevolmente le prestazioni di scorrimento. Dopo che il webview ha terminato il caricamento, ho disabilitato lo scorrimento sulla vista Web, ho impostato il frame della webview e il contenuto della schermata di scrollSize come le dimensioni del contenuto della webview.

-(void) webViewDidFinishLoad:(UIWebView *)webView { 
    float size = [[self.webView stringByEvaluatingJavaScriptFromString:@"document.body.offsetHeight"] floatValue]; 
    [self.scrollView setContentSize:CGSizeMake(self.view.frame.size.width, size)]; 
    [webView setFrame:CGRectMake(webView.frame.origin.x, 
           webView.frame.origin.y, 
           webView.frame.size.width, 
           size)]; 

    [(UIScrollView*)[webView.subviews objectAtIndex:0] setScrollEnabled:NO]; 
} 

sto supponendo che il WebView non carica un'immagine finché non sta per apparire sullo schermo, che ha causato la balbuzie, e mettendolo in uno ScrollView e impostando il telaio alla dimensione contenuto che devo caricarli prima del tempo, ma non ne sono sicuro. Sono anche sicuro che questo abbia delle conseguenze (ad esempio, un maggiore utilizzo della memoria in anticipo), ma non ho mai avuto problemi a farlo in questo modo.

+3

posso ancora down-voto, ma questo è un grave no-no. Questa soluzione fa sì che l'intera webView venga disegnata nel suo CALayer (invalidando il meccanismo di rendering di affiancamento di UIWebView), causando un enorme uso di memoria. La descrizione di OP delle sue pagine, "contenente un gran numero di immagini, CSS, video incorporato e gestori di tap JavaScript" farebbe sì che l'app utilizzasse una quantità eccessiva di memoria. –

+2

Quindi quello che stai dicendo è che ho scambiato la memoria per le prestazioni? Questo è un po 'quello che ho capito. Sono d'accordo che non è una soluzione eccezionale, ma è stato l'unico modo che ho trovato per migliorare lo scorrimento. E dato che sapevo esattamente cosa sarebbe stato caricato nella webview prima del tempo e tutte le risorse erano in bundle con l'app, non ho avuto problemi a farlo in questo modo. – rjowens

+1

Bene, questo tipo di trading è molto pericoloso con UIWebView, perché cresce in memoria molto velocemente e in modo aggressivo. E quando il contenuto diventa più grande e più complesso, troverai presto una raffica di didReceiveMemoryWarning-s e alla fine si blocca. –

8

Questa è la risposta che ho ricevuto da Apple l'Assistenza tecnica sviluppatori qualche tempo fa:

In questo momento, non forniamo alcun meccanismo per ottimizzare la resa dei UIWebView. Il motivo per cui si nota una differenza è dovuto a Mobile Safari e UIWebView che non utilizzano lo stesso motore di rendering.

Le prestazioni dipendono dal contenuto caricato. Se ci sono javascript in esecuzione o plugin in uso, questo può ostacolare le prestazioni.

Si consiglia di presentare una segnalazione di bug al numero http://developer.apple.com/bugreporter/ che descrive la situazione. Questo ti manterrà informato sullo stato della segnalazione di bug.

Una possibile alternativa per UIWebView sarebbe la libreria open-source DTCoreText: https://github.com/Cocoanetics/DTCoreText, che alimenta l'app Float Reader: http://itunes.apple.com/us/app/float-reader/id447992005?mt=8

+0

So che la prestazione dipende dal contenuto caricato. Sto cercando di capire _quando_ le modifiche ai miei contenuti (ad esempio immagini più piccole, meno immagini, evitando determinate proprietà CSS, ecc.) Avranno l'effetto maggiore. –

5

I ragazzi di LinkedIn hanno fatto un ampio lavoro con UIWebView e HTML5 sulla loro applicazione iPad . Il loro intero feed che è pieno di immagini, testi e video è reso all'interno di un UIWebView.

Il seguente post del blog dovrebbe darvi un sacco di punti di partenza per il miglioramento delle prestazioni

LinkedIn for iPad: 5 techniques for smooth infinite scrolling in HTML5

Problemi correlati