JSNES JavaScript NES emulator

Ben Firshman wrote a rather impressive NES emulator. There are already quite a few NES emulators out there already this one impressive is because it’s written in pure JavaScript.

Yet another application of “Atwood’s Law“:

Any application that can be written in JavaScript, will eventually be written in JavaScript.

I should note that I mentioned back in January how someone ported Super Mario brothers to JavaScript. JSNES is different as it is actually emulating and reading ROM’s (looks like they are hex’d), rather than just replicating the game.

Currently it runs in all modern browsers, but only Chrome’s <canvas/> performs well enough at this point to really be playable. With WebGL coming to Firefox and WebKit we’ll hopefully see a lot more of this kind of stuff in the future.

about:internets

This is what you see when you visit about:internets. This is freaking awesome.

Years ago there was an idea to include the kitchen sink in Mozilla (you can view it here, not sure if that works in IE). It was a good idea considering it had everything else at the time.

I initially thought it was written using <canvas/>. I tried the typical view-source:, but in this case it doesn’t seem to work. The performance was really smooth with minimal CPU, more than <canvas/> typically allows. Now I was curious.

Then looking at the source it became obvious in about 0.1 seconds:

PathService::Get(base::DIR_SYSTEM, &path);
file_util::AppendToPath(&path, L"sspipes.scr");

It’s using the actual Windows screensaver (which is why it doesn’t work in Vista I presume). I hope for the Mac and Linux port they bundle jwz’s excellent XScreenSaver. Due to jwz’s impact in browsers and open source, I think there would be even better easter egg. From a quick look at the code it seems it’s not hard to do since every tab is it’s own process, it’s essentially just running the process inside the view.

For those who don’t understand why this is all so amusing, read this Wikipedia article about the “Series of Tubes“. It will only kill a small percentage of brain cells since it’s just the Wikipedia article explaining it. There are other Tubes references as I mentioned last night.

Thanks to those who left a comment in my last post for pointing this out.

By the way, check out Brendan’s post on TraceMonkey performance. He did a better comparison at actual JS performance. I only looked at selectors really quick.

Initial Thoughts On Google Chrome

I figured I’d blog my initial thoughts on Google chrome. Rather than a hard to read essay, I figured bullet points are easier to read/scan, so that’s what I’ll do.

Announcement

  • Another One Bites the Dust – The classic Queen song was played both before and after the presentation. I can’t help to think this was an intentional joke about a browser biting the dust.
  • From Scratch – How can a browser be both written from scratch, and based on the existing WebKit at the same time? Is this a bug? ;-)
  • Ben Goodger – Did a good job selling the UI.
  • BSD License – All of it is BSD licensed. Very interesting that it’s not pulling a Safari. Chromium Project, V8.
  • Incognito Mode – Ben/Brian discussed it without mentioning the word “Porn”, though you can somewhat tell that they were both dying to use the “P” word…. uhh for research… for a friend!
  • Static Content Performance – As shown in the demonstration: IE7: 220.64ms, Chrome: 77.28ms. Less is more.
  • Dynamic Content Performance – As shown in the demonstration: IE7: 5.8 RPH, Chrome: 569.3RPM. More is more.
  • Search Box Missing – I agree with merging the search box with the url bar. It makes sense and results in a cleaner UI.

My Testing

  • Build – This is build 0.2.149.27 (1583)
  • UseragentMozilla/5.0 (Windows; U; Windows NT 5.1; en-US) AppleWebKit/525.13 (KHTML, like Gecko) Chrome/0.2.149.27 Safari/525.13. Noteworthy that they keep “Safari” in there. This looks like what I’d expect.
  • Bug Type – “reporter” feature has a “Bug type” called “browser crash… go boom”. I like jokes in software.
  • Tubes – The gears plugin in the chrome install has the file description “These are the Gears that power the tubes!”. Awesome Ted Stevens reference.
  • History View – I always wanted the history view in Firefox to be in a page rather than a sidebar. I understand the thought behind the implementation, but when you see how Chrome is laid out, it’s clearly superior.
  • No PPC Support – Because of how V8 works, I strongly suspect Google Chrome will never support Mac/PPC despite it still being supported by Apple until (likely) 10.6. In the press conference they said anyone can port V8 to another platform, if you have 3-4 months. Doubt they will use any other engine for that one platform. I’d say it’s toast.
  • Chrome API – The announcement mentioned plans for an extension API. Looking at the files it ships, it looks like almost all dll’s. Because of this I doubt we’ll see a method as simple as Firefox. Not sure how the interface is put together but it doesn’t look like anything as flexible as XUL, Boxely or XAML.
  • about: – So far I’ve found about:, about:memory, about:plugins.
  • Slickspeed Test – Ran a test and found Chrome did 115ms, 130ms, Safari 3.1 did: 28ms, 68ms, while Firefox 3 did 179ms, 294ms (prototype, jQuery). Interesting that Safari selectors are still faster.
  • Walt Mossberg – Everyone’s favorite tech writer Walt Mossberg wrote:

    Despite Google’s claims that Chrome is fast, it was notably slower in my tests at the common task of launching Web pages than either Firefox or Safari. However, it proved faster than the latest version of IE — also a beta version — called IE8.

  • Icon – Daniel Glazman identified the source of inspiration for the icon.
  • Phone Home – Matt Cutts has a blog post on when Chrome phones home
  • Omnibox – It’s ability to find new search engines is pretty neat… wonder how well that really works in day to day browsing though. Otherwise it’s essentially an Awesomebar to me.
  • Application Shortcut – The Prism-like functionality is just that. Essentially it just passes the url as a param into the Chrome exe via a shortcut. Looks like unless Gears is used you’ll use the Favicon which looks pretty bad.
  • Download Manager – The download manager is pretty cool, but if you download a number of files, I think this interface can get pretty cumbersome. Just like Thunderbird with a lot of attachments.
  • Font Rendering – It looks like they are using GDI Text rendering to avoid that blurry mess that Safari uses on Windows. I suspect Apple will do the same soon.

