效果和代碼。
http://u6.gg/Skx
運(yùn)行久了之后會(huì)出現(xiàn)假死 或者 無響應(yīng) 或者 開始有點(diǎn)卡了
求優(yōu)化,或者給個(gè)解決方案。
彈幕增加速度比消失速度快,數(shù)量到一定程度之后肯定會(huì)卡。
解決辦法的話增加彈幕隊(duì)列的數(shù)量上限。
另外因?yàn)樵诓粩嗾{(diào)用js計(jì)算left,所以內(nèi)存會(huì)越來越大,觸發(fā)GC之后就也會(huì)導(dǎo)致卡頓。
然而為啥要用requestAnimationFrame,用css動(dòng)畫吧
this.data.barrage.item 有34個(gè) 控制一下
走到最左邊的元素刪除
還有一個(gè)注釋掉控制臺(tái)的日志
試一試
使用CSS3動(dòng)畫,起始位置為元素左側(cè)貼屏幕右側(cè),停止位置為元素右側(cè)貼屏幕左側(cè)。
當(dāng)動(dòng)畫結(jié)束的時(shí)候移動(dòng)元素。