Posizione WebKit e CSS di Mac OS X: scorrimento fisso

Abbiamo riscontrato un problema di ottimizzazione utilizzando WebKit su Mac OS X che speriamo che qualcuno possa aiutarci.Posizione WebKit e CSS di Mac OS X: scorrimento fisso

Abbiamo scritto un'app Cocoa per Mac OS X che gestisce essenzialmente una singola WebView che rimanda al nostro sito Web online. Tutto funziona bene per la maggior parte. Tuttavia, il nostro sito Web utilizza la posizione CSS: corretto per mantenere una "barra di intestazione" sottile bloccata nella parte superiore di WebView, simile alla barra arancione "Benvenuto" nella parte superiore di StackOverflow.com. Abbiamo determinato che con la posizione: fisso attivo, scorrendo la WebView forza l'intera pagina Web a ridisegnarsi, il che fa sì che lo scroll diventi lento. Con posizione: fisso disabilitato, lo scorrimento è molto veloce e fluido; devono essere disegnati solo gli elementi della pagina che sono stati fatti scorrere "nella vista".

Sappiamo che questo non è un bug nel nostro codice app Cocoa, né è un problema con il nostro codice HTML/CSS. Lo stesso scorrimento lento si verifica utilizzando il codice di test WebKit di Apple. Possiamo puntare il codice di prova di Apple a http://www.StackOverflow.com come test e vediamo esattamente lo stesso comportamento. C'è anche una pagina di test nel database dei bug di Mozilla che abbiamo usato per testare il problema (https://bug201307.bugzilla.mozilla.org/attachment.cgi?id=139911). La cosa strana è che alcuni browser basati su WebKit su Mac (ad esempio, Safari e Chrome) non hanno questo problema; lo scorrimento è sempre veloce sulle pagine usando la posizione del CSS: risolto con quei due browser.

Qualcun altro ha riscontrato questo problema con WebKit su OS X? In tal caso, cosa possiamo fare per accelerare lo scorrimento? Grazie.

fonte

2011-11-01 philbert1

Penso che sto vivendo questo. Dai un'occhiata a http://harrisnovick.com/orange e fai clic su un riquadro di un articolo. Cercherò di confermare se position: fixed è responsabile delle scarse prestazioni di scorrimento. – lightyrs

Harris, vedo alcuni problemi di ridisegno con il tuo sito, ma non penso che sia lo stesso problema. Se tengo il cursore del mouse su uno degli elementi della griglia e lo scorrimento, lo scorrimento diventa un po 'più lento perché tutti gli elementi della griglia si ripetono durante l'operazione di scorrimento. Tuttavia, se tengo il cursore del mouse fuori dalla finestra e lo scorrimento, gli elementi della griglia non si ridisegnano. Inoltre, la barra arancione sul lato sinistro non sembra mai ridisegnarsi. – philbert1

Questo mi fa pensare che la tua è una questione leggermente diversa dalla mia. Nella nostra finestra, tutti gli elementi si ridisegnano in modo coerente, inclusa la posizione: fissa. – philbert1

Potrei essere lontano da qui perché non sono sicuro che lo stesso si applichi alla vista Web, ma l'utilizzo di uno stile che impone il nav al proprio livello può essere d'aiuto.

Qualcosa come translateZ (0), o translate3d (0,0,0,). Mi sono imbattuto in problemi simili quando costruivo con PhoneGap e ho applicato qualche pensiero alla stratificazione davvero aiutato.

Credo che il browser possa utilizzare l'accelerazione hardware in cui è coinvolta una terza dimensione.

fonte

2015-01-26 19:14:19 thecraighammond

Stavo avendo un problema simile: la barra fissa stava tremolando mentre stavo scorrendo la pagina. Così ho costretto il WebView per utilizzare i livelli e mi fissa

[w setWantsLayer:YES];

fonte

2015-05-23 08:20:15

ho avuto un problema simile nel mio WebView base di Mac App. Ha intestazione e piè di pagina con posizione: proprietà css fisse. L'ultimo webkit fornito con 10.10.xe versioni successive non soffre di questo problema. Succede nel webkit per i mavericks (10.9.x). Ho funzionato impostando queste proprietà per la webview

[self.webView setWantsLayer:YES]; 
    [self.webView setCanDrawSubviewsIntoLayer:YES];

fonte

2016-03-04 10:07:45 Ali

Posizione WebKit e CSS di Mac OS X: scorrimento fisso

risposta

Problemi correlati