Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
2019 spring WIP
Search
sksat
July 29, 2019
Programming
1
150
2019 spring WIP
sksat
July 29, 2019
Tweet
Share
More Decks by sksat
See All by sksat
探査機自作ゼミ2025スライド
sksat
3
820
人になにかを教えるときに考えていること(2025-05版 / VRC-LT #18)
sksat
5
1.2k
人工衛星開発のための C2A フレームワークとその開発体験
sksat
1
440
人工衛星の開発体験向上のために、ソフトウェアからできること
sksat
4
810
3ヶ月でできる! 探査機自作ゼミ教材自作入門
sksat
6
3.2k
セキュリティ・キャンプ全国大会2024 S17 探査機自作ゼミ 事前学習・当日資料
sksat
4
27k
AE Rust 勉強会: github-webhook-rs
sksat
0
280
万国のサーバ管理者よ, 自動化せよ!
sksat
1
7.9k
teleka.suを支える技術
sksat
1
16k
Other Decks in Programming
See All in Programming
詳しくない分野でのVibe Codingで困ったことと学び/vibe-coding-in-unfamiliar-area
shibayu36
3
5.1k
uniqueパッケージの内部実装を支えるweak pointerの話
magavel
0
1k
Swift Concurrency - 状態監視の罠
objectiveaudio
2
550
PHPに関数型の魂を宿す〜PHP 8.5 で実現する堅牢なコードとは〜 #phpcon_hiroshima / phpcon-hiroshima-2025
shogogg
1
270
非同期jobをtransaction内で 呼ぶなよ!絶対に呼ぶなよ!
alstrocrack
0
990
Web フロントエンドエンジニアに開かれる AI Agent プロダクト開発 - Vercel AI SDK を観察して AI Agent と仲良くなろう! #FEC余熱NIGHT
izumin5210
3
560
あなたとKaigi on Rails / Kaigi on Rails + You
shimoju
0
170
はじめてのDSPy - 言語モデルを『プロンプト』ではなく『プログラミング』するための仕組み
masahiro_nishimi
3
650
テーブル定義書の構造化抽出して、生成AIでDWH分析を試してみた / devio2025tokyo
kasacchiful
0
180
その面倒な作業、「Dart」にやらせませんか? Flutter開発者のための業務効率化
yordgenome03
1
130
技術的負債の正体を知って向き合う
irof
0
190
Go Conference 2025: Goで体感するMultipath TCP ― Go 1.24 時代の MPTCP Listener を理解する
takehaya
9
1.7k
Featured
See All Featured
How to Think Like a Performance Engineer
csswizardry
27
2k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
55
3k
Leading Effective Engineering Teams in the AI Era
addyosmani
7
470
Keith and Marios Guide to Fast Websites
keithpitt
411
23k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
9
980
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
21
1.2k
Bash Introduction
62gerente
615
210k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
16
1.7k
GitHub's CSS Performance
jonrohan
1032
470k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
Docker and Python
trallard
46
3.6k
What’s in a name? Adding method to the madness
productmarketing
PRO
24
3.7k
Transcript
Emscriptenを用いたx86エミュレータの ブラウザへの移植 Arch B1 sksat
背景 ・過去にx86エミュレータを作っていた ・WebAssemblyがアツい 2
WebAssemblyとは 3 ・ブラウザ上で走るアセンブリ風(?)言語 ・JavaScriptを置換するわけではない ・大してWebでもAssemblyでもない ・ブラウザ上で高速に計算できる ・LLVM 8.0で正式サポート(2019/03/20)
自作エミュレータ ・高2の時に作ったもの ・https://github.com/sk2sat/emu で公開 ・ターゲットはx86 ・コンピュータの動作原理を知りたい ・はりぼてOS(教育用の小さなOS)が動く ・マルチプラットフォームで動く → ブラウザでも動いたら楽しい!
←今回のモチベーション 4
先行事例 ・JSLinux ・v86 5
Emscriptenとは 6 ・asm.js, WebAssemblyへのコンパイラツールチェーン ・C/C++をブラウザ向けにコンパイルできる(!?)
Emscriptenとは(2) 7
とりあえずやってみる make CC=emcc CXX=emcc ・これだけではうまくいかない ・なぜ?→ファイル読み込みと画面描画ができない 8
エミュレータの構造 9 CPU G U I V G A G
L F W memory glDrawPixels fetch, read set palette read VRAM O S s t d li b flo pp y B I O S write int 0x13 read disk load “haribote.img” fread
ブラウザ上では... 10 CPU G U I V G A G
L F W memory glDrawPixels fetch, read set palette read VRAM O S s t d li b flo pp y B I O S write int 0x13 read disk load “haribote.img” fread
今回やろうとしたこと 11 CPU G U I V G A G
L F W memory glDrawPixels fetch, read set palette read VRAM O S s t d li b flo pp y B I O S write int 0x13 read disk load “haribote.img” fread
進捗どうですか? できませんでした... 12
進捗 13 CPU G U I V G A G
L F W memory glDrawPixels fetch, read set palette read VRAM O S s t d li b flo pp y B I O S write int 0x13 read disk load “haribote.img” fread できた なんもわからん
なぜできなかったのか? ・WebAssemblyでのpthreadがまだproposalだった 14 ・glDrawPixels()が使えなかった glDrawPixels()はOpenGL ES 2.0で削除 WebGLはOpenGL ES 2.0相当
やったこと ・threadが無いなら定期的に描画してしまえばいいじゃない →main()が終了するまでDOMへの操作が反映されない emscripten_sleep()を入れるとそこで更新してくれるらしい →コンパイラが落ちる 15
やったこと(2) ・glDrawPixels()が使えないなら... 元々RGBを1つの関数で表示したかったがためにOpenGLを使っていた シェーダなんもわからん そもそもemscripten_sleep()が使えないから実行中の描画ができない 16
やったこと(3) ・実行中の描画はあきらめた とりあえず終了時の画面が描画できればいい ・RGBを描画する関数が無いならcanvasに直描きすればいいじゃない 17
デモ 18 https://sk2sat.github.io/emu/demo/emu.html
今後 ・新規にx86エミュレータを作りたい https://github.com/sk2sat/eucerca ・キーボード/マウスのエミュレーション ・メモリ保護機能 ・FPGAで自作CPU 19
エミュレータの構造 20 CPU G U I V G A G
L F W memory glDrawPixels fetch, read set palette read VRAM O S s t d l i b f l op p y B I O S write int 0x13 read disk load “haribote.img” fread