シェル芸オンラインジャッジ:シェル芸実行用コンテナを常に待機させておく

はじめに シェル芸オンラインジャッジというウェブサイトを開発しています。 今回は実行結果が返ってくるまでに10秒程度かかっている問題に対応しました。 元々はシェル芸を受け付けてからDockerコンテナを起動していたのですが、 コンテナ起動に時間がかかっているようだったので、 シェル芸実行用コンテナを常に待機させておくことで応答速度の向上を目指しました。 シェル芸オンラインジャッジ 修正方法について シェル芸オンラインジャッジのソースコードを丸ごとGeminiに渡して、 具体的に修正方法を教えてもらっています。 コンテナ管理スクリプトを作成 GeminiにDockerコンテナを管理するスクリプトを書いてもらいました。 少し修正していますが、基本的にはGeminiの出力そのままです。 行数がそこそこあるのでリンクだけ貼ります。 backend/scripts/container_manager.py このスクリプトでは常にN個(現状N=3)のDockerコンテナを待機させる処理が書いてあります。 シェル芸実行用コンテナは使い捨てなので、 一度シェル芸を実行したコンテナは破棄して、 その分を補充します。 シェル芸実行スクリプトの修正 元々はシェル芸実行スクリプトでコンテナを作成していましたが、 container_manager.pyから起動中のコンテナを受け取って、 そのコンテナでユーザのシェル芸を実行するように修正しました。 backend/scripts/run_shellgei.py 応答速度が向上した ちゃんと計測はしていませんが、 元々はシェル芸の実行結果が返ってくるまで10秒程度かかっていました。 シェル芸実行用コンテナを常に待機させておくことで、 すぐに結果が返ってくるようになりました。 やはりコンテナの起動に時間がかかっていたようです。 おわりに 今回はシェル芸オンラインジャッジのパフォーマンス向上を目指して、 シェル芸実行用コンテナを常に待機させておくように変更しました。 すぐに実行結果が返ってくるようになってよかったです。 それでは、また。

2026年2月2日 · Yusuke Kato

シェル芸オンラインジャッジ:システム全体をDockerコンテナ内で動かす

はじめに シェル芸オンラインジャッジというウェブサイトを開発しています。 今回はフロントエンドとバックエンドをDockerコンテナ内で動かすように変更しました。 nginxもコンテナ内で動かしています。 シェル芸オンラインジャッジ 修正方法について シェル芸オンラインジャッジのソースコードを丸ごとGeminiに渡して、 具体的に修正方法を聞いて修正しました。 今回はDockerfileやdocker-compose.yml、nginxのconfファイルなどについて教えてもらいました。 シェル芸オンラインジャッジのシステム構成図 Nano Banana Proに生成してもらった現状のシステム構成図です。 システム構成 Dockerfile Frontend 下記がフロントエンドのDockerfileです。 主にフロントエンド側のビルドとnginxの設定・起動を行っています。 問題データのファイルもコンテナ内にコピーしています。 # --- Build Stage --- FROM node:22 AS builder WORKDIR /app COPY frontend/package.json frontend/yarn.lock* ./ RUN yarn install --frozen-lockfile COPY frontend/ ./ RUN yarn build # --- Serve Stage --- FROM nginx:alpine # ビルド成果物をNginxの公開ディレクトリにコピー COPY --from=builder /app/build /usr/share/nginx/html # 問題データを公開ディレクトリにコピー COPY problems/ /usr/share/nginx/html/ # Nginx設定ファイルをコピー COPY frontend/nginx/default.conf /etc/nginx/conf.d/default.conf EXPOSE 80 CMD ["nginx", "-g", "daemon off;"] nginxの設定ファイルはあらかじめ用意しておいてコンテナ内へコピーします。 一応80番ポートの設定を書いていますが、実際は443ポートだけ受け付けます。 ...

2026年2月1日 · Yusuke Kato

Dockerコンテナのリソースの制限を設定【シェル芸オンラインジャッジ】

