欧美一区二区三区,国内熟女精品熟女A片视频小说,日本av网,小鲜肉男男GAY做受XXX网站

react大家都用什么實現(xiàn)動畫?

吉茹定2年前13瀏覽0評論

看見這個問題我比較感興趣,就不請自來了,因為我用react兩年了,也遇到過一些動畫的開發(fā),我就談?wù)勎易约旱慕?jīng)驗。

首先,react最大的優(yōu)勢在于對操作dom性能的提升,它通過一系列的diff算法將對dom的操作次數(shù)降到最低,本質(zhì)上是框架代替開發(fā)者去操作dom,開發(fā)者通過state和props去傳遞指令,當(dāng)然開發(fā)者也可以直接操作dom,這種方式不推薦!

其次,對于開發(fā)動畫,我們有如下幾種方式:

1、通過css3開發(fā)動畫,其中animation和transition是控制動畫的核心。我們一般會開發(fā)好動畫class,在特定的時機增刪class(在react中可以用state控制),達(dá)到動畫的效果!它比較簡單,順暢,性能好,但是對動畫的控制不夠精細(xì),能實現(xiàn)的動畫比較有限而且存在兼容性問題!

2、通過js開發(fā)動畫,通常的思路是使用定時器,比如setTimeout、setInterval、requestAnimationFrame,可以在react的各個鉤子函數(shù)中開發(fā),它們對動畫的控制比較精細(xì),但是如果你使用原生的js去開發(fā)也會存在兼容性問題而且性能不好,有可能會出現(xiàn)卡頓等現(xiàn)象!

3、使用react自帶插件react-transition-group

4、使用第三方動畫庫,如react-motion,Animated,velocity-react等

總結(jié),個人認(rèn)為簡單的動畫盡量自己使用css3和js開發(fā)(前提是保證兼容性),相對于動畫庫,自己寫的代碼要少很多,頁面整體的加載速度會快一點!如果遇到復(fù)雜的自己實現(xiàn)困難的動畫可以使用優(yōu)秀的第三方庫,如果在使用第三方庫時能夠做到按需加載那就更好了,有時沒辦法我會自己去分離代碼庫!

喜歡我的回答就關(guān)注我吧,有問題可以發(fā)表評論,我們一起學(xué)習(xí),共同成長!