will-change
Īpašums CSS optimizē animācijas, ļaujot pārlūka zināt, kuras īpašības un elementi ir tikai par to manipulēt, iespējams, palielinot veiktspēju šo konkrēto darbību.
Šim īpašumam ir četras vērtības:
auto
: Tiks piemērotas standarta pārlūkprogrammas optimizācijas.scroll-position
: norāda, ka elementa ritināšanas pozīcija tiks animēta kaut kad tuvākajā nākotnē, tāpēc pārlūks sagatavosies saturam, kas nav redzams elementa ritināšanas logā.contents
: Paredzams, ka elementa saturs mainīsies, tāpēc pārlūkprogramma nesaglabās kešatmiņā šī elementa saturu.: jebkurš lietotāja definēts rekvizīts, piemēram,
transform
vaiopacity
kuru mēs vēlamieswill-change
izmantot.
Mēs varam informēt pārlūku, ka transform
īpašumā notiks izmaiņas, piemēram:
.element ( will-change: transform; )
Vai arī, ja mēs vēlamies deklarēt vairākas vērtības, mēs varam izmantot ar komatiem atdalītu sarakstu, piemēram:
.element ( will-change: transform, opacity; )
Ir svarīgi will-change
tomēr nepārspīlēt īpašumu, jo tas faktiski var izraisīt lapas mazāk veiktspēju (ņemiet vērā, ka all
šim īpašumam nav iemesla laba iemesla dēļ). Rezultātā MDN iesaka īpašumu izmantot kā pēdējo līdzekli esošajām veiktspējas problēmām, nevis tām, kuras, pēc jūsu domām, varētu notikt. Lietojot to, ieteicams pārslēgties will-change
tieši pirms elementa vai rekvizīta maiņas un pēc tam to atkal izslēgt neilgi pēc procesa beigām.
Pārlūkprogrammas atbalsts
Šie pārlūka atbalsta dati ir no Caniuse, kurai ir sīkāka informācija. Cipars norāda, ka pārlūks atbalsta šo un jaunākās versijas funkciju.
Darbvirsma
Chrome | Firefox | IE | Mala | Safari |
---|---|---|---|---|
36 | 36 | Nē | 79 | 9.1 |
Mobilais / planšetdators
Android Chrome | Android Firefox | Android | iOS Safari |
---|---|---|---|
88 | 85 | 81. | 9.3 |