Neden sağlayan CSS3 donanım-hızlanma performansını yavaşlatır?
top: 145px
css3 bir deney top: 0
geçiş kullanarak 6000 küçük dıv elemanları performans testi geçiyorum.
Kullanarakhayırdonanım hızlandırma Google Chrome üzerinde sorunsuz çalışır.
translateZ(0)
) donanım hızlandırması etkinleştirirsem performans korkunç olur.
Neden acaba?
Burada benim örnek kod: http://dl.dropboxusercontent.com/u/17844821/tmp/hwtest.html
Güncelleme(2014-11-13): bu soru hala ilgi topluyor Beri bahsedilen Kekemelik artık sağlanan demo görünür olmayabilir rağmen . sorun kendisi hala var gibi görünüyor olduğunu işaret etmek istiyorum ^strong>modern donanım. Eski cihazlar hala performans sorunları görebilir.
CEVAP
Ben her zaman ekleyin :
-webkit-backface-visibility: hidden;
-webkit-perspective: 1000;
3d dönüşümü ile çalışırken. "Sahte" dönüşümler 3D bile. Deneyim bu iki satır her zaman performansları, özellikle iPad artırmak değil, aynı zamanda Chrome söyledi.
Senin örneğin üzerine test yaptım ve, anladığım kadarıyla, işe yarıyor.
"Neden" sorunuza bir parçası... bilmiyorum. gelince 3D dönüşüm genç bir standart uygulama bozuk. Test için beta. bu öneki özelliği budur : Birisi bir hata raporu veya bir soru doldurun ve ekibi araştırmak olabilir.
19 Ağustos 2013 başına düzenleyin:
Bu cevap üzerine düzenli aktivite var, ve ben sadece bir saat IE10 de bu ihtiyacı bulma kaybetti. O yüzden unutma :
backface-visibility: hidden;
perspective: 1000;
Neden 0 0,1 f değişen 10x performansın...
Box-boyutlandırma CSS3: kenar-box; Ned...
Neden İçeren() Varlık Çerçeve'bu ...
Neden ifadeleri benim fonksiyonlarını ...
Neden sıralanmamış bir dizi daha hızlı...