SlideShare a Scribd company logo
z-music.js : AudioProcessorNode can do it
A ♪ SOUND mind in a SOUND <body>
Takashi Toyoshima <toyoshim@gmail.com>
Z-MUSIC
● MML based music sequencer for OPM + ADPCM + MIDI
● For X68000 series
Glossary
● MML Music Macro Language
● OPM FM Operator Type-M; 8ch x 4op FM sound chip
● ADPCM Adaptive Differential Pulse Code Modulation
● MIDI Musical Instrument Digital Interface
● X68000 Personal Workstation by SHARP (1987-1993)
MML example
/-----------------------------------------------------------------------/
Synth Bass
(t3) v15 l16 @3 o1
r2. g8.&(g,d)e2...ee2. Bb-ag
[do]
|:|:e8.e8.g8a8.b8.g8 e8.e8.e8|r4.<de>:|r|brb-rag8:|ererg8.
|:e8.e8.g8a8.b8.g8e8.e8.e8|r4.<de>:|rararb8.
g8.g8.a8r(f,b)&b8a8g8 e8.e8.e8r16(f,g)&g8d8.&(d,>a)
<(g,a)&a8a8.a8r(a,b)&b8(a,b)&b16<d8>g8.g8.a8b8.<d8.gf+>
e8.e8.e8r4(f,g)&g8&(g,e) a8.a8.a8(f,g)&g8.a8.&(a,f)
g8.g8.a8rb8.aged e8.e8.e8r8<ded>bag e8.e8.e8r4.<de>e8.e8.e8r4.<de>
[loop]
Demo
Design Overview
ScriptProcessorNode AudioDestinationNode
audioprocess Event
Compiled by Emscripten
X68Sound.dll
(OPM+ADPCM emulation)
call
S16
PCM
Stream
Run68
(human68k emulator)Virtual Timer Callback
ZMUSIC.XOPM+ADPCM
wapped I/O Access
Web MIDI API
(Bad) Knowhow
● manage JavaScript main thread carefully not to be busy
○ Buffer size 2048 => per ~42msec (≒2-3 frame); GC could be critical on slow machines
○ FYI: X68Sound + run68 takes 1-2 msec to handle the audioprocess callback
■ Pre-rendering technique may help, but could not be a perfect solution
● No good workaround
○ Worker
■ Can delegate rendering tasks, but data should be still transferred to
AudioProcessorNode on the main thread
○ iframe
■ Still share the same thread for main threads for main frame and sub iframes
● Though Chrome will have per-origin process in the future
○ Audio Worklet
■ Still under discussion / implementation
Resources
Article(Qiita)
A ♪ SOUND mind in a SOUND <body> : Z-MUSIC for the Web
Development (GitHub)
https://github.com/toyoshim/z-music.js
Demo Application
https://bit.ly/sion2

More Related Content

What's hot

Beautiful History
Beautiful HistoryBeautiful History
Beautiful History
Stefan Birkner
 
AWS ロボを作ろう JAWSUG Kobe
AWS ロボを作ろう JAWSUG KobeAWS ロボを作ろう JAWSUG Kobe
AWS ロボを作ろう JAWSUG Kobe
崇之 清水
 
8-bit Emulator Programming with Go
8-bit Emulator Programming with Go8-bit Emulator Programming with Go
8-bit Emulator Programming with Go
Ignacio Sánchez Ginés
 
GNU Radio for space research
GNU Radio for space researchGNU Radio for space research
GNU Radio for space research
Rustam Akhtyamov
 
USB 3.0 CAPTURE HDMI 4K with Loop-through for Image redistribution
USB 3.0 CAPTURE HDMI 4K with Loop-through for Image redistributionUSB 3.0 CAPTURE HDMI 4K with Loop-through for Image redistribution
USB 3.0 CAPTURE HDMI 4K with Loop-through for Image redistribution
Naoto MATSUMOTO
 
5.MLP(Multi-Layer Perceptron)
5.MLP(Multi-Layer Perceptron) 5.MLP(Multi-Layer Perceptron)
5.MLP(Multi-Layer Perceptron)
艾鍗科技
 
L5 Adders
L5 AddersL5 Adders
L5 Adders
ankitgoel
 
Iotlt48@fujitsu 20190215
Iotlt48@fujitsu 20190215Iotlt48@fujitsu 20190215
Iotlt48@fujitsu 20190215
NorioIkedo
 

