mikutap

自动演奏家版本

自动演奏, 让电脑自己唱歌, 我只需要听, 绝不动手.

个人 fork 修改项

反解 mikuitap.min.js:
- 源码格式化
- 关键地方加上了注释(按键监听)
- ~~(没有改动源代码的逻辑)~~ 加了一点点东西
新建 automiku.js, ~~通过不改动源码逻辑的侵入方式~~做到了:
- 自动随机触发音符
加入了:
- 动画开关 (用于只播放音乐降低性能消耗)
- 后台播放开关 (旧浏览器强制开启)
- 自动演奏开关 (开关快捷键: 空格键)
- 说明: 当后台播放开启, 并且自动演奏开启. 则浏览器放置后台时, bgm 和自动演奏都会停止.

更新项

2021-04-30
- 反解 mikuitap.min.js:
  - 源码格式化
  - 关键地方加上了注释(按键监听)
  - (没有改动源代码的逻辑)
- 新建 automiku.js, 通过不改动源码逻辑的侵入方式做到了:
  - 点击开始按钮之后, 开始自动随机触发音符
2021-05-05
- 按照官网照猫画虎更新了鼠标的按键视觉反馈(feedback) (吐槽: 源码压缩后的变量名真要命)
- 自制了并新增了动画效果的开关 (不是很完美, 背景色切换的时候, 要想修改还需要研究源码)
- 自制了并新增了 bgm 后台播放
2021-05-06
- 自制了并新增了自动演奏开关 (Auto Play)

一点简单的说明:

一共有32个音符, 在 data/main/main.json 文件中以base64的方式记录程序通过监听鼠标和按键操作来选择一个音符进行播放. 而画面效果是随机的.
data/track/track.json 是 bgm
动画效果使用的是 PIXI, 一个十分优秀的 2d canvas 库, 神奇的 Phaser 底层就是用的这个.
源代码经过了压缩, 但好在没有进行过混淆, 不然光靠人力实在是难以调试. 其实只要通过特定的函数名进行全局搜索一下就能大致定位到功能代码( 题外话: 我还见过将函数名混淆, 在运算时通过复杂的算式生成. (也就解释型语言能这么做了(笑),偷偷说一句其实java也是解释型))
关于bgm后台播放: 请查看 common-2.min.js中关于 window.requestAnimFrame的实现

todo

关于自动演奏功能的开关. (当前无法停止, 当窗口进入后台的时候, 背景音会停止, 但是音符却仍然在触发)
更加智能的演奏. 可能需要涉及到"机器刷题"--正欲踏入的领域.
优化
- 内存占用增加率过快, 5分钟能增加200M. 初步推测是动画帧递归调用和, 动画渲染导致 (如果关掉动画渲染则占用很小)
- cpu占用问题同上(30%-50%). 是动画渲染导致 (如果关掉动画渲染则占用见到小 <10%)

传火者

更多信息查看 HFIProgramming

感叹

虽然只读到了压缩代码, 但是不由佩服原作者的代码的精简和成品的新颖. (亦或者说js真强吗). 我不懂 js,我也不懂 canvas, 我也不懂音乐. 但 AIDN 的制作者们真是太强了. 这真的是将音乐艺术通过程序很张力的表现在了计算机上. 被感动了.