クソコード鑑賞会

Transcript

1. クソコード鑑賞会 Kloud LT
2. 自己紹介 • raiga0310/AHOXA/ライガー • (元)豊田高専 • B3 • インターン(PHP､PostgreSQL､バックエンド) • twitter: @ahoxa1rx • portfolio: https://profile.a6x.dev • Rust,TypeScript • Hono.jsがきになるお年頃
3. はじめに • Done is better than perfect(出さない神レポより出すゴミレポ) • どんなに設計がきれいでも動かないと意味がありません ◦ どんなに読みづらいコードや仕様がなくてもそれがうごいてかつお金になっているコードはたくさ んある ◦ 動くから金になる ◦ もちろん､きれいなことに越したことは無い (脆弱性とか､拡張性とか )
4. クソコードって何?
5. 人によるかもしれません
6. クソコードの種類 世で動いているクソコード • 動いて｢は｣いる • この時点で正義だが保守的にはつらい • 脆弱性が多いことがある • 改良しづらい 世に動いていないクソコード • 動作するかの保証もない • 仕様がない場合､まずコードを読み解くのも 難しい • 改良しようとしたときには手詰まりになるかも • 作り直したほうが早い ?
7. クソコードを読んでみよう
8. コードを読む前に ハックツハッカソン https://cup.hackz.team/ • 宿泊費タダでハッカソン • 3日間集中できる!
9. 作ったもの 3人称弾幕シューティング ゲーム本体 https://game.a6x.dev 紹介記事 https://topaz.dev/projects/50c8c6208a1e8e39e421 Vercel+Next.js+Babylon.js
10. 本体 いわゆるAppRouter メンター陣がNextできる方が多かった Vercelならデプロイし易い
11. クソコードポイント: 全部盛り
12. こちらご覧ください
13. 何がいけないか • ファイル分けをしていない ◦ ゲームのどこかに変更を加えたコミットでも｢ Canvas.tsx｣の差分にしかならないため､差分を見 るまで実際に何が行われたかを (メッセージがあるとはいえ )読まないといけない ◦ 下手な変更をするとゲーム全体に影響が出る ▪ テストがあったとしても･･････
14. 何がいけないか • WhatとHowの分離 • 要はViewとLogicが分かれていない • 違う関心のコードが近い位置にあると改良時のコストが高い • UIが何をするのか､エージェントは何をするのか､とか
15. 何がいけないか • 型ァ!!!!!!!! ◦ もうこんなのほぼJSです ◦ 型チェックがないとつらい
16. クソコードポイント:技術選定
17. どうしてNext.jsなんですか もはや素のWebGL描画だけでよかったやん • デフォルトのSSRのせいでゲームが描画されない不具合に2h溶かした • (あとUnityで良くねとかになるよね)
18. クソコードポイント:ない仕様
19. 何がいけないか ふと思い立って改良しよう!→該当部分はどこ? ドキュメントは書こうね!手書きでも
20. まとめ • コードは役割やロジックでちゃんとファイル･ディレクトリ分けをする • 型が用意されていればちゃんと型を使う • 仕様はちゃんと書く • 仕様はちゃんと書く
21. 鑑賞会 会場: https://github.com/raiga0310/hackz-hackathon2023