[特課研論文(卒論)] 依存関係グラフ検索拡張を用いたコンポーネント指向 Web UI の動作説明文書生成
- 02 /
-
01 2026
小林研B3の黑⽥さんが学士特定課題研究(特課研)論文を提出しました.
題目:依存関係グラフ検索拡張を用いたコンポーネント指向 Web UI の動作説明文書生成
論文概要:
Webアプリケーションの開発では,ユーザインタフェースを部品(コンポーネント)に分割し,データの変化に応じて画面を自動更新する仕組みが広く使われている.この仕組みは開発効率を高める一方で,プログラムの動作を追跡することを難しくしている.Vue.js等のコンポーネント指向フレームワークでは,リアクティビティシステムによる暗黙的な依存関係の伝播と,コンポーネント分割による状態の分散が複合することで,バグの原因特定が困難になる.既存のデバッグツールは単一コンポーネントの状態確認には有効であるが,複数ファイルを横断する因果関係の把握には不十分である.近年,大規模言語モデル(LLM)を活用したコード理解支援が注目されている.
しかしながら,コンポーネント指向フレームワークのリアクティビティシステムにおける変数の依存関係を正確に追跡し,開発者が理解しやすい形で提示する手法は確立されていない.LLM単体ではハルシネーション(事実と異なる出力)のリスクがあり,特にUIイベントを起点としてDOM更新に至るまでの因果鎖を,コード上の根拠とともに説明することが課題である.
本研究では,静的解析によって構築した依存関係グラフをLLMへのコンテキストとして与え,処理フローを説明する文書を自動生成する手法を提案する.静的解析で得られる「確実な構造情報」の上をLLMに歩かせることで,ハルシネーションを抑制しつつ,コード上の根拠を明示した説明を生成する.提案手法では,コンポーネント間の接続(props/emit)とストア経由の接続(Pinia)を統一的なグラフとして表現し,双方向スライシングにより関連する因果経路のみを抽出する.グラフのノードにはコード位置情報を保持させ,生成される説明文に根拠(Evidence)を付与できるようにした.Vue 3 + Composition APIで構築された実用規模のアプリケーション(traQ\_S-UI)から抽出した9件のバグケースを用いて評価実験を行った.
提案手法は,実用規模のアプリケーションを用いた評価実験において総合スコア35.78を記録し,ベースライン(Naive RAG)の20.00を大幅に上回った.特に,根拠の品質(Evidence)においてベースラインの1.00に対し2.00を記録し,静的解析によるグラフ探索が正確なコード参照の提供に寄与することが示された.また,アブレーション実験により,Pinia依存関係グラフと双方向スライシングの双方が,バグ原因特定において不可欠な要素であることが確認された.

小林研のそのほかの学位論文等の一覧は こちら です.


English