Windows11PCでの推論実行時のVRAM消費量と消費電力を調べました。
GPU：GeForce RTX 4070Ti 12GB
LLM : ELYZA-japanese-CodeLlama-7b
プロンプト：Swiftコードに関する簡単な補足依頼。回答まで1分10秒程度。
VRAM消費量測定：nvidia-smiコマンド
消費電力測定：SwitchBotミニプラグのアプリ画面から読み取り
VRAM消費量はほぼ12GBでフル使用でした。消費電力は最大168Wで電源ユニット750Wに対してかなり余裕がありました。
# 1秒おきにGPU使用状況を表示
nvidia-smi -l 1
昨年の今頃はChatGPTアプリ製作、RWKVなどローカルLLMの検証に取り組んでいました。
あれから1年が経ちローカルLLMの現状を調べているとプログラミング補助に特化したLLMを見つけたので、簡単に検証してみました。ELYZA-japanese-CodeLlama-7bというモデルです。CodeLlamaはMetaが開発しているモデルになります。
Windows11PC(RAM 64GB, RTX 4070Ti 12GB)でSwiftについてプロンプトを送ったところ、1分9秒で回答がありました。残念ながら使えないコードでした。ただ、このモデルのデモサイトではGPT-4と同じく正しいコードを返してきます。パラメータを調整する必要があるみたいです。
Google ColabでV100やA100でも検証してみて、VRAM依存が明確になりましたら、RTX 4070 12GBとの2枚挿しを検討したいところです。
話題のClaude 3 (Sonnet)を即席評価しました。
またもやGPT-4の圧勝でした。2月に評価したGeminiと同じく読解力が不足しています。なお最上級のOpusはサブスクかAPIでないと使えないようです。
OpenAIが法人営業で苦戦しているとの記事を目にしました。用途によるとは言え、買い手はAIの実力を正当に評価できているのか、はなはだ疑問です。他社サービスは文章生成では優れているのでしょうか。
インフルエンサーもインプットとアウトプットの量だけで評価しているふしがあり、質を網羅的にはほとんど見ていないですね。ちゃんと目利きができる方の出現を望みます。
プログラミング補助用途では、GPT-4の牙城は揺るぎないといったところです。
ただOpenAIには殿様商売的な姿勢が垣間見られ、アンチが多い感じがします。昨年11月、GPT-4 Turbo(gpt-4-1106-preview)のリリースについてはメールで案内がありましたが、今年1月のgpt-4-0125-previewリリースでは一切ありませんでした。この点については、かなり不満があります。
グチは置いといて、後発のGemini、Claudeはより大量な情報を処理し要約・創出するのが得意で、GPTの方はインプット側の足りない情報を補完するつまり行間を読む能力に長けている、という私なりの結論に至りました。
※バージョン番号を取得する方法も含めて聞いているのだが、こちらの意図を読み取ることができない。
コード例を示している時点で指示者が中級者であることを察するべき。指示者がTextストラクチャを使えているのにその使い方を回答するのは流石にアウトです。単なる学習データ不足か。
[Mac M2 Pro 12CPU, Ventura 13.6, Python 3.10.4]
DALL-E 3からAPIで使えるようになったので、早速試してみました。
生駒山近景を出力したところ存在しないロープウェイを含む景色でした。2回目は信仰の山らしく祠の画像でした。六甲山も出してみました。
どうも画のタッチが好みではありません。そこら辺を調整できれば、使い出がありそうです。
# openaiライブラリを導入済みの場合はアップグレードする(旧Verにはopenai.OpenAIがない)
pip install --upgrade openaiimport os
from openai import OpenAI
# 環境変数からAPIキーを取得
api_key = os.getenv('CHATGPT_API_KEY')
if not api_key:
raise ValueError("OpenAI API Keyが環境変数に設定されていません")
# APIキーを設定
os.environ["OPENAI_API_KEY"] = api_key
client = OpenAI()
response = client.images.generate(
model="dall-e-3",
prompt="大阪府・奈良県にある生駒山の近景",
size="1024x1024",
quality="standard",
n=1,
)
image_url = response.data[0].url
print(image_url)
[Mac M2 Pro 12CPU, MacOS Ventura 13.6, clang 15.0.0]
自製ChatGPTアプリをGPT-4 Turbo with visionに対応させました。
画像のURLを送ると内容を読み取り、プロンプトに対応します。
漢字、ひらがな、カタカナなど非ラテン文字は読めません。これらが画像に含まれているとレスポンスしなくなるので、モザイクを掛けるなり前処理が必要です。
プログラミングでUIについて質問する際に画像を使うとやりやすいです。特に見てほしいところを色線で囲むなど、工夫を入れるとより深い分析をしてくれます。ここまでできるとプログラミングスクールにとどまらず教育業界全体が相当な危機でしょう。
GPT-4までは心強いパートナーという感じでしたが、with visionになって凄まじい眼力を身に付け、いささか脅威を覚えるようになりました。
今のAIがどのような状況になっているのか、もっと周知しないとヤバい気がします。
[Mac M2 Pro 12CPU, MacOS Ventura 13.5, clang 14.0.3]
自製ChatGPTアプリに関する記事は3月以来5ヶ月ぶりです。記事にはしていませんが、これまで何度も更新を重ねグレードアップしています。
ChatGPTアプリでのやりとりはjsonファイルとして保存しています。大分ファイルがたまってきたため、年月フォルダ(今月の場合は”2308″)を自動作成して振り分けるMovJSボタンを実装しました。
ChatGPTにコードを書いてもらいました。一応コードはチェックして問題なさそうなのでビルド&実行したところ一発で成功しました。
実装完了までものの10分です。AIアシストでプログラミングすると生産性爆上がりです。
#include <iostream>
#include <filesystem>
#include <fstream>
namespace fs = std::filesystem;
void movJSONCB(Fl_Widget*, void*){
fs::path srcDir = "/ChatGPT";
// srcDirにあるjsonファイルのpathをリスト化する
std::vector<fs::path> jsonFiles;
for (const auto& entry : fs::directory_iterator(srcDir)) {
if (entry.path().extension() == ".json") {
jsonFiles.push_back(entry.path());
}
}
// ファイル名の先頭4文字のフォルダを作成する
for (const auto& jsonFile : jsonFiles) {
std::string folderName = jsonFile.filename().stem().string().substr(0, 4);
fs::path folderPath = srcDir / folderName;
// フォルダがすでに存在する場合は上書き作成しない
if (!fs::exists(folderPath)) {
fs::create_directory(folderPath);
}
// ファイルをそれぞれのフォルダに振り分ける
fs::path destinationPath = folderPath / jsonFile.filename();
fs::rename(jsonFile, destinationPath);
}
}先月7月からOpenAIへ1ドル以上の支払実績のあるユーザーにGPT-4 API利用資格が付与されるようになりました。
低課金ユーザーの私は7月0.52ドル、8月1.5ドルの支払いでようやく資格を得ることができましたが、今のところGPT-4を使える状態になっていません。
モデルの利用可否はOpenAIサイトのPlaygroundで確認できます。
Bingで使った感触ではGPT-4は能書きが多いだけでコーディングのアシストには余り向いていない印象ですが、早く突っ込んだ検証をしたいです。
23/08/09追記
23時の時点でGPT-4 APIを使えるようになっていました。これから検証に取り掛かります。
[M1 Mac, MacOS Ventura 13.3.1, clang 14.0.3]
これは簡単に実装できました。15分位でしょうか。
これで基本的な機能は一通り備わったように思います。ボードによってはまれにスレッドタイトル読込で落ちてしまったりしますが、ぼちぼち直していきます。
ソースファイルが13個になり分かりにくくなってきたので、複数フォルダへの振り分けを検討しています。
高度な検索にかけたり、過去ログも含めて管理するのでしたらMySQLなどデータベースの出番もあるのでしょうが、今の用途であれば都度2次元ベクター化で事足りますね。
#include "cppstd.h" // 自製ライブラリ
#include "MyTable.h"
extern vector<tuple<string, string, string, string>> numTitlePostnumID;
extern Fl_Input* searchInput;
extern MyTable* table;
void threadSearch(Fl_Widget *w, void*){
vector<tuple<string, string, string, string>> searchResult;
const char* word = searchInput -> value();
for (const auto& tuple : numTitlePostnumID) {
string title = std::get<1>(tuple);
if (title.find(word) != string::npos) {
searchResult.push_back(make_tuple(std::get<0>(tuple), std::get<1>(tuple), std::get<2>(tuple), std::get<3>(tuple)));
}
}
int hitNum = searchResult.size();
numTitlePostnumID = searchResult;
table->SetSize(hitNum, 5);
}[M1 Mac, MacOS Ventura 13.3.1, clang 14.0.3]
画像のURLをマウスオーバーするとぼかし画像がポップアップ表示され、クリックすると加工無しの画像がポップアップ表示されるようにしました。
ここが山場になるかと構えていましたが、思っていたよりもあっさりでした。それでもChatGPTを駆使しながら4時間程度掛かっています。
最も手こずったのはクリックして指定サイズでポップアップさせるところでしょうか。どうしても普通にリンクを踏む形になって大きいサイズでの埋め込み表示になってしまいました。結局、event.preventDefault()でデフォルトのリンク処理をスキップして解決しました。
たまにポップアップの後に影が残ったりしますが、後日対応することにします。
<html lang="ja">
<HEAD>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="styles.css" />
<script type="text/javascript" src="function.js"></script>
<STYLE TYPE="text/css">
.popup-image {
position: absolute;
top: 0;
left: 300px;
width: 300px;
height: auto;
display: none;
filter: blur(10px); // ぼかし加工
}
.popup-image2 {
position: absolute;
top: 0;
left: 300px;
width: 500px;
height: auto;
display: none;
}
</STYLE>
</HEAD>
<BODY bgcolor="#ffffff">
<p id ='1'><font size="2" color="#008080">1 : テスト<br></font>
<font size="2" color="#000080">2023/07/22(土) 10:23:46.76 ID:xxx<br></font>
<font size="2" color="#000B00"> テスト <br> <a href="画像のURL"
rel="noopener noreferrer" onmouseover="showImage(this,event);" onmouseout="hideImage();"
onclick="showImage2(this,event);">画像のURL</a>
</font></p>
<script>
// ぼかしあり画像表示
function showImage(element,event) {
var imageSrc = element.getAttribute("href");
var imageElement = document.createElement("img");
imageElement.src = imageSrc;
imageElement.classList.add("popup-image");
document.body.appendChild(imageElement);
imageElement.style.display = "block";
var rect = imageElement.getBoundingClientRect();
var y1 = rect.top;
console.log("Popup y1 = " + y1);
var y2 = event.clientY;
console.log("Popup y2 = " + y2);
var y = -y1 + y2 -100;
if (y < -y1){
y = -y1;
}
console.log("Popup y = " + y);
imageElement.style.top = y;
}
// ぼかしなし画像表示
function showImage2(element,event) {
event.preventDefault();
var imageSrc = element.getAttribute("href");
var imageElement = document.createElement("img");
imageElement.src = imageSrc;
imageElement.classList.add("popup-image2");
document.body.appendChild(imageElement);
imageElement.style.display = "block";
var rect = imageElement.getBoundingClientRect();
var y1 = rect.top;
console.log("Popup y1 = " + y1);
var y2 = event.clientY;
console.log("Popup y2 = " + y2);
var y = -y1 + y2 -100;
if (y < -y1){
y = -y1;
}
console.log("Popup y = " + y);
imageElement.style.top = y;
}
// 画像消去
function hideImage() {
var popupImages = document.getElementsByClassName("popup-image");
while (popupImages.length > 0) {
var image = popupImages[0];
image.parentNode.removeChild(image);
}
var popupImages2 = document.getElementsByClassName("popup-image2");
while (popupImages2.length > 0) {
var image2 = popupImages2[0];
image2.parentNode.removeChild(image2);
}
}
</script>
</BODY></html>[M1 Mac, MacOS Ventura 13.3.1, clang 14.0.3]
前回の設定ではポップアップのTOP位置が絶対座標のゼロだったため、スクロールすると見えなくなってしまいます。
ホバーした時のFl_WebView上端Y座標を基準にTOP設定することで常にGUI上にポップアップが出現するようにしました。
Google Chromeの検証画面でY座標を出力させながら動作確認しました。生成するHTMLはサイズが倍になりましたが、表示速度は体感では変わらずでした。
今回はJavaScript初学者にはキツい内容でした。4時間ほど掛かったでしょうか。ChatGPTはまあまあ貢献してくれました。
<html lang="ja">
<HEAD>
<meta charset="utf-8">
<STYLE TYPE="text/css">
A:link { color: #0000ff;
text-decoration: none; }
A:visited { color: #008080;
text-decoration: none; }
A:hover { color: #ff0000;
text-decoration: underline; }
body {
font-family:"Helvetica","ヒラギノ角ゴ";
margin-left: 20px;
}
.tips {
position: absolute;
top: 0px;
left: 100px;
visibility:hidden;
background-color: #E0FFFF;
margin-left:2%;
padding:1em;
}
</STYLE>
<script>
function showPopup(id) {
if(document.getElementById){
var element = document.getElementById(id);
element.style.visibility = (element.style.visibility == 'visible')? "hidden": "visible";
var rect = element.getBoundingClientRect(); // ホバー時のFl_WebViewを取得する
var y = rect.top; // 上端のY座標を取得する
console.log("Popup y = " + y); // Y座標を出力
element.style.top = -y + 20; // Y座標に-1を掛け20px下へずらした位置をTOPとする
}
}
</script>
＜以下略＞// GUI表示用
<p><font size="2" color="#008080">5 : 投稿者名 <br>
</font><font size="2" color="#000080">2023/07/22(土) 18:48:05.94 ID:xxx<br>
</font><font size="2" color="#000B00"> <span onmouseover = "showPopup(2);" onmouseout = "showPopup(2);">
<a href="../test/read.cgi/xxx/2" rel="noopener noreferrer" target="_blank">>>2</a>
</span> <br> 本文 </font></p>
// ポップアップ用
<p id="5" class="tips"><font size="2" color="#008080">5 : 投稿者名 <br>
</font><font size="2" color="#000080">2023/07/22(土) 18:48:05.94 ID:xxx<br>
</font><font size="2" color="#000B00"> <span onmouseover = "showPopup(2);" onmouseout = "showPopup(2);">
<a href="../test/read.cgi/xxx/2" rel="noopener noreferrer" target="_blank">>>2</a>
</span> <br> 本文 </font></p>