這是一個實現我《快節奏的多人遊戲同步》系列文章中主要概念的客戶端——服務器架構演示示例(不包括實例插值,那塊我還沒弄完)建議在閱讀完這系列文章後再看這部分。
代碼是純JavaScript寫的,一頁就裝下了。少於400行代碼,包含大量註釋,如果你真的看懂了上文的概念就可以開始演示了,執行起來相當直觀。
以下爲動態網頁部分,建議直接打開網址觀看
http://www.gabrielgambetta.com/fpm_live.html
引導:
兩種視角顯示出玩家看到的和從服務器角度看到的遊戲世界。你可以使用鍵盤上的左右方向鍵來控制綠球移動。試試吧!
理想狀態
以lag=0,update=60開始。這是理想狀態:客戶端一旦產生新狀態服務器就馬上處理,客戶端和服務器之間也沒有任何延遲。當然的,其運行情況堪稱完美。
緩慢服務器
現在把update設爲5.服務器每秒只發送5次更新,客戶端那邊看起來就是非常跳躍的。但整體上看起來還算有響應。
超超超超超超超級延遲
現在把lag設爲250ms。遊戲看起來好像失去了響應似的,玩家視角中必須等到服務器承認了輸入並回傳給客戶端後纔會產生變化。因爲雙向的延遲,角色開始在你按下按鍵後半秒才移動。
客戶端預演
開啓預演並將update設爲1.按下右鍵一會。現在因爲客戶端的預演動畫看起來非常平滑。但當服務器完全處理完客戶端所有輸入並將狀態回傳時,由於延遲,客戶端預演受到影響,位置跳回了之前的位置。
服務器調節
現在啓用調節。服務器發送狀態時,我們從服務器端發送的權威位置開始將所有未被承認的輸入重新進行預演。不管延遲多大,或者服務器更新頻率幾何,客戶端始終都可以同步!