用 javascript 模擬超任
DESCRIPTION
COSCUP 2012 presentation, javascript SNES emulatorTRANSCRIPT
![Page 1: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/1.jpg)
用 Javascript 模擬超任
魏澤人
![Page 2: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/2.jpg)
•國立東華大學應用數學系 助理教授•Hacker
![Page 3: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/3.jpg)
簡單的歷史
• JSSpeccy (2008)• JSC64 (2009)• JSNES (2009) • 一些 Gameboy 模擬器 (2010-2011)• JSLinux (2011)• JavaScript-65816 (2012)
![Page 4: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/4.jpg)
硬體表Release CPU Video Memory
ZX 1982 Z80 3.5Mhz 256×192 15 color
16/48/128kb
C64 1982 6510 1Mhz 320x20016 color
64k ram20k rom
NES 1983 65021.79Mhz
256x22448 color16 sprites
2k ram8k sram32krom
SNES 1990 65c816 3.58Mhz
256x224(512x478)15bit color128 sprites 4 BG
![Page 5: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/5.jpg)
![Page 6: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/6.jpg)
![Page 7: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/7.jpg)
![Page 8: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/8.jpg)
![Page 9: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/9.jpg)
Live Demo 的機器 CPU 是 T5600
![Page 10: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/10.jpg)
Try it athttp://weijr.b81.org/xnes/
SnesEmu.html (try this first)SnesWW.html (firefox linux 64)SnesWW2.html (multicore android)Snes9x.html (very fast computer)
![Page 11: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/11.jpg)
•PySX: 用 Python 寫的 Playstation 模擬器•利用 Python 來瞭解原理• 模擬了大部分的 CPU, IO• 能 Boot BIOS• 只缺 GTE , CD-ROM 就能跑遊戲• 但太慢
![Page 12: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/12.jpg)
如何五天內做出 JS 超任模擬器
![Page 13: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/13.jpg)
當時的計畫是: PS 模擬器都在寫了,超任模擬器算什麼,估計十天就能完成了
![Page 14: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/14.jpg)
Day 1: 吃完晚飯後,找到一些文件資料,和 source code ,完成 rom file loader
![Page 15: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/15.jpg)
Day 2: 發現狀況不太對,好像有點複雜CPU 指令集有五種模式, PPU 有 8 種還有變化型,而且(當時)找到的文件不像 PS 那麼完整。決定使用 SNEM 配合 Emscripten
![Page 16: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/16.jpg)
•Emscripten 是 LLVM byte code to JS 翻譯器•用了 Typed Array•可模擬 SDL , opengl , libc• Demo: Games, Python 直譯器• Compile 有點慢
![Page 17: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/17.jpg)
•SNEM 是很簡單但是很快的超任模擬器•使用 Allegro•選擇改寫成 SDL
![Page 18: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/18.jpg)
![Page 19: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/19.jpg)
![Page 20: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/20.jpg)
程式碼也許很亂但只要是 Open Source 就型
![Page 21: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/21.jpg)
![Page 22: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/22.jpg)
Day 3: 很忙,所以沒有動。
![Page 23: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/23.jpg)
Day 4: •成功改成 SDL• Emscripten 轉成 .js • 似乎能用 node 跑(沒有畫面)• 不確定對不對 ? • 用 ASCII 方式檢查
![Page 24: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/24.jpg)
![Page 25: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/25.jpg)
![Page 26: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/26.jpg)
Day 5: •轉成 .html•修正顏色問題•修正 emscripten SDL 鍵盤輸入 bug
![Page 27: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/27.jpg)
![Page 28: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/28.jpg)
Day 6- Now
•加入 File API•嚐試 Web Workers•去除 SDL overhead•Porting Snes9x•加速•更正天空顏色等 bug•修正位元對齊問題
![Page 29: 用 Javascript 模擬超任](https://reader033.vdocuments.mx/reader033/viewer/2022061609/5554b060b4c90502618b55b7/html5/thumbnails/29.jpg)
Now –
•Gamepad API•Multitouch API•更有效運用 workers•聲音•Auto framerate