はじめに シェル芸オンラインジャッジというウェブサイトを開発しています。 今回はユーザが入力したコマンドを実行するDockerコンテナにメモリやCPUなどのリソースの制限を設定しました。 シェル芸オンラインジャッジ 設定内容 設定前 Pythonスクリプトからコンテナを実行しています。 元々はネットワークの制限だけ設定していました。 container = self.client.containers.run( self.image_id, detach=True, command="sleep 60", ipc_mode="none", network_mode="none", ) 設定後 メモリ、CPU、プロセス数、権限、データサイズの制限を設定しました。 container = self.client.containers.run( self.image_id, detach=True, command="sleep 60", ipc_mode="none", network_mode="none", mem_limit="512m", # メモリ制限 memswap_limit="512m", # スワップ制限 nano_cpus=500000000, # CPU使用率制限 (0.5 CPU) pids_limit=50, # 最大プロセス数制限 cap_drop=["ALL"], # 権限制限 tmpfs={"/media": "size=100M"}, ulimits=[ # fsize (file size): 1プロセスが作成できる最大ファイルサイズ(バイト単位) docker.types.Ulimit(name="fsize", soft=50000000, hard=50000000) ], ) 設定の動作確認 設定が正しく行われているか確認してみます。 ...

2026年1月31日 · Yusuke Kato

Google AI Studioで自作のウェブサイトの改善点を教えてもらった

はじめに 私が運営しているシェル芸オンラインジャッジというウェブサイトはまだまだ改善点があります。自分で一つ一つ改善していくのももちろん良いですが、最近の生成AIは私よりもはるかに優秀なので改善してもらえるところはしてもらおうと思い立ちました。 シェル芸オンラインジャッジ 使ったもの Google AI Studio Geminiにリポジトリ丸ごと読み込んで改善点を教えてほしいとお願いしたら、Google AI Studioを使うといいよと教えてくれました。ということで使ってみます。 Google AI Studio Gitingest Google AI Studioにリポジトリを丸ごと渡そうと思ったのですが、 ファイル一つずつしか渡せなさそうだったので、 GitingestというサービスにGitHubリポジトリURLを入力することで、 一つのファイルにまとめてもらいました。 とても便利です。 Gitingest プロンプト Google AI Studioに下記のように入力しました。 プロンプトのセオリーはよく分かっておらず、 かなり雑なお願いの仕方ですが、 Google AI Studioはいい感じに改善案を列挙してくれました。 アップロードしたファイルは私が開発しているシェル芸オンラインジャッジというウェブサービスのソースコードです。react,fastapi,docker,nginxなどを使っています。ユーザがブラウザから入力したシェルのコマンドをサーバのdockerコンテナ上で実行して、実行結果をユーザへ返すサービスです。改善案を考えてほしいです。候補として、セキュリティ、システム構成、パフォーマンス向上、問題データの形式と扱い方(現状テキストファイルで保持、テキストファイルをそのまま取得している)、リファクタリングなどです。その他にも改善案があれば教えてほしいです。 改善案 Google AI Studioの出力をそのまま載せるととても長くなるので箇条書きしておきます。 セキュリティ コンテナ起動時にCPUやメモリなどのリソースの制限を設定したほうがよい コンテナ内でコマンドを実行するユーザ権限を変更したほうがよい コンテナ内でネットワーク遮断の設定をさらに強化したほうがよい パフォーマンス向上 ユーザからのリクエストをキューに入れて順番に実行したほうがよい コンテナの起動に時間がかかるのであらかじめ起動しておいて待機させておくとよい データベースを導入してログを管理したほうがよい 問題データの管理 JSON形式で問題データを管理してAPI経由で取得するとよい リファクタリング 本番環境とローカル環境でURLを手動で書き換えているが設定ファイルを別で用意したほうがよい App.tsxでStateを使い過ぎているので対応が必要 判定処理 画像比較は完全一致だと安定しないのでcompareコマンドなどで類似度を基準にしたほうがよい 文字列末尾の空白や改行の削除はrstrip()を使ったほうがよい その他 docker-composeでローカルの開発環境を起動できるとよい GitHub Actionsから直接デプロイできるとよい SNSへのシェア機能があるとユーザ同士の交流が増えてよい この後 さらに詳しく修正案を聞いて修正していこうと思います。 おわりに 今回はシェル芸オンラインジャッジの改善案をGoogle AI Studioに聞いてみました。 たくさん改善案を出してもらえたので対応していきたいと思います。 便利な世の中になりましたね。 それでは、また。

2026年1月30日 · Yusuke Kato

シェル芸オンラインジャッジの紹介

はじめに 本記事の概要 本記事では、シェル芸(シェルのワンライナー)で問題を解いて遊べる「シェル芸オンラインジャッジ」を紹介します。 シェル芸オンラインジャッジは、シェル芸用の問題とユーザが実行したコマンドの出力結果の自動正誤判定機能を提供します。 シェル芸とは何か シェル芸のトップページでシェル芸が定義されています。 シェル芸の定義↓ マウスも使わず、ソースコードも残さず、GUIツールを立ち上げる間もなく、あらゆる調査・計算・テキスト処理をCLI端末へのコマンド入力一撃で終わらすこと。あるいはそのときのコマンド入力のこと。 引用元:シェル芸のトップページ シェル芸オンラインジャッジについて シェル芸オンラインジャッジとは何か シェル芸オンラインジャッジは、シェル芸(シェルのワンライナー)で様々な問題を解いて遊べるウェブサイトです。 自動で正誤判定も行われます。 その他に、練習問題やすべての問題の回答例もあるため、学習用途でも利用できるかと思います。 2023年5月3日に運営を開始してアップデートを重ねながら現在まで稼働しています。 シェル芸オンラインジャッジの概要 下記のリンクからシェル芸オンラインジャッジにアクセスできます。 ウェブサイト:シェル芸オンラインジャッジ このようなページが表示されます↓ シェル芸オンラインジャッジ シェル芸オンラインジャッジのソースコードはGitHubで公開しています。 GitHub:シェル芸オンラインジャッジ シェル芸オンラインジャッジの特徴 主なシェル芸オンラインジャッジの特徴は下記の通りです。 シェル芸で問題を解いて遊べる 自動で正誤判定できる パソコンでもスマホでも遊べる ソースコードをGitHubで公開 通常問題に加えて練習問題と画像問題もある すべての問題の回答例も掲載 シェル芸オンラインジャッジのコミュニティ GitHubのコミュニティが存在します。 GitHub:シェル芸オンラインジャッジのコミュニティ その他に、mixi2のコミュニティも存在します。 mixi2:シェル芸オンラインジャッジのコミュニティ シェル芸オンラインジャッジの遊び方 シェル芸オンラインジャッジでの遊び方を説明します。 まず問題を選択します。 通常問題に加えて、練習問題と画像問題もあります。 2025年1月2日現在では合計85問です。 問題選択 問題を選択して「決定」ボタンを押すと、 問題文と入力、想定出力が表示されます。 入力はシェル芸実行時にinput.txtから取得できます。 また、シェル芸の出力結果は想定出力に従う必要があります。 問題情報 ユーザがシェル芸を入力して実行します。 コマンドボタンを押すとコマンドを入力できて便利です(特にスマホで便利です)。 シェル芸入力 シェル芸の実行ボタンを押すと正誤判定が自動で行われます。 正解と表示されたらその問題はクリアです。 間違いの場合は不正解と表示されます。 正誤判定 下図のように画像問題も用意してあります。 画像問題 すべての問題の回答例も掲載しているのでぜひご参照ください。 回答例 遊び方の説明は以上です。 シェル芸オンラインジャッジの構成 シェル芸オンラインジャッジは下図のように構成されています。 ユーザがブラウザ上でシェル芸を入力してサーバへ送信し、 サーバがDockerコンテナ内でそのシェル芸を実行して出力結果と正誤判定結果をユーザへ返します。 2026年2月1日、Dockerコンテナ内でシステム全体を動かせるようになりました。 新しい構成:2026/02/01現在(Nano Banana Proで生成) ...

2025年1月2日 · Yusuke Kato