2016-07-11 45 views
8

C'è un nuovo attributo CSS, chiamato will-change, utilizzando è possibile definire proprietà che verranno modificate frequentemente, in modo che il browser possa ottimizzarlo. Ad esempio:CSS non cambierà

.element { 
    will-change: transform, opacity; 
} 

Ma che dire del contrario? Ci sono suggerimenti o bozze di lavoro per qualcosa come will-not-change? Usando sarebbe possibile suggerire il browser, che tali proprietà non cambieranno mai (costanti), quindi può fare alcune ottimizzazioni su di esso?

+0

Voglio suggerire il miglior post su questo su MDN https://developer.mozilla.org/en/docs/Web/CSS/will-change –

risposta

7

I browser ottimizzano già i loro algoritmi di layout per le proprietà che "non cambieranno" per impostazione predefinita. will-change è un modo di optare delle proprietà in modifica (nonostante ciò che la "volontà" nel nome della proprietà potrebbe suggerire) in modo che i browser possano eseguire in anticipo le ottimizzazioni necessarie per quando le proprietà do cambiano (dal loro valore iniziale, a meno).

Pensateci in questo modo: le proprietà che non sono elencate in will-change sono già state ottimizzate poiché "non cambierà" o "se cambiano o no non fa alcuna differenza significativa nelle prestazioni". Ad esempio, la vostra dichiarazione will-change indica al browser di creare un livello di composizione per gli elementi .element, nel caso in cui debbano essere trasformati o composti alfa, in modo che il rendering sia accelerato dall'hardware all'avvio. Poiché questa dichiarazione will-change non si applica agli elementi senza questa classe, il browser presuppone che quegli altri elementi non verranno mai trasformati o composti alfa e, in quanto tali, non hanno bisogno di questo livello di composizione. Non creando per loro livelli di composizione, il browser ha già ottimizzato il rendering di quegli elementi non accelerandoli inutilmente.