What's hot (12)

Beautiful History
Beautiful HistoryBeautiful History
Beautiful History
 
Cmp
CmpCmp
Cmp
 
AWS ロボを作ろう JAWSUG Kobe
AWS ロボを作ろう JAWSUG KobeAWS ロボを作ろう JAWSUG Kobe
AWS ロボを作ろう JAWSUG Kobe
 
APB
APBAPB
APB
 
Presentation
PresentationPresentation
Presentation
 
8-bit Emulator Programming with Go
8-bit Emulator Programming with Go8-bit Emulator Programming with Go
8-bit Emulator Programming with Go
 
GNU Radio for space research
GNU Radio for space researchGNU Radio for space research
GNU Radio for space research
 
USB 3.0 CAPTURE HDMI 4K with Loop-through for Image redistribution
USB 3.0 CAPTURE HDMI 4K with Loop-through for Image redistributionUSB 3.0 CAPTURE HDMI 4K with Loop-through for Image redistribution
USB 3.0 CAPTURE HDMI 4K with Loop-through for Image redistribution
 
5.MLP(Multi-Layer Perceptron)
5.MLP(Multi-Layer Perceptron) 5.MLP(Multi-Layer Perceptron)
5.MLP(Multi-Layer Perceptron)
 
L5 Adders
L5 AddersL5 Adders
L5 Adders
 
Iotlt48@fujitsu 20190215
Iotlt48@fujitsu 20190215Iotlt48@fujitsu 20190215
Iotlt48@fujitsu 20190215
 
sample uid kit confi
sample uid kit confisample uid kit confi
sample uid kit confi
 

Similar to z-music.js - AudioProcessorNode can do it

Roland AR-3000SD: Audio Recorder/Player
Roland AR-3000SD: Audio Recorder/PlayerRoland AR-3000SD: Audio Recorder/Player
Roland AR-3000SD: Audio Recorder/Player
Roland Professional A/V
 
Roland R-88: 8-Channel Recorder and Mixer
Roland R-88: 8-Channel Recorder and MixerRoland R-88: 8-Channel Recorder and Mixer
Roland R-88: 8-Channel Recorder and Mixer
Roland Professional A/V
 
Microcontroller 8051 1
Microcontroller 8051  1Microcontroller 8051  1
Microcontroller 8051 1
khan yaseen
 
PySynth : A toy pure python software synthesizer.
PySynth : A toy pure python software synthesizer.PySynth : A toy pure python software synthesizer.
PySynth : A toy pure python software synthesizer.
Ransui Iso
 
Qtractor - An Audio/MIDI multi-track sequencer
Qtractor - An Audio/MIDI multi-track sequencerQtractor - An Audio/MIDI multi-track sequencer
Qtractor - An Audio/MIDI multi-track sequencercodebits
 
Dl2970 (b)
Dl2970 (b)Dl2970 (b)
Dl2970 (b)
pauloroberto72
 
Microprocessor 8086 instructions
Microprocessor 8086 instructionsMicroprocessor 8086 instructions
Microprocessor 8086 instructions
Ravi Anand
 
Dsp
DspDsp
Dsp
ncct
 
System-on-Chip Design, Embedded System Design Challenges
System-on-Chip Design, Embedded System Design ChallengesSystem-on-Chip Design, Embedded System Design Challenges
System-on-Chip Design, Embedded System Design Challenges
pboulet
 
Linux Audio Drivers. ALSA
Linux Audio Drivers. ALSALinux Audio Drivers. ALSA
Linux Audio Drivers. ALSA
GlobalLogic Ukraine
 
Roland M-300: 32-Channel Live Digital Mixing Console
Roland M-300: 32-Channel Live Digital Mixing ConsoleRoland M-300: 32-Channel Live Digital Mixing Console
Roland M-300: 32-Channel Live Digital Mixing Console
Roland Professional A/V
 
Ensemble rxtx, receptor SDR.
Ensemble rxtx, receptor SDR.Ensemble rxtx, receptor SDR.
Ensemble rxtx, receptor SDR.
Ricardo Vergara
 
MICROCONTROLLER 8051- Architecture & Pin Configuration
MICROCONTROLLER 8051- Architecture & Pin Configuration MICROCONTROLLER 8051- Architecture & Pin Configuration
MICROCONTROLLER 8051- Architecture & Pin Configuration
AKHIL MADANKAR
 
