Bir Ember.js uygulamasının eski bir gif döndürücüsünü yeni bir SVG/CSS çevirici ile değiştiriyorum.SVG/CSS çeviricinin performansını artırın
http://codepen.io/FezVrasta/pen/pJXovM
Ve bu CSS ile yükleyebilirsiniz: Projemi .svg
olarak kaydedilir üzerinde
Bu
, eğirenbackground: no-repeat center;
background-image: url(../images/spinner.svg);
background-size: 65px 65px;
sorundur benim ember.js uygulaması olduğunu Spinner gösteriliyor iken çok sayıda hesaplama yapar ve bu spinner gecikme yapar.
b64.io kullanarak base64'deki svg'yi kodlamayı denedim, ancak tek kazanç yükleme süresidir, performans aynıdır.
Gördüğünüz gibi zaten rotate
yerine rotate3d
kullanarak GPU kullanmayı denedim, ancak herhangi bir performans artışı almadım.
Akışkanlığını iyileştirmek için herhangi bir öneri var mı? İyi uygulamalar, püf noktaları, vb.
Emin değilim, ancak özel SVG animasyonuna geçebilir misiniz? (bkz. örneğin: https://css-tricks.com/guide-svg-animations-smil/ ve https://css-tricks.com/svg-animation-on-css-transforms/) – RobAu
Bulunamadı SMIL bile CSS :( –
@RobAu performans hakkında herhangi bir bilgi performans yeterince iyi değil http://codepen.io/FezVrasta/pen/oXrgdR?editors=100 –