April 2012
2 posts
The JSConf 2012 videos are being released!
Well the title pretty much says it all, but I thought I’d let everyone know that the JSConf 2012 videos are beginning to be released. JSConf is one of the premier JavaScript conferences that always sells out within a few seconds, so if you didn’t make it this year, you’re in luck because they always record the talks and release them for free after the event. I wasn’t...
WebKit.js: Yes it has finally happened! Browser...
I knew this was going to happen eventually, it was just a matter of time. WebKit has been ported to JavaScript, and no, this is not just some Emscripten compile, it is a full hand port of the popular browser engine to JS. WebKit.js uses WebGL as a rendering backend and basically enables developers to never worry about browser differences again since we can now control what browser our users are...
March 2012
2 posts
SQL.js: SQLite Compiled to JavaScript via...
Alon Zakai, the creator of Emscripten is back at it again, this time releasing SQL.js, which is a compilation of SQLite to JavaScript using his own tool. The demo page shows it in use, and if you view source, just how easy he’s made it to use after it has been compiled.
var db = SQL.open();
var data = db.exec(command);
You can run any SQL queries you can think of and it will work just...
First Look: Blossom - A SproutCore Spinoff Using...
SproutCore has always been an interesting project. It is the application framework behind Apple’s impressive iCloud apps, and the MobileMe ones before that, as well as many other high profile projects. The SproutCore view layer has gone through many revisions. At one point it used Ruby templates combined with CSS, and then it switched to a JavaScript only system, which still used...
February 2012
6 posts
1 tag
CoffeePhysics: A Fast New Physics Engine Written...
Justin Windle has just released a new physics engine called CoffeePhysics, which as it’s name states, is written in CoffeeScript. It is quite lightweight (minified, it’s just 8KB), but also very powerful.
There are a number of demos that show the performance and features of the library, including attraction, collision, cloth simulation, a balloon of balls around your mouse, and a...
Badass JavaScript Roundup #8: Mobile, mobile,...
Welcome back to the Badass JavaScript roundup series. Been busy recently, so sorry about the lack of posts. Let’s jump right in!
PhoneGap has become an Apache incubator project called Cordova, with a nice website and everything. Be sure to check that out if you’re into developing mobile web apps.
Tower.js is an interesting take on frameworks for Node.js, and in fact looks almost...
Looking to move from Flash to WebGL? IvanK brings...
Ivan Kuckir sent in a neat library to help Flash developers move to JavaScript.
I have made a graphics library to help people move from Flash to Javascript. It is something like EaselJS, but unlike EaselJS, all the classes, methods and properties come from Flash and unlike EaselJS, it uses WebGL (GPU) for drawing graphics (it is fast).
As he says, the API is heavily based on Flash so it will...
WebM and WebP Hand Ported to JavaScript for All...
Dominik Homberger has been very busy over the last few months working on porting first, Google’s WebP image format to JS and today launching his WebM video decoder in JavaScript. No, these are not Emscripten compiled versions - these are hand ports directly from the original C++ source code. And yes, both of these ports work in all browsers, not just the latest Chrome and Firefox - all...
JS1k is back! Awesome JavaScript demos in only 1KB
I always enjoy watching JS1k, which, if you haven’t heard of it, is a JavaScript competition to make the best demo in under 1KB of code. It has been running for a few years now, and every time, it gets better and better with cooler demos, more judges and of course better prizes. This time, the theme of the contest is about love given that Valentines day is coming up soon, and we’ve...
Weekly Badass JS Roundup #7
Welcome back to the weekly Badass JS roundup! As always, there is lots of JavaScript news this week, so lets dive in.
Ehsan Akhgari has a neat blog post on automatically converting a native OpenGL application to run on the web via WebGL using Emscripten.
Iced CoffeeScript is a fork of CoffeeScript that brings two new keywords to the language: await and defer, which make asynchronous programming...
January 2012
9 posts
psd.js: You Guessed It - A Photoshop Document...
Ryan LeFevre has been working on psd.js, which is as you might have already guessed, is a Photoshop Document parser that works in both the browser and Node.js.
psd.js is a general purpose file parser for PSD files created in Photoshop. Given a PSD file, it can parse out information such as image size and color modes, image resources, layer info, image contents, etc.
It is written in...
Morning Star: An Impressive Audio Synth in...
Morning Star is a monophonic bassline synthesizer controlled by a step sequencer, designed to run on Web browsers and made entirely with HTML5 and JavaScript (no Flash).
It uses Mozilla’s Audio Data API, and Google’s competing Web Audio API to produce sound in real time abstracting them with a library called KievII, which is a library containing both an audio DSP as well as...
2 tags
Seriously.js: A Realtime, Node-Based Video...
We covered a demo earlier this week showing real time video processing with WebGL, but Seriously.js taking this concept even further: seriously!
Seriously.js is a real-time, node-based video compositor for the web. Inspired by professional software such as After Effects and Nuke, Seriously.js renders high-quality video effects, but allows them to be dynamic and interactive.
It features an...
2 tags
Weekly Badass JS Roundup #6
Welcome back to the weekly Badass JS roundup! Lots of JavaScript news this week, so lets dive in.
Adobe proposes events for monitoring the downloading of Image resources which could be quite useful in many circumstances.
ES6, the next version of the EcmaScript standard that defines the JavaScript language has support for various types of collections beyond the standard Array and Object types. ...
PhotoBooth Style Live Video Effects in JavaScript...
Ever spent hours in PhotoBooth just playing around with the cool live video filters and effects? Now you can do that in your browser as well thanks to Paul Neave’s cool HTML5 video effects demo! While you can’t yet use an actual webcam and perform the effects on your own image (although those APIs are coming - Chrome just released WebRTC and getUserMedia support a few days ago!),...
Resumable.js: Fault Tolerant Resumable File...
Ever had an experience on a website where you’re uploading a really big file and its taking a while, you’re not quite sure how much its uploaded, and then after a few minutes of uploading, something fails and you have to start over again? With the new HTML5 file APIs and Resumable.js, this problem will be lessened thanks to our newfound ability to actually resume large file uploads...
Font.js: A Powerful Font Toolkit for JavaScript
Mike Kamermans has been working on a little font toolkit for your JavaScript that is kind of akin to the built-in Image object but for Fonts. It gives you font loading events using a technique perfected in Mozilla’s pdf.js project, metrics information, and a better version of the canvas element’s measureText method with additional information such as height, bounding box, and...
jsday, A Conference Dedicated to JS in Italy
Given the rising importance of JavaScript both in the development of web applications and as an all-purpose language, the Italian PHP user group GrUSP decided in 2010 to organize a conference fully dedicated to JavaScript, alongside the traditional phpDay conference. Much beyond any expectaion, the first edition has been incredibly successful, with over 300 visitors coming from all around Europe...
2 tags
Weekly Badass JS Roundup #5
Welcome back to the weekly Badass JS roundup! Here is my link dump for this week.
I’m not sure this is new, but it was new to me… Grant Galitz has released a full Gameboy Color Emulator in JavaScript using the canvas element for graphics and the Web Audio API for audio. Pretty awesome.
Popular iPhone game Cut the Rope has been ported to JavaScript by Microsoft of all companies and...
December 2011
6 posts
2011: A Badass JavaScript Year In Review
2011 has been a great year for JavaScript. Web browsers have given us great new tools to use and we have taken web applications to new heights, competing with native applications and bringing sexy back to the web with countless impressive demos. A week or so ago, we put out a survey to all of you asking what you thought the most badass JavaScript demo of 2011 was. Of course, this would be a...
Happy Holidays From Badass JavaScript!
Merry Christmas and Happy Holidays from Badass JavaScript! I made an animated holiday greeting card for you all to enjoy, so check that out. It is built entirely with SVG and CSS animations, so it is entirely scalable and should even work great on the iPhone! I had originally animated the snowflakes as part of the embedded SVG document using JavaScript, but this turned out to be very very...
Weekly Badass JS Roundup #4
Welcome back to the weekly Badass JS roundup! Here is my link dump for this week.
Maximiliano Firtman has put together a very nice mobile browser HTML5 compatibility table for iPhone, Android, BlackBerry, Symbian, iPad and more.
Dust looks like an interesting new templating engine.
Ariya Hidayat has released Esprima, a “blazing fast JavaScript parser” written in JavaScript. He...
Introducing ALAC.js: An Apple Lossless Audio...
Recently, Apple open sourced the original encoder and decoder for the Apple Lossless audio codec which is written in C/C++. ALAC is, as its name implies, a lossless codec, which means that it is compressed but does not lose any quality. When decoded, ALAC audio files are bit-for-bit identical to the original uncompressed audio file.
When our team at ofmlabs saw ALAC open sourced a few weeks...
1 tag
Weekly Badass JS Roundup #3
Welcome back to the weekly Badass JS roundup! Here is my link dump for this week.
SproutCore 2.0 has been renamed to Amber.js to avoid confusion since the project has significantly diverged from the goals of the original SproutCore project. SproutCore 1.x will continue to be developed as a native-style application framework along side Amber.js’s more lightweight approach.
The “Move...
csg.js: Constructive Solid Geometry 3d Modeling in...
Evan Wallace, the same guy who brought us that amazing WebGL water simulation is back at it again, this time with a library called csg.js for doing Constructive Solid Geometry modeling in JavaScript.
Constructive Solid Geometry (CSG) is a modeling technique that uses Boolean operations like union and intersection to combine 3D solids. This library implements CSG operations on meshes elegantly...
November 2011
9 posts
Route9.js: A VP8/WebM decoder in JavaScript
The codecs keep being implemented in JS. We saw Broadway.js implement the H.264 codec in JS recently, and now we have a WebM decoder as well. Ben Schwartz was inspired by Broadway and wanted to learn more about the WebM format so he decided to modify Broadway to support VP8 as well. The result is Route9.js.
Like Broadway.js, Route9.js was compiled with Emscripten the LLVM to JS compiler....
1 tag
Weekly Badass JS Roundup #2
Welcome back to the weekly Badass JS roundup! Here is my link dump for this week.
Shapesmith looks like an interesting 3D modeling tool in the browser built with WebGL.
Check out this canvas blood simulation. Pretty realistic.
Deadbolt looks like a nice way to create autoreleasing locks in the async world of Node.js.
The Instagram unshredder challenge has been solved (twice) in JS using the...
ThreeNodes.js: A Visual WebGL Scene Editor
ThreeNodes.js is a visual dataflow based WebGL editor that uses drag and drop to create a scene. It is similar to vvvv, which is described as “a graphical programming environment for easy prototyping and development.” It allows the user to drag and drop units known as “patches” onto a working area and connect them together to form an output scene which is rendered in...
Gorgeous WebGL dynamic terrain rendering demo
WebGL demos continue to impress me, and with most browsers already on board, even real world applications are starting to show up. Three.js seems to be a common library among many of these WebGL demos as well, and today’s feature is no exception. It is a super impressive dynamic terrain rendering demo showing some of the amazing performance you can get out of today’s modern GPUs....
BicaVM: A JVM Implementation in JavaScript
Writing compilers/transpilers in JavaScript is all the rage right now. It started with CoffeeScript and Objective-J, and quickly expanded to tons of existing and new languages, some of which are now listed on the AltJS website. We’ve also seen projects like Emscripten, which takes LLVM bytecode and compiles it to JS.
In a similar spirit, we are given BicaVM, which is an implementation of...
Weekly Badass JS Roundup: Node 0.6, Firefox 8,...
Welcome back to the Weekly JS Roundup series formally known as “Today in JS”! Here are links to some of the most interesting articles and projects of the week. Enjoy!
Node.js 0.6 is out, with awesome support for Windows (finally), a brand new Cluster API for taking advantage of multi-core systems, a built in zlib module, and all the changes in the 0.5 series now stable. Node keeps...
Hack of the day: Rendering HTML to a Canvas...
Web developers have long wanted a way to draw arbitrary HTML content into a canvas element for manipulation. It would be nice to be able to draw web content into 3d environments in WebGL, it would be fun to make custom animations and particle effects with web pages, and many more uses you can dream up. Back in 2005, Mozilla landed a drawWindow() API in Firefox which did just that, but because of...
JSConf.eu Video Roundup
The videos from JSConf.eu have started to come out, and they are some really fantastic talks. If you missed the actual event a few months ago, check out the videos, some of which are embedded below, and others of which are coming out soon! Watch this space for more.
David Mandelin & David Anderson – JavaScript JITs
We’re going to get down and dirty with just-in-time compilers for...
140bytes: A Community Curated Collection of Tweet...
Last May, Jed Schmidt started a fun little game of “code golfing” on Github’s Gist feature called 140bytes, in which people competed to write Tweet-sized JavaScript to accomplish specific tasks. Since then, hundreds of little scripts of varying complexity have been collected, a website and Twitter account have been created to collate these scripts, and a very nice page listing...
October 2011
5 posts
Broadway: An H.264 Decoder in JavaScript Running...
I’ve been seeking an H.264 decoder in JavaScript for some time now, and my wish has finally come true. We’ve seen lots of other formats be implemented in JS, including PDF, MP3, MP2, PNG, JPG, BMP and more, but the real test of whether JS is really up for the task in terms of performance would be decoding a video codec and displaying it at a reasonable frame rate. We aren’t...
Nokia Maps 3D WebGL brings Google Earth to the...
Following close on the heels of Google Maps releasing their WebGL based mapping engine, Nokia has taken it to the next level bringing 3D Google Earth style maps to WebGL as well, and boy is is smooth! Not only can you spin the Earth around, and fly to places in 3D, but many of the buildings in major cities are available in 3D as well, such as the screenshot of San Francisco below.
Thanks to...
Chris Williams: An End To Negativity In Our...
The JavaScript community is known for building awesome stuff like the things showcased on this site, but it can also be known for the heated arguments that occur often, sometimes leading to trolling and other forms of bashing and negativity. I will be the first to admit that this has sometimes even been me. In a great closing speech to JSConf.eu this year, Chris Williams, otherwise known as Papa...
glfx.js: Core Image Style Filters in the Browser...
If you’re at all familiar with Apple’s Core Image framework on the Mac and iOS, you’ll know that it is both very powerful, and extremely fast since it runs on the GPU. It is possible to chain multiple filters together and update their parameters in real time without any lag at all.
Obviously, if we can do it on native, we want to be able to do it on the web as well!...
Badass JS is back with a new look! Here's a little...
Wow, I can’t believe it’s been over 7 months since I last wrote here, but it has and I’m glad to be back! We have a new look, which I think is cleaner and easier to read than the previous theme. I hope you like it!
A lot has happened since I last wrote here. Last time I wrote, Firefox 4 had just come out, and now we’re on Firefox 7. We have iOS 5 and the latest Android...
March 2011
6 posts
WebGL-2d: An Implementation of the 2d Canvas...
WebGL-2d is an interesting project that is aiming to be a complete port of the Canvas2D API implemented in a WebGL context as a proof of concept. ”Huh, why would anyone want to do that?”, you might be asking. Currently, in supporting browsers, WebGL performs better in some scenarios than Canvas2D. Specifically, WebGL often achieves much higher framerates in drawImage intensive code,...
Firefox 4 Launch Day With Brendan Eich
A Minute With Brendan is a great short, mostly weekly podcast produced by the awesome Chris Williams (JSConf organizer) and hosted by Brendan Eich, JavaScript’s creator. As Firefox 4 was just released today, including a much improved JavaScript engine, Brendan talks about it and more in today’s episode. It’s a good listen, as is every episode, so if you aren’t already...
Akshell: An Impressive New Cappuccino Based...
Akshell is a new online IDE for building server-side web apps in JavaScript, including instant deployment to their cloud servers. It has actually been around for a little while now, but it recently relaunched with a completely redesigned used interface built using the Cappuccino framework, which provides a very rich and desktop-like experience for the app. It also makes use of the Ace (formally...
JavaScript Garden: Documenting The Quirky Parts
Good JavaScript documentation is extremely important, and through efforts like Promote JS, we have seen awareness of good documentation through sites like the Mozilla Dev Center increase, and sites like W3Schools, which provide old and often incorrect information, decrease through efforts like W3Fools.
JavaScript Garden is another new source of good JavaScript documentation that just came out....
1 tag
Joyent Relaunches Its No.de Hosting Service
Last night, Joyent relaunched its awesome No.de hosting service. Besides having a sweet domain name, the service looks to be a really simple way to host node apps in the cloud. It uses Git for deployment kinda like Heroku, which makes that really simple. No more FTP! Additionally, they are now supporting the latest stable versions of Node, 0.4 and 0.4.1.
They also announced a Cloud...
SproutCore 1.5 Gives Your App Handlebars
The fourth prerelease of SproutCore 1.5 was released last night. In case you haven’t heard of it already, SproutCore is an HTML5/JavaScript framework for building rich “native-class” web applications for both mobile and the desktop. Like Cappuccino, SproutCore is heavily inspired by Apple’s Cocoa Frameworks, but unlike Cappuccino, SproutCore is not a direct port of those...
February 2011
3 posts
Cappuccino 0.9 is out and it's awesome!
Cappuccino is an impressive framework used for building rich desktop-like applications in the browser. It is an implementation of Apple’s Cocoa frameworks in the browser, including a language written on top of JavaScript called Objective-J, and the Foundation and AppKit frameworks themselves. We’ve covered Cappuccino before here, but they just launched version 0.9 of the framework...
JSHint: A Community Driven Fork of JSLint
Anton Kovalyov and Paul Irish have been working on an awesome fork of JSLint, the tool by Doug Crockford that finds errors in your JavaScript code. The project started because they thought that JSLint was getting a bit too opinionated, and they wanted it to become more community friendly. So, they forked JSLint, and created JSHint, The (Gentler) JavaScript Code Quality Tool!
JSHint is a fork...
4 tags
LimeJS: A New HTML5 Game Engine
What follows is a guest post by Olavi Tonisson from Digital Fruit, the makers of LimeJS.
Only few days ago web and mobile developement company Digital Fruit has released under Apache open source licence HTML5 game engine LimeJS. Our desire to create game toolkit was initially driven from lack of tools for developing HTML5 based games generally and specially for touchscreens (iOS, Android)....
January 2011
1 post
Badass JS is back with some badass obfuscation!
Badass JS is back everyone! I thought a nice way to kinda relaunch would be with this…
($=[$=[]][(__=!$+$)[_=-~-~-~$]+({}+$)[_/_]+
($$=($_=!''+$)[_/_]+$_[+$])])()[__[_/_]+__
[_+~$]+$_[_]+$$](_/_)
I’ll let Adam explain this one in detail, but suffice to say, when the code above is evaluated by the browser, it turns into this:
alert(1)
Simple, right?!
Also, here is a converter that...
November 2010
5 posts
1 tag
Today In JS Episode Five
Welcome to Today In JS, a list of the best JavaScript news since the last installment. Enjoy!
Prototype 1.7 was released with the Sizzle selector engine, support for event delegation (which is huge!), lots of bug fixes and more! Check it out.
Endtable, an ORM for CouchDB on Node.JS
Read Write Web links to a project from the MIT Media Lab called depthjs, which is a Chrome extension that allows...