Overall it seems pretty smooth. From what I’ve seen, the process model does result in more memory in total than Firefox 3, since most tabs I open stay open for quite a while. It’s clearly still a little rough, but it’s not even out for 12hrs yet.

I await a Mac release. I just realized Pinkerton is working on Chromium as well, so I have a feeling the Mac release won’t suck but will be a real port that looks and feels like a Mac application should.

I don’t think it was mentioned in the press conference, but the Chromium blog is open.

Wired has a great article on inside the project. In addition to the names I mentioned yesterday, Bryan Ryner was also involved in at least the prototype.

I’ll make one prediction: The code most likely to find it’s way into other browsers is the GreenBorders stuff. It was originally for IE/Firefox, making it most suitable for possible adaptation to be included in other browsers. I’m not sure how much of it remains and how easy to adapt it would be though.

I’ll leave this “review” right here and unfinished since it’s still an ongoing project. Just wanted to share my initial thoughts. I’ll follow up at some point in the future when I feel it’s right to do so.

Any thoughts/additions? Feel free to leave a comment.

Edit [9/2/2008 @ 10:55 PM EST] – Added prediction about GreenBorders and link to Wired Article.

Firefox Tip: Customize Your Browser UI

Did you know you can customize your browsers interface. Want a print button in the browser toolbar like you had in IE? “New Tab” button? Download Manager? No problem. Just right click on the toolbar and select customize. You’ll see a window with various icons appear.

From here you can just select what you want by dragging it to the desired position in the toolbar. You can remove an item from the toolbar by just dragging it off. Feel free to reposition items as well. It’s all customizable via drag & drop. You can set it up any way you like. It’s your browser.

Don’t worry about messing things up, if you don’t like what you did and want to go back to the defaults just press the “Restore Default Set” button in that window.

Reporter Status Update

Well, they aren’t done yet, but I thought I’d share some new reporter screenshots. As you can see quite a few refinements. Still a little rough, but I think it illustrates how simple the process is. There’s some obvious UI uglies still in there. It can take well under 30 seconds to submit a report.

Privacy Statement

Form

All done!

We automate the collection of just about all the important data, so we can make sure we get a pretty accurate rundown of what is included.

Still missing is collecting some buildconfig info. So if anyone knows why the following code doesn’t work, let me know:

function getBuildConfig() {
 
  var ioservice =
     Components.classes["@mozilla.org/network/io-service;1"].
       getService(Components.interfaces.nsIIOService);
  var channel = ioservice.newChannel("chrome://global/content/buildconfig.html",
                                     null, null);
  var stream = channel.open();
  var parser = new DOMParser();
  var buildconfig = parser.parseFromStream(stream, "UTF-8", stream.available(),
                                   "application/xhtml+xml");
  return buildconfig.documentElement.firstChild.textContent;
}
< ?pre>

Write File

Can anyone tell me why this code doesn’t work in Thunderbird 0.9 (I haven’t tried Firefox 1.0).

Note: There is a slash in the directory path C:, for some reason wordpress is fudging it up. MovableType did this crud too. So it’s not showing, but it’s there in the code.

function sync()
{
testFileOutputStream("C:\foo.txt", "la la la \n robert");
}
 
function testFileOutputStream(path, buffer) {
  // file is nsIFile, data is a string
  var stream = Components.classes["@mozilla.org/network/file-output-stream;1"]
    .createInstance(Components.interfaces.nsIFileOutputStream);
 
  // use 0×02 | 0×10 to open file for appending.
  stream.init(nsLocalFile(path), 0×02 | 0×08 | 0×20, 0664, 0); // write, create, truncate
  stream.write(buffer, buffer.length);
  stream.close();
}
 
function nsLocalFile(path)
{
    const LOCALFILE_CTRID = "@mozilla.org/file/local;1";
    const nsILocalFile = Components.interfaces.nsILocalFile;
 
    var localFile =
        Components.classes[LOCALFILE_CTRID].createInstance(nsILocalFile);
    localFile.initWithPath(path);
    return localFile;
}

Keep getting this error:

Error: uncaught exception: [Exception... "Component returned failure code: 0x80004005 (NS_ERROR_FAILURE) [nsIFileOutputStream.init]” nsresult: “0×80004005 (NS_ERROR_FAILURE)” location: “JS frame :: chrome://extension/content/extension.js :: testFileOutputStream :: line 12″ data: no]

Simply want to be able to write to C: (or any place on my HD that I specify). Prefer not to use JSlib, simply because I don’t want dependencies. It’s really borderline insane to think you can’t do something as simple as write out to a file without depending on other lib’s.

Thanks in advance.

Comments/Email as usual.