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
160
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
2019 spring WIP
sksat
July 29, 2019
More Decks by sksat
See All by sksat
同時複数機開発・運用のDevOpsサイクル高速化のための取り組み
sksat
0
1.2k
探査機自作ゼミ2025スライド
sksat
3
2.1k
人になにかを教えるときに考えていること(2025-05版 / VRC-LT #18)
sksat
6
2.4k
人工衛星開発のための C2A フレームワークとその開発体験
sksat
1
630
人工衛星の開発体験向上のために、ソフトウェアからできること
sksat
4
1.4k
3ヶ月でできる! 探査機自作ゼミ教材自作入門
sksat
6
4k
セキュリティ・キャンプ全国大会2024 S17 探査機自作ゼミ 事前学習・当日資料
sksat
4
34k
AE Rust 勉強会: github-webhook-rs
sksat
0
330
万国のサーバ管理者よ, 自動化せよ!
sksat
1
8.3k
Other Decks in Programming
See All in Programming
【SRE NEXT 2026 Lunch Session】一人目専任SREの立ち上げを加速する ― AIと進めたオンボーディングで2分を0.04秒にした話
pkshadeck
PRO
0
2.8k
なぜ型を書くのか? TSKaigi2026で改めて考える #tskaigi_smarthr
kajitack
0
380
えっ!!コードを読まずに開発を!?
hananouchi
0
220
地域 SRE コミュニティ最前線 - ホンマでっかSRE勉強会
tk3fftk
0
250
なぜ関数型プログラミングで「型」と「証明」が語られるのか #fp_matsuri
kajitack
3
960
コーディングルールの鮮度を保ちたい for SRE NEXT 2026 / keep-fresh-go-internal-conventions-sre-next-2026
handlename
0
140
Claude Opus 4.6以後の受託開発エンジニアの変化(Claude Code開発ノウハウ大公開スペシャルbyクラスメソッド)
iidatakuma
1
800
AI時代の仕事技芸論〜ソフトウェア開発で「遊ぶように働く」職人的熟達のすすめ(スクフェス仙台 2026バージョン)
kuranuki
0
660
Welcome to the "Parametricity" 🏙️ − Generic だけど Specific な世界 −
guvalif
PRO
1
170
関数型プログラミングのメリットって何だろう?
wanko_it
0
180
【やさしく解説 設計編 #1】「ドメイン駆動」と「実装駆動」ってなに? 〜設計の考え方を、たとえ話で学ぼう〜
panda728
PRO
1
120
SLOをサービス品質の共通言語にするために 取り組んできたこと
wakana0222
0
510
Featured
See All Featured
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
10
1.3k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
46
2.9k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
37
6.5k
Agile that works and the tools we love
rasmusluckow
331
22k
Rails Girls Zürich Keynote
gr2m
96
14k
How to Get Subject Matter Experts Bought In and Actively Contributing to SEO & PR Initiatives.
livdayseo
0
150
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
11
970
Visual Storytelling: How to be a Superhuman Communicator
reverentgeek
2
590
Art, The Web, and Tiny UX
lynnandtonic
304
22k
Design in an AI World
tapps
1
260
Measuring & Analyzing Core Web Vitals
bluesmoon
9
880
The SEO identity crisis: Don't let AI make you average
varn
0
520
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