Debug.js: A JavaScript VM and In-Browser Debugger In Pure JS Generators 34
New submitter amasad writes "This post describes building a JavaScript virtual machine and an in-browser stepping debugger using the latest JavaScript generator feature. It's called debug.js. 'For the past few years I’ve been working on creating tools to help people learn programming on the web. I’ve worked on repl.it and open sourced the underlying technology which powered a few learn to code websites and until recently lead product engineering at Codecademy. Through all that, one thing I really wanted to see are the tools to make it possible to visualize code execution and step through code in the browser. To catch glimpse of what an ideal interactive learning environment would be you should check out Learnable Programming by Bret Victor. In addition to the educational benefits of such a tool, if matured it could be also useful for code instrumentation, web IDEs, and creating a foundation for writing other VMs on top of JavaScript (having the pausable machine state let's you not worry about the non-blocking environment). Ever since I've read about the ES6 Generators proposal, I’ve been toying with this idea in my head but it wasn't a real possibility until Ben Newman's Regenerator brought generators to the browser.'"
Re: Skeleton Project (Score:1, Interesting)
GO! FORTH! (Score:4, Interesting)
Yep! I taught my 10 year old niece x86 assembly first. Once she got the hang of some loops, character I.O., and some basic math I started her on FORTH. Immediately after grasping the power of higher level code over machine instructions she was hounding me about "But how does the code turn into the machine code?!" I helped her build a simple toy calculator language / interpretor / and compiler at age 11 then, and by 12 she had her very own FORTH implementation. Thankfully the knowledge took root before she noticed boys and geeking out with her uncle became uncool; Now she's 14 and knows enough to teach herself anything -- She uses JS/HTML5 and C to impress her friends with little games and such. FORTH is a good stepping stone. I prefer to start with the basics though. My nephew was a bit older when he got interested so we went the LISP route after ASM. Have you seen the complexity of some of the games they master? Kids can be so damn smart when you don't baby them.
I've also successfully used Java VM bytecode as a good intro to computing, but its stack centric design doesn't do justice to the underlying hardware. Android's Davlik's register architecture is similar to my own VM designs, and I find it a joy to manually op-code for, so perhaps I'll give a FORTH implementation on Android bytecode a shot as a teaching aid next time now that you can run Android on your desktop, and kids are very interested in mobiles. I've played around a bit with Go since it's a new-ish language and hasn't yet got the feature creep of C++, but in terms of teaching at the application / debugger level I still prefer C. Indirection (pointers) is such a powerful and fundamental concept it eclipses the references other languages have, and both C and ASM get right down to business. JavaScript is good as a case study in how not to design a language (it was never meant to be used the way we do, the clue is in its name). It's useful because it's available, not due to any merit of the language itself -- otherwise ASM.js wouldn't need to exist.
Most people wrongly think ill of ASM coding as a teaching tool. However, starting out in any higher level language doesn't even begin to dispel the mystical black box of computing like assembly code does. I self learned on BASIC and suffered from that brain damage far longer than I should have. I wouldn't start someone on JavaScript for the same reason.