will-change
Nekretnina u CSS optimizira animacije, dopuštajući preglednik znati koje su osobine i elementi samo o biti manipulirani, potencijalno povećavajući performanse tog rada.
Ovo svojstvo ima četiri vrijednosti:
auto
: primijenit će se standardne optimizacije preglednika.scroll-position
: označava da će se pozicija pomicanja elementa animirati negdje u bliskoj budućnosti, tako da će se preglednik pripremiti za sadržaj koji nije vidljiv u prozoru za pomicanje elementa.contents
: očekuje se promjena sadržaja elementa, tako da preglednik neće predmemorirati sadržaj ovog elementa.: bilo koje korisnički definirano svojstvo poput
transform
ili naopacity
koje se želimowill-change
primijeniti.
Preglednik možemo obavijestiti da će se na transform
imovini dogoditi promjena na sljedeći način:
.element ( will-change: transform; )
Ili ako želimo deklarirati više vrijednosti, možemo koristiti popis odvojen zarezima kao što je:
.element ( will-change: transform, opacity; )
Važno je will-change
međutim ne pretjerano koristiti svojstvo, jer bi to u stvari moglo dovesti do slabijeg rada stranice (imajte na umu da all
ovo svojstvo ne postoji iz opravdanog razloga). Kao rezultat toga, MDN preporučuje da se svojstvo koristi kao krajnje sredstvo za postojeće probleme s izvedbom, a ne za one za koje pretpostavljate da bi se mogli dogoditi. I kada se koristi, preporučuje se prebacivanje will-change
neposredno prije promjene elementa ili svojstva, a zatim ga ponovno isključivanje nedugo nakon završetka postupka.
Podrška preglednika
Podaci o podršci preglednika potječu iz tvrtke Caniuse, koja sadrži više detalja. Broj označava da preglednik podržava značajku u toj verziji i novijoj.
Radna površina
Krom | Firefox | IE | Rub | Safari |
---|---|---|---|---|
36 | 36 | Ne | 79 | 9.1 |
Mobitel / tablet
Android Chrome | Android Firefox | Android | iOS Safari |
---|---|---|---|
88 | 85 | 81 | 9.3 |