アロカップ

WAZM(WebAZZembly)

https://github.com/okaka8080/Aro_hackathon_frontend

Next.js

GitHub

TypeScript

Azure

Java

ブラウザ上で実行可能なx86アセンブリシミュレータ

guchi

推しアイデア

バックエンドで仮想的なCPUとメモリを実装して動かしています。また、レジスタやメモリを一目で確認できるようになっており、自分が書いたアセンブリが動いてることを実感できるデザインにしました。

作った背景

みなさんCPUにとってもお世話になってるはずなのにCPUについてあまりにも知らなさすぎなので悲しくなりました。なのでアセンブリを布教して親しみを持ってもらいたいと思いこのアイデアに至りました。

推し技術

springboot Assembly アセンブリをフロントからバックに文字列で投げてもらいますが全部自分でパースして命令やレジスタ名など解釈して、作ったCPUモデルの中で実行することに成功しました!!!!

プロジェクト詳細

概要

ブラウザ上で実行可能なx86のシミュレータです。

機能

アセンブリエディタ内に書かれたアセンブリ言語を実行します。実行結果として、仮想的なCPUのレジスタとメモリの値を出力します。実行方法は、任意の1行の命令を実行するか、エディタ上に書かれた全ての命令を1行目から実行して、最終結果のみを出力するかの2種類です。

実行可能なニーモニック

add dst src : dst += src sub dst src : dst -=src mov dst src : dst = src xchg dst src : dstとsrcの交換 cmp dst src : dst - srcをして比較

dstにメモリかレジスタ、srcにメモリかレジスタか即値(10進数)を入れます。(ただしdst, srcの両方にメモリは不可)

mul src 掛け算命令です。srcにはレジスタを指定します。 64bitレジスタを指定した場合はsrcとraxレジスタの積を取って結果の上位ビットをrdx, 下位ビットをraxに代入します。 32bitレジスタを指定した場合はsrcとeaxレジスタの積を取って結果の上位ビットをedx, 下位ビットをeaxに代入します。 16bitレジスタを指定した場合はsrcとaxレジスタの積を取って結果の上位ビットをdx, 下位ビットをaxに代入します。 8bitレジスタを指定した場合はsrcとalレジスタの積を取って結果の上位ビットをah, 下位ビットをalに代入します。

div src 割り算命令です。srcにレジスタを指定します。整数の割り算をして商をrax, 余りをrdxに代入します。

nop なにもしません。

jmp line lineに行番号を入れると次に実行する行を指定できます。

je line jz line jne line jnz line js line jns line

これらは直前のadd, sub, mov, cmp命令の結果に応じてジャンプしたりしなかったりします。 je, jzは直前の演算の結果が0であればジャンプします。 jne, jnzは直前の演算の結果が0でなければジャンプします。 jsは直前の演算の結果が負であればジャンプします。 jnsは直前の演算の結果が負でなければジャンプします。 いずれもオーバーフローは考慮されません。

syscall システムコールを発行します。本来OSが存在しないと正しく動作しませんが、このシミュレータではLinuxのwriteシステムコールをstdoutに対してのみ実行できます。つまり今の実装の中ではメモリを文字列としてdisplayにダンプする機能しかありません。 使い方としてはrax = 1, rdi = 1をセットした上でrsiに表示したいメモリ上の文字列の先頭アドレス、rdxに文字数を代入して、その後syscallとするとdisplayに指定の文字列が表示されます。

push src pop src メモリ上のスタックにプッシュとポップを行います。srcには64bitレジスタまたは16bitレジスタを指定してください。スタックは負の方向に伸びます。(push raxとすればrspが8小さくなる。)

コード例

・ディスプレイ上に"BA"と表示する

mov BYTE PTR [rax], 66 mov rax, 1 mov BYTE PTR [rax], 65 mov rdi, 1 mov rsi, 0 mov rdx, 2 syscall

・ディスプレイ上に"Hello World!!"をループで5回表示する。

mov rbx, 0 mov BYTE PTR [rbx], 72 add rbx, 1 mov BYTE PTR [rbx], 101 add rbx, 1 mov BYTE PTR [rbx], 108 add rbx, 1 mov BYTE PTR [rbx], 108 add rbx, 1 mov BYTE PTR [rbx], 111 add rbx, 1 mov BYTE PTR [rbx], 32 add rbx, 1 mov BYTE PTR [rbx], 87 add rbx, 1 mov BYTE PTR [rbx], 111 add rbx, 1 mov BYTE PTR [rbx], 114 add rbx, 1 mov BYTE PTR [rbx], 108 add rbx, 1 mov BYTE PTR [rbx], 100 add rbx, 1 mov BYTE PTR [rbx], 33 add rbx, 1 mov BYTE PTR [rbx], 33 add rbx, 1 mov BYTE PTR [rbx], 10 mov rax, 1 mov rdi, 1 mov rsi, 0 mov rdx, 14 mov r8, 5 jmp 38 mov rax, 1 syscall sub r8, 1 cmp r8, 0 jne 35

使用した技術

image

フロントエンド

・TypeScript ・Next.js ・Vercel

バックエンド

・Java ・Spring Boot ・Azure

リポジトリ

・フロントエンド https://github.com/okaka8080/Aro_hackathon_frontend ・バックエンド https://github.com/yakishamo/Aro_hackathon_backend

guchi

@guchi