Top 8 JavaScript Projects You May Not Know

Developer.com content and product recommendations are editorially independent. We may make money when you click on links to our partners. Learn More.

Last year’s article 10 Experimental PHP Projects Pushing the Envelope and its followup 9 More Experimental PHP Projects You Should Check Out struck such a chord with developers that I thought it would be fun to continue the theme, this time applying the idea to the JavaScript programming language.

Perhaps more than any other programming language in history, JavaScript is experiencing a major renaissance thanks to its unique ability to serve as the glue between the client- and server-sides of a web application, a trait which is quickly becoming indispensable as developers seek to create highly responsive features which closely mimic their desktop-bound brethren. Given so much attention, we’re seeing incredible innovation in the JavaScript space, and with it a fair amount of experimentation. In this article I’ll highlight ten crazy JavaScript experiments, some of which are already changing the language in profound ways.

JavaScript Project #1: The Real-time Web Implemented with Node.JS

Although this article no doubt cover some doozies, perhaps no JavaScript experiment better represents “crazy” than Node.JS (better known as simply Node). To put it plainly, Node is a server-side JavaScript implementation, which to the uninitiated flies in the face of everything ever said about the language. Yet Node’s skyrocketing popularity proves there is occasionally a method to the madness.

Providing developers with the ability to use a unified language (JavaScript) on both the client and server sides of an application, and sporting an event-driven programming model which excels in real-time, high traffic environments, developers have flocked to Node and quickly created a software ecosystem which facilitates Node’s use in a wide variety of applications, including notably web development.

JavaScript Project #2: Building Web-based Games with ImpactJS

The “inevitable dominance” of JavaScript-based web games has long since become a perennial declaration, with countless attempts to make good on the promise always seeming to fall short. Nearly 16 years after JavaScript’s inception it seems the language is finally ready to enter the gaming arena, with high quality JavaScript-based game development tools seemingly unveiled on a weekly basis (seven of which were covered in the recently published article, Top 7 JavaScript Tools for Web Game Programming). Perhaps the most impressive of the bunch is ImpactJS, and amazing HTML- and JavaScript-based gaming engine.

For most developers, one glance at ImpactJS’s official demo game Biolab Disaster will be enough to conjure dreams of creating the next great viral web game. Although not free, the low cost ImpactJS developer license costs $99 is a drop in the bucket considering its capabilities.

JavaScript Project #3: Reading PDFs with pdf.js

The Portable Document Format (PDF) has long been an indispensable part of the web. Cross-platform support, downloadability, and convenient printing capabilities are just a few reasons so many organizations use PDFs to distribute manuals, product literature, research papers, and just about every other imaginable type of document. Yet merely reading a PDF requires users to install a plugin, and in some cases requires the browser to hand off the document to a third-party application.

Seeking to eliminate these inconveniences, a group of developers have recently started work on pdf.js, an HTML5-based PDF reader which is attempting to implement the PDF standard specification in JavaScript. Interestingly, in an introductory pdf.js blog post, project founder (and Mozilla Corporation researcher) Andreas Gal indicates that the goal of pdf.js isn’t to elevate PDFs to a first class citizen of the web but rather to produce a browser-native PDF renderer which can eventually replace the need to rely on PDFs altogether!

JavaScript Project #4: Building Cross-platform Mobile Applications with PhoneGap

Many developers aspire to build mobile applications yet fret over the considerable time and monetary investments required to acquire new language skills and development tools. These concerns multiple when taking into account the idea of developing mobile applications which are supported on a variety of platforms, Android and iOS for instance.

PhoneGap seeks to allay those fears by providing an HTML5-, CSS3-, and JavaScript-based toolkit for building a unified mobile application which is then wrapped into a device-specific solution. The JavaScript API offers an impressive level of access to device resources, including for instance the iPhone’s accelerometer, camera, file system and notification interface.

Although I haven’t yet felt the urge to dive into the mobile development space, when the inevitable happens its practically a certainty I’ll first look towards the open source PhoneGap project as the clearest path to entry.

JavaScript Project #5: Creating a Better Terminal Window with TermKit

Developer Steve Wittens recently stirred up quite a hornet’s nest with his release announcement of TermKit, a graphical replacement for the OS X Terminal. Based on WebKit, Node.js, jQuery and Socket.IO, TermKit certainly adds some visual panache to a decades old interface which admittedly looks quite plain even on OS X, which according to the majority of comments on Witten’s blog and on Hacker News, is right where the majority of developers (including yours truly) would like to leave it, thank you very much.

All kidding aside, TermKit certainly looks quite promising, offering a few undeniably cool features such as the ability to view an image from directly within the terminal window rather than opening a utility application. It also offers a great demonstration of Node’s ability to interact with an operating system. Be sure to keep tabs on this project as it’s future looks quite bright.

JavaScript Project #6: Going 3D with Three.js

Three dimensional web-based applications are about as elusive as the Yeti, only very occasionally making an appearance and generally stirring up quite a bit of excitement when they do. Despite many attempts, adding a third-dimension to the browser has proved more difficult than anticipated. Technologies such as WebGL and the HTML5 Canvas element are however opening the door to building three dimensional web interfaces, and a project called Three.js offers developers with a great way to get started.

A JavaScript-based 3D engine, Three.js is packed with features such as cameras, objects, lights, and materials, and supports the ability to render three-dimensional scenes using the canvas element, SVG, and WebGL. Although barely a year old, it’s already possible to create some really impressive three-dimensional renderings, as demonstrated on the project page.

JavaScript Project #7: Implementing .NET in JavaScript with IronJS

Microsoft’s Dynamic Language Runtime (DLR) has revolutionized the way developers think about programming languages, offering a unified solution for allowing languages, both dynamic and statically typed, to share libraries and interact with one another in compelling ways. Quite a few languages have already been ported to the DLR with great success, among them IronPython and IronRuby. Fredrik Holmstrom’s IronJS project adds JavaScript to the list.

I find this project particularly interesting in that in an eWeek interview Holmstrom describes the rather informal way in which the project came about, beginning with downloading the DLR source code and experimenting with the companion sample language implementation until he felt comfortable enough to set his idea in motion.

JavaScript Project #8: Adding Webpage Backgrounds with Vegas

I doubt there’s a self-proclaimed computer geek alive who hasn’t spent an inordinate amount of time over the years updating his desktop background. Using the Vegas jQuery plugin, it’s possible to easily add similarly compelling backgrounds to your web pages. Although adding web-based backgrounds has of course been possible for years using standard HTML and CSS, Vegas offers several additional effects such as fading and slide shows which really add to this plugin’s attractiveness.

Be sure to check out the Vegas demo for a great example of Vegas’ capabilities.