Making Drupal's JavaScript Rock Hard Awesome

The JavaScript shipped with Drupal core is not all that great. If I’m going to be completely honest I have to say that at times I feel the code reminds me of something a JavaScript guru said to me when he said, “Some of the worst JavaScript I’ve seen is in Drupal core.” Ouch. While I don’t think this is completely true, there is some massive room for improvement.

The improvements needed to Drupal’s JavaScript are no surprising to those familiar with it. For months there have been back channel conversations trying to figure out a plan of attack for Drupal 8. Once we have a plan of attack it becomes much easier to rally the troops, make design decisions, and collectively make Drupal 8 a release that shines for JavaScript. With that in mind here are four points that I think are essential to making JavaScript great in Drupal 8.

1. Common Patterns

Larry Garfield recently pointed out that we needed JavaScript that PHP developers can write. My main pain point was that JavaScript is so different from PHP I didn't see how we could do that. For example, PHP uses classical OOP while JavaScript using prototypical OOP. With some soul searching and spending some time playing with a new language I realized that many PHP developers will do the same thing I do. They will fire up Google to do a search to figure out how to do something.

As part of this we need to convert the JavaScript part of Drupal to a set of common JavaScript patterns used by the masses of jQuery developers. This provides for a lot of material when someone does a search, training classes for those that want them, documentation documentation documentation, and a jQuery community we can lean on and become more apart of in the process. Instead of trying to invent our own version of a wheel we use theirs and reap from the existing benefits.

2. JSLint

JavaScript has some great parts and a lot of ugly parts. This is what you'd expect from a language whose foundation was built in weeks rather than years like most languages. But, it has become the most widely used language on the web and is the language of the browser. We simply cannot ignore it. And, doing it poorly can introduce security holes, poor performance, and a lot of problems.

JSLint is a code analysis tool enabling us to look for bad coding practices. jQuery, other libraries, and a lot of JavaScript developers use it to check their code. For example, jQuery has it integrated as part of its build process.

We should build JSLint into our process and possibly our testing tools. This would help us catch problems and bad practices as early as possible. This can be thought of as a coder analysis for JavaScript.

3. Minified

jQuery 1.5 is 207kb in size. It might be considered madness to send that to every browser as a base library. Minified and gzipped this size comes down to a reasonable 29kb. Yet, the JavaScript written for Drupal core has no such minification. We send full JavaScript source files filled with comments and all the possible long forms to every page. Yikes.

Drupal needs to have the ability to send minified JavaScript files when in production and the core files need minified counterparts. When it comes to front end performance on sites that are becoming increasingly more dependent on JavaScript this will have a needed impact.

4. Knowledge Sharing

To make our JavaScript awesome across the board we need to help people grow in their understanding and usage. We need to share knowledge of coding standards, best practices, patterns, snippets, and more. While I'm not entirely sure what this should look like, something similar to JQ Fundamentals seems inspirational.

Playing with the jQuery and JavaScript Communities

If we do all this well I hope we can play better with the larger jQuery and JavaScript communities. This has a great potential for Drupal and its developers. If we have JavaScript these communities want to play in it's another area we can attract people and they can help us make the JavaScript even better.

Drupal 7 is in many ways the best version of Drupal so far and the best the open source CMS. It’s time to step up our game for Drupal 8 and the JavaScript improvements offer a great place to make Drupal even better.