Closed mjtakenon closed 1 year ago
島編集画面の処理を修正し、スクリプト実行パフォーマンスを改善しました。
島編集画面について、指定タイルの地形情報を取得するgetIslandTerrain関数は、Arrayのfilterを使って実装していました。 filterの計算量はO(n)であり、それをv-forで描画している各タイルに対して行っているため、何かしらアクションを起こした場合の計算量がO(n^2)となっており、処理が低速な状態でした。
getIslandTerrain
store.terrainsのデータは現在readonlyであり、更新はしない(これからする予定もない)想定なので、IslandEditor.vueにterrainsをローカル変数という形で二次元配列にキャッシュしました。これにより、getIslandTerrainはO(1)で実行できるため、以前と比べて高速になったと思います。
IslandEditor.vue
chromeのパフォーマンス測定機能を利用し、同じ操作を行いパフォーマンスを測定しました。 スクリプト実行にかかる時間が2810ms→617msと、大幅に改善していることがわかります。
修正前パフォーマンス測定結果(sta環境で測定)
修正後パフォーマンス測定結果(local環境で測定)
概要
島編集画面の処理を修正し、スクリプト実行パフォーマンスを改善しました。
詳細
島編集画面について、指定タイルの地形情報を取得する
getIslandTerrain
関数は、Arrayのfilterを使って実装していました。 filterの計算量はO(n)であり、それをv-forで描画している各タイルに対して行っているため、何かしらアクションを起こした場合の計算量がO(n^2)となっており、処理が低速な状態でした。store.terrainsのデータは現在readonlyであり、更新はしない(これからする予定もない)想定なので、
IslandEditor.vue
にterrainsをローカル変数という形で二次元配列にキャッシュしました。これにより、getIslandTerrain
はO(1)で実行できるため、以前と比べて高速になったと思います。参考
chromeのパフォーマンス測定機能を利用し、同じ操作を行いパフォーマンスを測定しました。 スクリプト実行にかかる時間が2810ms→617msと、大幅に改善していることがわかります。
修正前パフォーマンス測定結果(sta環境で測定)
修正後パフォーマンス測定結果(local環境で測定)