New Processing.js and Sizzle.js Sites

Thanks to some generous contributions, there now exist well-designed web sites for two projects of mine: Processing.js and Sizzle.js.

Design and logo by Alistair MacDonald (on Twitter)

Processing.js was released almost a year ago (May 8th of last year) and it finally has an official web site. At this point the project is being primarily maintained by Alistair MacDonald (on Twitter) with active discussions taking place on the Processing.js Google Group.

On the new site you can see an an exhibition of cool Processing.js code, a full API reference, and a number of demos from the Processing.org site.

I especially like the fact that the header of the site is a live Processing.js demo. Thanks Alistair for the great site!

Design by Grégoire Dierendonck and Pierre Bertet, logo by Micheil Smith.

Sizzle had a crude site when it was released back in January of this year but it has now been overhauled and given a proper logo thanks to Grégoire Dierendonck, Pierre Bertet, and Micheil Smith.

All of the Sizzle API documentation is located over on Github. Be sure to check out the Sizzle.js Google Group where active discussions are taking place.

Posted: April 25th, 2009 ·

23 Comments (Show Comments)

1. William from Lagos (April 25, 2009 at 2:10 pm)

   Cool. I love the logos. You’ve been quiet of late with your blog. What else is new? Whats the latest on “Secrets”?

2. John Resig (April 25, 2009 at 2:25 pm)

   @William: I’m still working on “Secrets of the JavaScript Ninja.” The 3rd review was just finished and there’s 5 chapters left to be written, I’m hoping to finish it up some time this summer.

3. Doug (April 25, 2009 at 2:54 pm)

   That header about maxes out a processor on my dual core laptop.

4. Morgan 'ARR!' Allen (April 25, 2009 at 2:58 pm)

   Yeah, how soon until we see Test Swarm? That’s the one I’m excited to see.

5. John Resig (April 25, 2009 at 4:02 pm)

   @Doug: Sorry to hear that!

   @Morgan: I’ll be opening the alpha very soon – I have the tinderbox view working now and I need to work on some resiliency before I can start bringing in machines (not to mention the fact that it’s hosted on Dreamhost at the moment, when a proper server will be required.

6. Al (April 25, 2009 at 5:15 pm)

   @Doug: What are your specs? I’ll take a look at improving performance.

7. Scott (April 25, 2009 at 7:02 pm)

   Hey John. Processing.js is a brilliant piece of work. I was wondering if you have any contact with Vladimir Vuki?evi? at your employer about Canvas:3D and about OpenGL generally.

   There would be an explosion of cool Canvas stuff if we were able to easily use the OpenGL context, in the same way as we do with Java Processing with the size() method.

   FWIW,BTW; I think that Mozilla’s approach of using a “thin” OpenGL layer in Javascript is way superior to Google’s O3D (and closer to what I expected when I read the Khronos press release).

8. Al (April 25, 2009 at 7:10 pm)

   @Scott: someone gave me their interesting theory today, that Microsoft are going to deliver the 3D API first…. in direct-X. Scarily possible.

9. Nano (April 25, 2009 at 9:09 pm)

   Hi John,

   All the learning pages
   ie http://processingjs.org/learning/topics/histogram

   have this error…

   Warning: include(content/learning/topics/pattern.html) [function.include]: failed to open stream: No such file or directory in /home/.ramu/processingjs/processingjs.org/index.php on line 93

   Warning: include() [function.include]: Failed opening ‘content/learning/topics/pattern.html’ for inclusion (include_path=’.:/usr/local/php5/lib/php:/usr/local/lib/php’) in /home/.ramu/processingjs/processingjs.org/index.php on line 93

   Thanks,

   Nano.

10. Scott (April 25, 2009 at 11:14 pm)

    @Al: Indeed. Probably part of why I’m such a cheerleader for Mozilla’s approach with OpenGL ES. I was totally shocked by the approach of O3D, which seems to go against the intent of the Khronos initiative. O3D looks to me like a gift to Microsoft.

    As Chris Blizzard said, O3D (or any scene-rendering scheme) would work fine on top of a closer-to-the-metal OpenGL ES wrapper (like, say, C3DL does). And then we wouldn’t be locked in to Google’s implementation, which certainly isn’t appropriate for every application. And the reliance on tainted stuff like a proprietary Cg compiler and HLSL is super disturbing, and problematic for Mozilla and WebKit. It also looks like there’s no way this will ever leave the world of x86.

    And on top of everything else, how cool would it be to be able to simply say canvas.getContext("glweb20") when working on something like processing.js? With an OpenGL-aware Processing.js, all the non-programmers the Processing guys help out then instantly have hardware-accelerated stuff on their blogs. Truly neato.

    Man, I wish the FF betas worked for me now… Can’t wait!

11. Al (April 25, 2009 at 11:46 pm)

    @Scott: Interesting info. If I was running the Mozilla show… and I’m probably not for many, many reasons… I would hire Valve Software to develop a completely new Canvas engine. :)

    Regardless… at least The Mozilla team actually deal with your bug reports, I reported several Canvas bugs and had 8+ people tripping over themselves to fix them with 24 hours. Didn’t get that response from any of the other vendors. And one vendor remain deadly silent on all things fun. I will leave you to guess who that may be.

    What I find annoying at the moment is the absolute lameness of the w3c audio spec. It is very, very basic. If we really plan to leave the desktop behind, we are going to need something cool to listen to. Hopefully it will densify as we go.

    @Nano: I think the link you are looking for is: http://processingjs.org/learning/topic/histogram

    @Peeps: Sorry about initial bugs, I must remember not to wait until the birds start singing to work on regular expressions :P