Introduction to Vortex86DX2 Motion-Control Evaluation Board
Introduction to Vortex86DX2 Motion-Control Evaluation BoardIntroduction to Vortex86DX2 Motion-Control Evaluation Board
Introduction to Vortex86DX2 Motion-Control Evaluation Boardroboard
 
Program, Code of Program and Screen Shot of Output (UNIVERSAL DRIVER USING µ...
Program, Code of Program and  Screen Shot of Output (UNIVERSAL DRIVER USING µ...Program, Code of Program and  Screen Shot of Output (UNIVERSAL DRIVER USING µ...
Program, Code of Program and Screen Shot of Output (UNIVERSAL DRIVER USING µ...
Er. Ashish Pandey
 
Technical Documentation_Embedded_Acoustic_DSP_Projects
Technical Documentation_Embedded_Acoustic_DSP_ProjectsTechnical Documentation_Embedded_Acoustic_DSP_Projects
Technical Documentation_Embedded_Acoustic_DSP_ProjectsEmmanuel Chidinma
 
Arm architecture
Arm architectureArm architecture
GNU Radio
GNU RadioGNU Radio
GNU Radio
milowenwen
 
Software Defined Radio (SDR)
Software Defined Radio (SDR)Software Defined Radio (SDR)
Software Defined Radio (SDR)
Drew Fustini
 

Similar to z-music.js - AudioProcessorNode can do it (20)

Roland AR-3000SD: Audio Recorder/Player
Roland AR-3000SD: Audio Recorder/PlayerRoland AR-3000SD: Audio Recorder/Player
Roland AR-3000SD: Audio Recorder/Player
 
Roland R-88: 8-Channel Recorder and Mixer
Roland R-88: 8-Channel Recorder and MixerRoland R-88: 8-Channel Recorder and Mixer
Roland R-88: 8-Channel Recorder and Mixer
 
Microcontroller 8051 1
Microcontroller 8051  1Microcontroller 8051  1
Microcontroller 8051 1
 
PySynth : A toy pure python software synthesizer.
PySynth : A toy pure python software synthesizer.PySynth : A toy pure python software synthesizer.
PySynth : A toy pure python software synthesizer.
 
Qtractor - An Audio/MIDI multi-track sequencer
Qtractor - An Audio/MIDI multi-track sequencerQtractor - An Audio/MIDI multi-track sequencer
Qtractor - An Audio/MIDI multi-track sequencer
 
Dl2970 (b)
Dl2970 (b)Dl2970 (b)
Dl2970 (b)
 
Microprocessor 8086 instructions
Microprocessor 8086 instructionsMicroprocessor 8086 instructions
Microprocessor 8086 instructions
 
Dsp
DspDsp
Dsp
 
System-on-Chip Design, Embedded System Design Challenges
System-on-Chip Design, Embedded System Design ChallengesSystem-on-Chip Design, Embedded System Design Challenges
System-on-Chip Design, Embedded System Design Challenges
 
Linux Audio Drivers. ALSA
Linux Audio Drivers. ALSALinux Audio Drivers. ALSA
Linux Audio Drivers. ALSA
 
Roland M-300: 32-Channel Live Digital Mixing Console
Roland M-300: 32-Channel Live Digital Mixing ConsoleRoland M-300: 32-Channel Live Digital Mixing Console
Roland M-300: 32-Channel Live Digital Mixing Console
 
Ensemble rxtx, receptor SDR.
Ensemble rxtx, receptor SDR.Ensemble rxtx, receptor SDR.
Ensemble rxtx, receptor SDR.
 
MICROCONTROLLER 8051- Architecture & Pin Configuration
MICROCONTROLLER 8051- Architecture & Pin Configuration MICROCONTROLLER 8051- Architecture & Pin Configuration
MICROCONTROLLER 8051- Architecture & Pin Configuration
 
3D-DRESD ASIDA
3D-DRESD ASIDA3D-DRESD ASIDA
3D-DRESD ASIDA
 
Introduction to Vortex86DX2 Motion-Control Evaluation Board
Introduction to Vortex86DX2 Motion-Control Evaluation BoardIntroduction to Vortex86DX2 Motion-Control Evaluation Board
Introduction to Vortex86DX2 Motion-Control Evaluation Board
 
Program, Code of Program and Screen Shot of Output (UNIVERSAL DRIVER USING µ...
Program, Code of Program and  Screen Shot of Output (UNIVERSAL DRIVER USING µ...Program, Code of Program and  Screen Shot of Output (UNIVERSAL DRIVER USING µ...
Program, Code of Program and Screen Shot of Output (UNIVERSAL DRIVER USING µ...
 
Technical Documentation_Embedded_Acoustic_DSP_Projects
Technical Documentation_Embedded_Acoustic_DSP_ProjectsTechnical Documentation_Embedded_Acoustic_DSP_Projects
Technical Documentation_Embedded_Acoustic_DSP_Projects
 
Arm architecture
Arm architectureArm architecture
Arm architecture
 
GNU Radio
GNU RadioGNU Radio
GNU Radio
 
Software Defined Radio (SDR)
Software Defined Radio (SDR)Software Defined Radio (SDR)
Software Defined Radio (SDR)
 

More from Takashi Toyoshima

楽しいロリコン
楽しいロリコン楽しいロリコン
楽しいロリコン
Takashi Toyoshima
 
第2回html5jゲーム部勉強会 Oh! JavaScript 夢の続きを語ろうよ〜emscriptenの逆襲 - html5編
第2回html5jゲーム部勉強会   Oh! JavaScript 夢の続きを語ろうよ〜emscriptenの逆襲 - html5編第2回html5jゲーム部勉強会   Oh! JavaScript 夢の続きを語ろうよ〜emscriptenの逆襲 - html5編
第2回html5jゲーム部勉強会 Oh! JavaScript 夢の続きを語ろうよ〜emscriptenの逆襲 - html5編
Takashi Toyoshima
 
Oh! java script 夢の続きを語ろうよ〜emscriptenの逆襲
Oh! java script 夢の続きを語ろうよ〜emscriptenの逆襲Oh! java script 夢の続きを語ろうよ〜emscriptenの逆襲
Oh! java script 夢の続きを語ろうよ〜emscriptenの逆襲
Takashi Toyoshima
 
Audio Context+ at WebAudio.tokyo #1
Audio Context+ at WebAudio.tokyo #1Audio Context+ at WebAudio.tokyo #1
Audio Context+ at WebAudio.tokyo #1
Takashi Toyoshima
 
Web &amp; sound
Web &amp; soundWeb &amp; sound
Web &amp; sound
Takashi Toyoshima
 
Chrome Web MIDI 2015
Chrome Web MIDI 2015Chrome Web MIDI 2015
Chrome Web MIDI 2015
Takashi Toyoshima
 
子供と使う便利ツール
子供と使う便利ツール子供と使う便利ツール
子供と使う便利ツール
Takashi Toyoshima
 
Web MIDI API update
Web MIDI API updateWeb MIDI API update
Web MIDI API update
Takashi Toyoshima
 
Web MIDI API - the paster, the present, and the future -
Web MIDI API - the paster, the present, and the future -Web MIDI API - the paster, the present, and the future -
Web MIDI API - the paster, the present, and the future -
Takashi Toyoshima
 

More from Takashi Toyoshima (10)

楽しいロリコン
楽しいロリコン楽しいロリコン
楽しいロリコン
 
第2回html5jゲーム部勉強会 Oh! JavaScript 夢の続きを語ろうよ〜emscriptenの逆襲 - html5編
第2回html5jゲーム部勉強会   Oh! JavaScript 夢の続きを語ろうよ〜emscriptenの逆襲 - html5編第2回html5jゲーム部勉強会   Oh! JavaScript 夢の続きを語ろうよ〜emscriptenの逆襲 - html5編
第2回html5jゲーム部勉強会 Oh! JavaScript 夢の続きを語ろうよ〜emscriptenの逆襲 - html5編
 
Oh! java script 夢の続きを語ろうよ〜emscriptenの逆襲
Oh! java script 夢の続きを語ろうよ〜emscriptenの逆襲Oh! java script 夢の続きを語ろうよ〜emscriptenの逆襲
Oh! java script 夢の続きを語ろうよ〜emscriptenの逆襲
 
Audio Context+ at WebAudio.tokyo #1
Audio Context+ at WebAudio.tokyo #1Audio Context+ at WebAudio.tokyo #1
Audio Context+ at WebAudio.tokyo #1
 
Web &amp; sound
Web &amp; soundWeb &amp; sound
Web &amp; sound
 
Chrome Web MIDI 2015
Chrome Web MIDI 2015Chrome Web MIDI 2015
Chrome Web MIDI 2015
 
子供と使う便利ツール
子供と使う便利ツール子供と使う便利ツール
子供と使う便利ツール
 
Web MIDI API update
Web MIDI API updateWeb MIDI API update
Web MIDI API update
 
Web MIDI API - the paster, the present, and the future -
Web MIDI API - the paster, the present, and the future -Web MIDI API - the paster, the present, and the future -
Web MIDI API - the paster, the present, and the future -
 
USB MIDI - DMX bridge
USB MIDI - DMX bridgeUSB MIDI - DMX bridge
USB MIDI - DMX bridge
 

Recently uploaded

Quantum Computing: Current Landscape and the Future Role of APIs
Quantum Computing: Current Landscape and the Future Role of APIsQuantum Computing: Current Landscape and the Future Role of APIs
Quantum Computing: Current Landscape and the Future Role of APIs
Vlad Stirbu
 
Removing Uninteresting Bytes in Software Fuzzing
Removing Uninteresting Bytes in Software FuzzingRemoving Uninteresting Bytes in Software Fuzzing
Removing Uninteresting Bytes in Software Fuzzing
Aftab Hussain
 
Why You Should Replace Windows 11 with Nitrux Linux 3.5.0 for enhanced perfor...
Why You Should Replace Windows 11 with Nitrux Linux 3.5.0 for enhanced perfor...Why You Should Replace Windows 11 with Nitrux Linux 3.5.0 for enhanced perfor...
Why You Should Replace Windows 11 with Nitrux Linux 3.5.0 for enhanced perfor...
SOFTTECHHUB
 
By Design, not by Accident - Agile Venture Bolzano 2024
By Design, not by Accident - Agile Venture Bolzano 2024By Design, not by Accident - Agile Venture Bolzano 2024
By Design, not by Accident - Agile Venture Bolzano 2024
Pierluigi Pugliese
 
Climate Impact of Software Testing at Nordic Testing Days
Climate Impact of Software Testing at Nordic Testing DaysClimate Impact of Software Testing at Nordic Testing Days
Climate Impact of Software Testing at Nordic Testing Days
Kari Kakkonen
 
The Metaverse and AI: how can decision-makers harness the Metaverse for their...
The Metaverse and AI: how can decision-makers harness the Metaverse for their...The Metaverse and AI: how can decision-makers harness the Metaverse for their...
The Metaverse and AI: how can decision-makers harness the Metaverse for their...
Jen Stirrup
 
The Art of the Pitch: WordPress Relationships and Sales
The Art of the Pitch: WordPress Relationships and SalesThe Art of the Pitch: WordPress Relationships and Sales
The Art of the Pitch: WordPress Relationships and Sales
Laura Byrne
 
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
Sri Ambati
 
PCI PIN Basics Webinar from the Controlcase Team
PCI PIN Basics Webinar from the Controlcase TeamPCI PIN Basics Webinar from the Controlcase Team
PCI PIN Basics Webinar from the Controlcase Team
ControlCase
 
Assure Contact Center Experiences for Your Customers With ThousandEyes
Assure Contact Center Experiences for Your Customers With ThousandEyesAssure Contact Center Experiences for Your Customers With ThousandEyes
Assure Contact Center Experiences for Your Customers With ThousandEyes
ThousandEyes
 
UiPath Test Automation using UiPath Test Suite series, part 4
UiPath Test Automation using UiPath Test Suite series, part 4UiPath Test Automation using UiPath Test Suite series, part 4
UiPath Test Automation using UiPath Test Suite series, part 4
DianaGray10
 
Securing your Kubernetes cluster_ a step-by-step guide to success !
Securing your Kubernetes cluster_ a step-by-step guide to success !Securing your Kubernetes cluster_ a step-by-step guide to success !
Securing your Kubernetes cluster_ a step-by-step guide to success !
KatiaHIMEUR1
 
DevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA ConnectDevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA Connect
Kari Kakkonen
 
RESUME BUILDER APPLICATION Project for students
RESUME BUILDER APPLICATION Project for studentsRESUME BUILDER APPLICATION Project for students
RESUME BUILDER APPLICATION Project for students
KAMESHS29
 
PHP Frameworks: I want to break free (IPC Berlin 2024)
PHP Frameworks: I want to break free (IPC Berlin 2024)PHP Frameworks: I want to break free (IPC Berlin 2024)
PHP Frameworks: I want to break free (IPC Berlin 2024)
Ralf Eggert
 
Epistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI supportEpistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI support
Alan Dix
 
zkStudyClub - Reef: Fast Succinct Non-Interactive Zero-Knowledge Regex Proofs
zkStudyClub - Reef: Fast Succinct Non-Interactive Zero-Knowledge Regex ProofszkStudyClub - Reef: Fast Succinct Non-Interactive Zero-Knowledge Regex Proofs
zkStudyClub - Reef: Fast Succinct Non-Interactive Zero-Knowledge Regex Proofs
Alex Pruden
 
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
Albert Hoitingh
 
Essentials of Automations: The Art of Triggers and Actions in FME
Essentials of Automations: The Art of Triggers and Actions in FMEEssentials of Automations: The Art of Triggers and Actions in FME
Essentials of Automations: The Art of Triggers and Actions in FME
Safe Software
 
SAP Sapphire 2024 - ASUG301 building better apps with SAP Fiori.pdf
SAP Sapphire 2024 - ASUG301 building better apps with SAP Fiori.pdfSAP Sapphire 2024 - ASUG301 building better apps with SAP Fiori.pdf
SAP Sapphire 2024 - ASUG301 building better apps with SAP Fiori.pdf
Peter Spielvogel
 

Recently uploaded (20)

Quantum Computing: Current Landscape and the Future Role of APIs
Quantum Computing: Current Landscape and the Future Role of APIsQuantum Computing: Current Landscape and the Future Role of APIs
Quantum Computing: Current Landscape and the Future Role of APIs
 
Removing Uninteresting Bytes in Software Fuzzing
Removing Uninteresting Bytes in Software FuzzingRemoving Uninteresting Bytes in Software Fuzzing
Removing Uninteresting Bytes in Software Fuzzing
 
Why You Should Replace Windows 11 with Nitrux Linux 3.5.0 for enhanced perfor...
Why You Should Replace Windows 11 with Nitrux Linux 3.5.0 for enhanced perfor...Why You Should Replace Windows 11 with Nitrux Linux 3.5.0 for enhanced perfor...
Why You Should Replace Windows 11 with Nitrux Linux 3.5.0 for enhanced perfor...
 
By Design, not by Accident - Agile Venture Bolzano 2024
By Design, not by Accident - Agile Venture Bolzano 2024By Design, not by Accident - Agile Venture Bolzano 2024
By Design, not by Accident - Agile Venture Bolzano 2024
 
Climate Impact of Software Testing at Nordic Testing Days
Climate Impact of Software Testing at Nordic Testing DaysClimate Impact of Software Testing at Nordic Testing Days
Climate Impact of Software Testing at Nordic Testing Days
 
The Metaverse and AI: how can decision-makers harness the Metaverse for their...
The Metaverse and AI: how can decision-makers harness the Metaverse for their...The Metaverse and AI: how can decision-makers harness the Metaverse for their...
The Metaverse and AI: how can decision-makers harness the Metaverse for their...
 
The Art of the Pitch: WordPress Relationships and Sales
The Art of the Pitch: WordPress Relationships and SalesThe Art of the Pitch: WordPress Relationships and Sales
The Art of the Pitch: WordPress Relationships and Sales
 
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
 
PCI PIN Basics Webinar from the Controlcase Team
PCI PIN Basics Webinar from the Controlcase TeamPCI PIN Basics Webinar from the Controlcase Team
PCI PIN Basics Webinar from the Controlcase Team
 
Assure Contact Center Experiences for Your Customers With ThousandEyes
Assure Contact Center Experiences for Your Customers With ThousandEyesAssure Contact Center Experiences for Your Customers With ThousandEyes
Assure Contact Center Experiences for Your Customers With ThousandEyes
 
UiPath Test Automation using UiPath Test Suite series, part 4
UiPath Test Automation using UiPath Test Suite series, part 4UiPath Test Automation using UiPath Test Suite series, part 4
UiPath Test Automation using UiPath Test Suite series, part 4
 
Securing your Kubernetes cluster_ a step-by-step guide to success !
Securing your Kubernetes cluster_ a step-by-step guide to success !Securing your Kubernetes cluster_ a step-by-step guide to success !
Securing your Kubernetes cluster_ a step-by-step guide to success !
 
DevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA ConnectDevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA Connect
 
RESUME BUILDER APPLICATION Project for students
RESUME BUILDER APPLICATION Project for studentsRESUME BUILDER APPLICATION Project for students
RESUME BUILDER APPLICATION Project for students
 
PHP Frameworks: I want to break free (IPC Berlin 2024)
PHP Frameworks: I want to break free (IPC Berlin 2024)PHP Frameworks: I want to break free (IPC Berlin 2024)
PHP Frameworks: I want to break free (IPC Berlin 2024)
 
Epistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI supportEpistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI support
 
zkStudyClub - Reef: Fast Succinct Non-Interactive Zero-Knowledge Regex Proofs
zkStudyClub - Reef: Fast Succinct Non-Interactive Zero-Knowledge Regex ProofszkStudyClub - Reef: Fast Succinct Non-Interactive Zero-Knowledge Regex Proofs
zkStudyClub - Reef: Fast Succinct Non-Interactive Zero-Knowledge Regex Proofs
 
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
 
Essentials of Automations: The Art of Triggers and Actions in FME
Essentials of Automations: The Art of Triggers and Actions in FMEEssentials of Automations: The Art of Triggers and Actions in FME
Essentials of Automations: The Art of Triggers and Actions in FME
 
SAP Sapphire 2024 - ASUG301 building better apps with SAP Fiori.pdf
SAP Sapphire 2024 - ASUG301 building better apps with SAP Fiori.pdfSAP Sapphire 2024 - ASUG301 building better apps with SAP Fiori.pdf
SAP Sapphire 2024 - ASUG301 building better apps with SAP Fiori.pdf
 

z-music.js - AudioProcessorNode can do it

  • 1. z-music.js : AudioProcessorNode can do it A ♪ SOUND mind in a SOUND <body> Takashi Toyoshima <toyoshim@gmail.com>
  • 2. Z-MUSIC ● MML based music sequencer for OPM + ADPCM + MIDI ● For X68000 series Glossary ● MML Music Macro Language ● OPM FM Operator Type-M; 8ch x 4op FM sound chip ● ADPCM Adaptive Differential Pulse Code Modulation ● MIDI Musical Instrument Digital Interface ● X68000 Personal Workstation by SHARP (1987-1993)
  • 3. MML example /-----------------------------------------------------------------------/ Synth Bass (t3) v15 l16 @3 o1 r2. g8.&(g,d)e2...ee2. Bb-ag [do] |:|:e8.e8.g8a8.b8.g8 e8.e8.e8|r4.<de>:|r|brb-rag8:|ererg8. |:e8.e8.g8a8.b8.g8e8.e8.e8|r4.<de>:|rararb8. g8.g8.a8r(f,b)&b8a8g8 e8.e8.e8r16(f,g)&g8d8.&(d,>a) <(g,a)&a8a8.a8r(a,b)&b8(a,b)&b16<d8>g8.g8.a8b8.<d8.gf+> e8.e8.e8r4(f,g)&g8&(g,e) a8.a8.a8(f,g)&g8.a8.&(a,f) g8.g8.a8rb8.aged e8.e8.e8r8<ded>bag e8.e8.e8r4.<de>e8.e8.e8r4.<de> [loop]
  • 5. Design Overview ScriptProcessorNode AudioDestinationNode audioprocess Event Compiled by Emscripten X68Sound.dll (OPM+ADPCM emulation) call S16 PCM Stream Run68 (human68k emulator)Virtual Timer Callback ZMUSIC.XOPM+ADPCM wapped I/O Access Web MIDI API
  • 6. (Bad) Knowhow ● manage JavaScript main thread carefully not to be busy ○ Buffer size 2048 => per ~42msec (≒2-3 frame); GC could be critical on slow machines ○ FYI: X68Sound + run68 takes 1-2 msec to handle the audioprocess callback ■ Pre-rendering technique may help, but could not be a perfect solution ● No good workaround ○ Worker ■ Can delegate rendering tasks, but data should be still transferred to AudioProcessorNode on the main thread ○ iframe ■ Still share the same thread for main threads for main frame and sub iframes ● Though Chrome will have per-origin process in the future ○ Audio Worklet ■ Still under discussion / implementation
  • 7. Resources Article(Qiita) A ♪ SOUND mind in a SOUND <body> : Z-MUSIC for the Web Development (GitHub) https://github.com/toyoshim/z-music.js Demo Application https://bit.ly/sion2