VS CodeとPolyCoderによるコーディング支援の実験

VS CodeとPolyCoderによるコーディング支援の実験
オープンソース大規模言語モデルを用いて開発支援ができないか、可能性を探る

- PolyCoderの紹介およびコード生成
- VS Code拡張&PolyCoderによるコード補完の実験
- VS Code拡張&PolyCoderによるレビュー支援の実験

Transcript

1. takemikami’s note – http://takemikami.com/
   VS CodeとPolyCoderによる
   コーディング支援の実験
   オープンソース大規模言語モデルによる開発支援の可能性
   Copyright (C) Takeshi Mikami. All rights reserved. 1
   三上 威 - @takemikami
   アーリース情報技術株式会社 代表取締役 社長
   VS Code Meetup #25 - GitHub Copilot
   2023.6.26 @アララ株式会社 (青山タワービル別館)
   

   View Slide

2. takemikami’s note – http://takemikami.com/
   自己紹介 業務と経歴
   • 三上威 (@takemikami)
   • データエンジニア・サイエンティスト
   • 分析・予測モデル開発・基盤構築 etc
   • 対象: マーケティングデータ etc
   • 略歴
   • データ分析・予測モデル開発・基盤構築 @アーリース情報技術(株)
   • ECサイトのマーケティングデータ分析 @ DeNA
   • EC, CRM等のシステム構築 @ NEC系SIer
   • 甲南大学理学部応用数学科 卒
   • 著書
   • Apache Spark ビッグデータクエリチューニング (インプレス)
   Copyright (C) Takeshi Mikami. All rights reserved. 2
   発表者のプロフィールを紹介します
   発表者のプロフィールを紹介します
   

   View Slide

3. takemikami’s note – http://takemikami.com/
   自己紹介 開発プロダクト/技術同人誌
   • 開発プロダクト @GitHub
   • rdflint
   • RDFデータのチェックツール
   • Linked Open Data チャレンジ Japan 2019 基盤技術部門 優秀賞
   • digdag-plugin-shresult
   • ワークフローエンジン「Digdag」のプラグイン
   • シェルスクリプトの標準出力を変数に格納するオペレータ
   • Pytest Parametrize Inlay Hint
   • PyCharm/IntelliJ IDEA向けプラグイン
   • pytest.mark.parametrizeデコレータにヒントを表示するプラグイン
   • 技術同人誌 @Booth/技術書典
   • GitHub Flow 開発プロセス管理入門
   • Apache Airflow ワークフロー プログラミング入門
   • Apache Hadoop & Spark ビッグデータプログラミング入門
   Copyright (C) Takeshi Mikami. All rights reserved. 3
   発表者が作成したプロダクト/執筆した同人誌を紹介します
   発表者が作成したプロダクト/執筆した同人誌を紹介します
   Pytest Parametrize Inlay Hint
   

   View Slide

4. takemikami’s note – http://takemikami.com/
   はじめに
   • テーマ
   VS CodeとPolyCoderによるコーディング支援の実験
   オープンソース大規模言語モデルを用いて開発支援ができないか、可能性を探る
   • 内容
   • PolyCoderの紹介およびコード生成
   • VS Code拡張&PolyCoderによるコード補完の実験
   • VS Code拡張&PolyCoderによるレビュー支援の実験
   Copyright (C) Takeshi Mikami. All rights reserved. 4
   本LTで紹介する内容を説明します
   本LTで紹介する内容を説明します
   

   View Slide

5. takemikami’s note – http://takemikami.com/
   PolyCoderとは
   • カーネギーメロン大学の研究者が開発
   • GPT-2に基づき27億パラメータを持つ
   • 12種類のプログラミング言語
   247GBのコードで訓練されている
   • Hugging Face Hub にモデルが
   公開されており、容易にアクセスできる
   Copyright (C) Takeshi Mikami. All rights reserved. 5
   PolyCoderの紹介およびコード生成
   PolyCoderを紹介します
   PolyCoderを紹介します
   オープンソースのプログラミング言語の大規模言語モデル
   次のPaperで、Codex, GPT-J, GPT-Neo, GPT-NeoX20B, CodeParrot との比較評価がされている
   Frank F. Xu, et al. "A Systematic Evaluation of Large Language Models of Code", 2022 https://arxiv.org/pdf/2202.13169.pdf
   

   View Slide

6. takemikami’s note – http://takemikami.com/
   PolyCoderによるコード生成 1/2
   • モデルのロード
   • 生成処理
   Copyright (C) Takeshi Mikami. All rights reserved. 6
   PolyCoderの紹介およびコード生成
   PolyCoderによるコード生成のイメージを紹介します
   PolyCoderによるコード生成のイメージを紹介します
   import transformers
   from transformers import AutoTokenizer, AutoModelForCausalLM
   from packaging import version
   assert version.parse(transformers.__version__) >= version.parse("4.23.0")
   tokenizer = AutoTokenizer.from_pretrained("NinedayWang/PolyCoder-2.7B")
   model = AutoModelForCausalLM.from_pretrained("NinedayWang/PolyCoder-2.7B")
   prompt = '''def binarySearch(arr, left, right, x):
   mid = (left +'''
   input_ids = tokenizer.encode(prompt, return_tensors='pt')
   result = model.generate(input_ids, max_length=50, num_beams=4, num_return_sequences=4)
   for res in result:
   print(f"---- candidate #{idx + 1}")
   print(tokenizer.decode(res))
   引用元: https://github.com/VHellendoorn/Code-LMs のREADMEより
   Tokenizer, Modelのロード
   入力のコード
   

   View Slide

