background preloader

Designing Better JavaScript APIs

Designing Better JavaScript APIs
Advertisement At some point or another, you will find yourself writing JavaScript code that exceeds the couple of lines from a jQuery plugin. Your code will do a whole lot of things; it will (ideally) be used by many people who will approach your code differently. They have different needs, knowledge and expectations. This article covers the most important things that you will need to consider before and while writing your own utilities and libraries. We’ll focus on how to make your code accessible to other developers. Peter Drucker once said: “The computer is a moron.” Table of Contents Fluent Interface The Fluent Interface1 is often referred to as Method Chaining (although that’s only half the truth). Aside from major simplifications, jQuery offered to even out severe browser differences. Method Chaining The general idea of Method Chaining6 is to achieve code that is as fluently readable as possible and thus quicker to understand. Command Query Separation Going Fluent Consistency Callbacks

Your jQuery: Now With 67% Less Suck Fun fact: more websites are now using jQuery than Flash. jQuery is an amazing tool that’s made JavaScript accessible to developers and designers of all levels of experience. However, as Spiderman taught us, “with great power comes great responsibility.” This becomes more important for those of us who have yet to move into the magical fairy wonderland where none of our clients or users view our pages in Internet Explorer. Thankfully, there are a few very simple things anyone can add into their jQuery workflow that can clear up a lot of basic problems. Selector optimization Selector speed: fast or slow? Saying that the power behind jQuery comes from its ability to select DOM elements and act on them is like saying that Photoshop is a really good tool for selecting pixels on screen and making them change color – it’s a bit of a gross oversimplification, but the fact remains that jQuery gives us a ton of ways to choose which element or elements in a page we want to work with. $("#id p");

JavaScript Events And Responding To The User Advertisement Whenever people ask me about the most powerful things in JavaScript and the DOM, I quickly arrive at events. The reason is that events in browsers are incredibly useful. Furthermore, decoupling functionality from events is a powerful idea, which is why Node.js1 became such a hot topic. Today, let’s get back to the basics of events and get you in the mood to start playing with them, beyond applying click handlers to everything or breaking the Web with <a href="javascript:void(0)"> links or messing up our HTML with onclick="foo()" inline handlers (I explained in detail in 2005 why these are bad ideas2). Note: This article uses plain JavaScript and not any libraries. Disclaimer: The event syntax we’ll be using here is addEventListener()3, as defined in the “DOM Level 3 Events4” specification, which works in all browsers in use now except for Internet Explorer below version 9. All of this is based on event handling and reading out what the browser gives us. For example: (al)

Useful JavaScript Libraries and jQuery Plugins For Web Developers Advertisement If you have a problem and need a solution for it, chances are high that a JavaScript library or jQuery plugin exists that was created to solve this very problem. Such libraries are always great to have in your bookmarks or in your local folders, especially if you aren’t a big fan of cross-browser debugging. A JavaScript library isn’t always the best solution: it should never be a single point of failure for any website, and neither should a website rely on JavaScript making the content potentially inaccessible. Progressive enhancement is our friend; sometimes JavaScript won’t load properly, or won’t be supported — e.g. users of mobile devices might run into latency issues or performance issues with some JavaScript-libraries. In this two-part overview, we feature some of the most useful JavaScript and jQuery libraries which could be just the right solutions for your common problems. Due to the length of this post, we’ve split it into two parts for your convenience: