Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
2019 spring WIP
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
sksat
July 29, 2019
Programming
170
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
:syncing_time:
sksat
3
970
探査機自作ゼミ2026
sksat
1
630
SIMD
sksat
1
31
同時複数機開発・運用のDevOpsサイクル高速化のための取り組み
sksat
0
1.3k
探査機自作ゼミ2025スライド
sksat
3
2.2k
人になにかを教えるときに考えていること(2025-05版 / VRC-LT #18)
sksat
6
2.5k
人工衛星開発のための C2A フレームワークとその開発体験
sksat
1
700
人工衛星の開発体験向上のために、ソフトウェアからできること
sksat
4
1.5k
3ヶ月でできる! 探査機自作ゼミ教材自作入門
sksat
6
4.1k
Other Decks in Programming
See All in Programming
ハーネス設計入門 〜プロンプト、コンテキストの次〜
kinopeee
56
38k
AGENTS.md Is Not Enough:Build Skills, Don't Download Them
lx_t
0
110
TiDB Cloudのカスタムコントローラーによるオートスケール対応
takaidohigasi
0
110
フロントエンドUIフレームワークのこれまでとこれから
ssssota
5
2.6k
大喜利で理解するLLM as a Judge / Understanding LLM-as-a-Judge through Ogiri
rockname
0
100
20260828_品質と開発生産性を両立させる、AI時代のE2Eテストの考え方
magicpod
0
210
選挙速報を多くのユーザーへ 届ける Live Activities 設計
hamayokokuririn
0
140
Swift愛好会と私(ウホーイ) / Swift Fan Club and Uhooi
uhooi
0
150
How I Stole PSI from Android Studio - DroidKaigi2026
worker8
0
120
iOSDC Japan 2026 - Swiftで作って学ぼう!データベース自作入門
kaseken
2
160
kubernetes コンポーネント開発入門 / 新卒N年目の勉強会&交流会!〜〇〇への誘い〜 #n_study
mazrean
0
230
数年滞っていたダークモード対応をおよそ2週間で完了させる
chigichan24
0
710
Featured
See All Featured
How People are Using Generative and Agentic AI to Supercharge Their Products, Projects, Services and Value Streams Today
helenjbeal
1
320
Agile that works and the tools we love
rasmusluckow
331
22k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
11
1k
Exploring anti-patterns in Rails
aemeredith
3
510
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
35
3.8k
Deep Space Network (abreviated)
tonyrice
0
300
A designer walks into a library…
pauljervisheath
211
25k
Marketing to machines
jonoalderson
1
5.8k
Highjacked: Video Game Concept Design
rkendrick25
PRO
1
460
Effective software design: The role of men in debugging patriarchy in IT @ Voxxed Days AMS
baasie
0
520
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
aleyda
1
2.1k
How to optimise 3,500 product descriptions for ecommerce in one day using ChatGPT
katarinadahlin
PRO
2
3.8k
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