7. takemikami’s note – http://takemikami.com/
   PolyCoderによるコード生成 2/2
   • 生成結果
   Copyright (C) Takeshi Mikami. All rights reserved. 7
   PolyCoderの紹介およびコード生成
   PolyCoderによるコード生成のイメージを紹介します
   PolyCoderによるコード生成のイメージを紹介します
   ---- candidate #1
   def binarySearch(arr, left, right, x):
   mid = (left + right) // 2
   if arr[mid] == x:
   return mid
   ---- candidate #2
   def binarySearch(arr, left, right, x):
   mid = (left + right) // 2
   if arr[mid] > x:
   return binarySearch(arr
   ---- candidate #3
   def binarySearch(arr, left, right, x):
   mid = (left + right) // 2
   if arr[mid] < x:
   return -1
   ---- candidate #4
   ※以降省略※
   入力に対する補完候補
   

   View Slide

8. takemikami’s note – http://takemikami.com/
   VS Code拡張 & PolyCoderによるコード補完の実験
   • inline-completionにPolyCoderの生成した候補を設定することで
   コード補完を行おうとする
   Copyright (C) Takeshi Mikami. All rights reserved. 8
   VS Code拡張&PolyCoderによるコード補完
   VS Code拡張 & PolyCoderによるコード補完のイメージを説明します
   VS Code拡張 & PolyCoderによるコード補完のイメージを説明します
   VS Code
   PolyCoder
   flask
   ①入力コード送信
   ②候補返却
   ③inline-completionに
   候補設定
   inline-completionの拡張実装は次のサンプルを参照
   https://github.com/microsoft/vscode-extension-samples/tree/main/inline-completions
   画面イメージ:
   処理の流れ:
   ※実用上はGitHub Copilotの利用をおすすめします（現実的な速度で動かすにはそれなりのGPUが必要等）
   

   View Slide

9. takemikami’s note – http://takemikami.com/
   VS Code拡張 & PolyCoderによるレビュー支援の実験
   • PolyCoderで文脈において該当トークンが出現する確率を求め、確率に
   応じて背景色を変更し、レビュー時に着目すべき箇所を示そうとする
   Copyright (C) Takeshi Mikami. All rights reserved. 9
   VS Code拡張&PolyCoderによるレビュー支援
   VS Code拡張&PolyCoderによるレビュー支援のイメージを説明します
   VS Code拡張&PolyCoderによるレビュー支援のイメージを説明します
   画面イメージ:
   decoratorの拡張実装は次のサンプルを参照
   https://github.com/microsoft/vscode-extension-samples/tree/main/decorator-sample
   VS Code
   PolyCoder
   flask
   ①入力コード送信
   ②トークン毎の
   確率を返却
   ③確率に応じて
   背景色を変更
   処理の流れ:
   

   View Slide

10. takemikami’s note – http://takemikami.com/
    文脈において該当トークンが出現する確率の求め方
    • 次のようにウィンドウをスライドさせながら、
    ウィンドウ(=文脈,context)において、トークン(=word)が出現する確率を求めます
    Copyright (C) Takeshi Mikami. All rights reserved. 10
    VS Code拡張&PolyCoderによるレビュー支援
    文脈において該当トークンが出現する確率の求め方を説明します
    文脈において該当トークンが出現する確率の求め方を説明します
    Hugging Face is a startup based in New York City and Paris.
    P(word|context)
    Hugging Face is a startup based in New York City and Paris.
    P(word|context)
    Hugging Face is a startup based in New York City and Paris.
    P(word|context)
    …
    トークン毎の確率計算はPerplexityの説明が参考になる
    https://huggingface.co/docs/transformers/perplexity
    ウィンドウスライドのイメージ:
    

    View Slide

11. takemikami’s note – http://takemikami.com/
    レビュー時に着目すべき箇所の明示例
    • 適当にPythonのコードを書き、
    該当トークンが出現する確率から着目すべき箇所を明示した例
    Copyright (C) Takeshi Mikami. All rights reserved. 11
    VS Code拡張&PolyCoderによるレビュー支援
    レビュー時に着目すべき箇所の明示例を紹介します
    レビュー時に着目すべき箇所の明示例を紹介します
    lossが大きいtokenから順に並べ、上位5%を濃緑・上位10%を緑・上位15%を薄緑の背景色を設定
    コード例: コード例(不自然な例):
    不自然なコード
    ※numpy, pandasのasが逆
    

    View Slide

12. takemikami’s note – http://takemikami.com/
    レビュー時に着目すべき箇所の明示例
    • 少し長めのコードの例
    • 実用には要調整
    Copyright (C) Takeshi Mikami. All rights reserved. 12
    VS Code拡張&PolyCoderによるレビュー支援
    レビュー時に着目すべき箇所の明示例を紹介します
    レビュー時に着目すべき箇所の明示例を紹介します
    リテラル・変数名に強く反応してそうなの
    で、トークンの種別ごとに背景色を変更す
    る閾値を調整するなど
    

    View Slide

13. takemikami’s note – http://takemikami.com/
    まとめと所感
    • VS Code・大規模言語モデルによって
    コード生成やレビュー支援ができる可能性を示した
    • VS Code・大規模言語モデルの組み合わせは扱いやすい
    • UI部分をVS Code・情報の分析を言語モデル に任せることができるため、ロジッ
    クに集中して実装が出来る
    Copyright (C) Takeshi Mikami. All rights reserved. 13
    本LTのまとめ・所感を示します
    本LTのまとめ・所感を示します
    

    View Slide