12. bcd (April 26, 2009 at 11:54 pm)

    @AI : a small spelling mistake

    Clear IP “assignent” (all code held by the Dojo Foundation, contributors sign CLAs)

    “assignent” should be “assignment”

13. lorlarz (April 27, 2009 at 9:29 am)

    John
    I appreciate you still working on processing.js, but have yet to see a single example that works on Internet Explorer (though you say the new version could). Also, it would be greatly appreciated if you provide more actual examples using the javascript processing.js, instead of providing links to the old Fry and Reas system

14. lorlarz (April 27, 2009 at 10:02 am)

    John
    My apologies. I see the API reference does work in IE. The one thing that would help greatly is if you could somehow demarcate or separate out the code that produces each of the examples in the API Reference from the rest of the code on each example display page.

    It would still also be good if examples elsewhere (not in the API Reference also worked on IE.

    This is good and important work you are doing.

15. lorlarz (April 27, 2009 at 10:13 am)

    Oh, no. It turns out that the Reference API is just showing gifs of what gets produced by processing.js or processing.js and excanvas.js, supposedly.

    Thus I still have to see a single example that works in IE, though it is claimed everything made by the new processing.js (with excanvas.js) should.

16. Jay Robinson (April 27, 2009 at 6:13 pm)

    Still wish you would have gone with the other SizzleJS logo. The arrow seems like it will date the logo quickly.

    cf. http://twitter.com/jeresig/status/1471925134

17. jonathan (April 28, 2009 at 6:55 pm)

    Its a beautiful world we live in. Especially great to be alive with these pronounced advancements in human interactivity. Recursion city is where I want to live.

18. Al (May 1, 2009 at 3:21 pm)

    @lorlarz : Processing.js does work in IE, what you will find is that ex-canvas (used to render canvas for ie), does not support -or handle all canvas rendering functions as well as you would like.

    The demos on the site are not set to run in IE. I will be looking at this over the next few weeks. I am going to be testing Canvas in Silverlight also. I will let you know when I have something to blog.

19. Al (May 1, 2009 at 3:24 pm)

    @jay robinson : I like the other sizzle logo better too. However… the cuter logo looks like it belongs to a slower library. ;)

20. Adam A (May 3, 2009 at 3:35 am)

    @Al: Silverlight? Processingjs has already been ported to OpenLazlo, which might be a better alternative for now. Haven’t checked current status though

21. daft01 (May 5, 2009 at 2:11 pm)

    so all this code does not work on ie?

22. Al (May 9, 2009 at 3:14 pm)

    @daft01 : Most things work on IE, some things don’t. Even so, IE is generally very slow at rendering. (We don’t currently have the examples geared for rendering on IE on Processingjs.org.) My feeling is that the way VML is hooked into a page, causes the whole page to become jerky during the rendering cycle. This means if you use EXCanvas in your pages, you will find it difficult doing even simple tasks such as scrolling or clicking a link.

    VML/ExCanvas is obviously not a long-term solution.

    The head of development for IE at Microsoft told me that the Canvas would only get implemented if their users requested it. If you are interested in getting any Canvas code working properly in internet explorer, you should join the Microsoft Connect network, add IE to your dashboard and add the Canvas as a feature request for IE9.

    Failing this; you should just pray IE soon disappears forever. But what are the chances of that happening?

23. lewro (May 11, 2009 at 4:02 pm)

    Greatu stuff! Looking forward to your “Secrets of the JavaScript Ninja.” Good luck with that.

Comments are closed.
Comments are automatically turned off two weeks after the original post. If you have a question concerning the content of this post, please feel free to contact me.