周末在 GitHub 上看到有人把原版的《超级玛丽》汇编加上了详细的注释: https://gist.github.com/1wErt3r/4048722,差不多算是开源了吧:)
于是想起之前捣鼓的一个玩具 《机器指令翻译成 Javascript 》,做了一些改进,加上了 NES 的接口,例如图像、声音、手柄等。
然后和之前文中说的一样,将 6502 ASM 「翻译」成 C,然后再通过 emscripten 「编译」成 Javascript:
演示: https://www.etherdream.com/FunnyScript/smb-js/game.html
由于最新版的浏览器会把 asm.js 代码自动转成 WebAssembly,所以部分浏览器初始化比较慢,比如 Chrome 启动需要等好几秒。像 FireFox 会缓存 asm.js 的解析,所以只有首次加载会慢。
需要注意的是,这不是模拟器!最明显的特征,就是性能。
点击 Benchmark 按钮可测试游戏逻辑的极限 FPS,目前最快的是 Firefox,在我笔记本上可以跑到 19 万 FPS !就算 IE10 也能跑到 600 FPS。( IE10 以下的浏览器不支持)
当然,这还只是没做任何性能优化的结果,之后还会尝试更好的翻译方案,比如指令层的 call/jump 尽可能翻译成代码层的函数调用、分支代码等。希望能达到 50 万 FPS 以上
1 missdeer 2018-01-23 11:19:47 +08:00 这一波 666 |
![]() | 2 toou123 2018-01-23 11:48:48 +08:00 小心被任天堂告了...(手动笑哭) |
3 ljbljb007 2018-01-23 11:48:53 +08:00 有 bug 啊 带子弹的玛丽被小怪碰一下不是变成没子弹的玛丽吗? 这里怎么直接变小了? |
![]() | 4 zjcqoo OP @ljbljb007 原版的超级玛丽在线模拟器: https://jsnes.fir.sh/run/Super%20Mario%20Bros.%20(JU)%20(PRG0)%20[!].nes |
![]() | 5 imdoge 2018-01-23 12:41:13 +08:00 好难跳…… 另外按着前进怎么就跳不高。。难道我需要机械键盘 |
6 jiqing 2018-01-23 12:49:21 +08:00 我一直在看关于 6502 模拟器的资料,想用 Java 写一个,看底层看得相当蛋疼 |
![]() | 7 tinytin 2018-01-23 13:13:47 +08:00 竟然连第一关都过不去了。。。。 |
8 civet 2018-01-23 14:03:17 +08:00 看到楼上几位同学,好像还没发现 B 键的用处…… |
![]() | 9 northisland 2018-01-23 14:18:34 +08:00 一不小心就点了 2 下收藏 |
![]() | 10 droiz 2018-01-23 14:28:30 +08:00 Firefox 太可怕了,我的 2014 年中独显 macbookpro,ff 可以跑 214285FPS,chrome 只有 28407FPS |
![]() | 11 basstk 2018-01-23 14:29:50 +08:00 勾起了小时候的回忆,厉害了我的哥 |
![]() | 12 goldenlove 2018-01-23 14:34:03 +08:00 游戏不错,但再也找不回当时的感觉了~ 可支持手柄不? |
![]() | 13 cy97cool 2018-01-23 14:38:09 +08:00 强烈建议加一个存档功能。。。 |
![]() | 14 zjcqoo OP @goldenlove 可以支持。改天我加上。 |
![]() | 16 gluttony 2018-01-23 15:15:00 +08:00 |
17 newtype0092 2018-01-23 15:28:16 +08:00 @ljbljb007 你玩到山寨版了 |
![]() | 18 luoway 2018-01-23 15:30:38 +08:00 nice! 跳是 I 键 蹲是哪个键? |
![]() | 19 qipan0321 2018-01-23 15:32:57 +08:00 看了楼主的博客园,真的强! |
20 MonoLogueChi 2018-01-23 15:47:15 +08:00 via Android 建议加上虚拟按键,方便在手机上玩 |
21 lneoi 2018-01-23 16:12:57 +08:00 这个可真的是会被告... |
![]() | 22 zjcqoo OP |
![]() | 23 master13 2018-01-23 17:20:54 +08:00 厉害厉害! |
![]() | 24 fy 2018-01-23 17:40:46 +08:00 大概这就是大佬吧 膜拜 |
![]() | 25 xi4ohz 2018-01-23 17:48:38 +08:00 同看了楼主的博客园,真的强! |
![]() | 26 300 2018-01-23 18:29:03 +08:00 我只有 43290FPS /(ㄒoㄒ)/~~ |
![]() | 27 zhouyou457 2018-01-23 18:55:46 +08:00 via iPhone 7p 只有 2338fps …… |
28 woffee 2018-01-23 19:27:40 +08:00 好巧妙的方法 |
![]() | 29 a570295535 2018-01-23 19:31:08 +08:00 一般,如果改成 [多人在线玛丽奥跑酷] 就真了 ![]() |
31 pluto1 2018-01-23 20:07:25 +08:00 Safari 随手跑了一下只有 2600。。吓得我赶紧打开 Firefox 看了下,19W+ 。。还以为电脑已经落后时代那么多了 2333 |
![]() | 32 ericFork 2018-01-23 20:12:34 +08:00 能不能把 I 和 O 键反过来……因为这个死了好多次了 |
![]() | 33 yagnqionggo 2018-01-23 20:16:46 +08:00 太厉害了 |
![]() | 34 abeholder 2018-01-23 20:19:56 +08:00 膜拜大佬 。 |
![]() | 35 zenze 2018-01-23 20:56:58 +08:00 玩了好久,谢谢大佬! |
![]() | 36 kran 2018-01-23 21:11:49 +08:00 via iPhone nes 图像是怎么做的? |
37 morethansean 2018-01-23 21:25:42 +08:00 via iPhone 既然这个帖子变成了 benchmark ... iPhoneX: 2570 Pixel 2: 18522 为啥差距这么大... |
![]() | 39 zjcqoo OP @pluto1 @morethansean 现在整个游戏逻辑最终在一个 JS function 里,函数越大优化开销是指数上升的。有些浏览器快是因为支持 asm.js ,它有专门的优化策略,和普通 JS 不太一样。 以后会考虑拆成多个小 function,这样性能会提高很多。 |
![]() | 41 jonirrings 2018-01-23 21:51:03 +08:00 兄弟干得不错啊。来看看这个 http://koute.github.io/pinky-web/ 看看能不能把 Pixelated 加上 |
![]() | 42 kran 2018-01-23 22:02:46 +08:00 via iPhone @zjcqoo 我没说清楚,本想问的是 nes 游戏图像数据是怎么获取到,然后渲染在网页上,是不是只需要读取显存就好了? |
![]() | 43 xx314327475 2018-01-23 22:44:51 +08:00 打了一关 奖人还在熟悉的地方 谢谢作者 |
![]() | 44 zjcqoo OP @kran 数据是从 NES 文件里提取出来的,打包在脚本里。(那 js 里一大坨 base64 的数据大部分都是图像数据) |
46 zgl2007dj 2018-01-23 23:39:14 +08:00 666 |
![]() | 47 zjcqoo OP @kran 可以看下原始的汇编程序: https://gist.github.com/1wErt3r/4048722 这里面包含了 指令+数据,贴图不在里面。我就是对照着翻译,并不关心动态数据是怎么产生的。 |
![]() | 48 toan 2018-01-23 23:54:19 +08:00 via Android 然后看了楼主博客的热文《一根网线发起的攻击》,哈哈哈,楼主真是牛,创新力,创造力,动手力真是个强!哈哈哈,服了! |
50 cczy 2018-01-24 01:49:51 +08:00 git 链接错了? |
![]() | 51 sammo 2018-01-24 06:34:58 +08:00 via iPhone 好吃不腻 |
![]() | 52 maemolee 2018-01-24 08:15:57 +08:00 吊炸天啊这个 www |
![]() | 54 meanmachine 2018-01-24 09:05:50 +08:00 via Android 既然都在 benchmark...s7e 4w |
55 Creabine 2018-01-24 10:14:11 +08:00 厉害了 |
![]() | 56 Immortal 2018-01-24 10:27:31 +08:00 厉害 不过更被楼主博客内容吸引 |
![]() | 57 lizhenda 2018-01-24 10:39:29 +08:00 真心厉害了 |
![]() | 58 ariesjia 2018-01-24 11:06:32 +08:00 太强大了 厉害厉害 |
![]() | 59 doubleflower 2018-01-24 11:28:31 +08:00 能自定义键就好了,这个 IO 太反人类了,建议 J 发子弹,K 跳 |
![]() | 60 yesqu 2018-01-24 11:30:43 +08:00 chrome 49969FPS |
61 lancerly 2018-01-24 11:41:27 +08:00 楼主好强! |
![]() | 62 subpo PRO 收藏了!第一次看到在 js 上模拟一个电脑的 cpu 内存的时候觉得无比高大上 |
63 yuankui 2018-01-24 11:49:33 +08:00 跪拜 |
64 dd0754 2018-01-24 12:13:02 +08:00 via Android 大佬,给跪 |
65 think2011 2018-01-24 12:21:55 +08:00 大佬 大佬 |
66 aksoft 2018-01-24 13:04:03 +08:00 求坦克大战 和魂多罗~~ |
![]() | 67 jedihy 2018-01-25 01:36:32 +08:00 via iPhone 楼主有没有兴趣来微软西雅图? |