javascript - 我做了一個h5的畫布游戲，用requestanimation控制方向移動，按鍵控制是否按下方向鍵，但是有點卡，請問大神怎么優化

問題描述

代碼具體沒辦法打出來，有沒有大神提供寶貴的意見

問題解答

將以幀為單位的動畫改成以時間為單位的動畫

對于不需要經常變動的圖片，如背景等，請使用離屏canvas來實現

對于一些細節的地方，如canvas.width 等，需要用width = canvas.width來保存值使用

使用函數節流

事件觸發動作不要以綁定的函數為主，需要將觸發的參數通過傳到程序內部，通過游戲循環來實現。如：當點擊右箭頭的時候，你只需要告訴游戲主體，往右移動已經被觸發，至于怎么運動由程序自己決定。

優化循環，一般來說導致程序運行緩慢最主要的原因都是這個，內部邏輯太多，一個單位循環內根本來不及處理，對于某些數據計算性的東西，比如說生成隨機數等可以通過worker來實現，對于一些不需要經常使用的功能，請盡量避免調用，只有在某些情況觸發了以后，參數值變了，再進行調用。 比如說if(go) dosomething(); 只有當go為true時才進行操作，這樣可以省下大量時間。

當然具體的優化細節需要根據你的代碼來決定，我只能講這么點通用的東西，其實大部分優化的思路都一樣的

有可能是事件注冊的問題，可以先從事件委托，和 dom 結束后取消事件入手。

可以使用 chrome devtool 點開 profile 看看 cpu 和 內存，看看是否是有哪些函數有泄漏或者其他問題。

使用canvas的局部刷新，不要每次移動就刷新整個畫面

你是用DOM 寫的小游戲？還是用CANVAS