Optimization Tutorials

  • By
    Incredible Analytics with Crazy Egg

    Analytics tracking is an important part of ensuring the success of any website or app, and the better information you get, the more you can do with that information.  I've always loved and appreciated what Google Analytics provides in the way of basic information, but GA's...

  • By
    Detect Unmatched CSS Selectors with Helium

    One thing I can't stand is extra code.  Whether it's an extra CSS or JavaScript file that's been included by the page, bloated HTML, or unoptimized images, we're making our millions of of desktop and mobile visitors pay for our laziness and mistakes.  A great tool...

  • By
    JavaScript DocumentFragment

    One of the lessor known but incredibly useful gems within JavaScript is the DocumentFragment.  DocumentFragments allow developers to place child elements onto an arbitrary node-like parent, allowing for node-like interactions without a true root node.  Doing so allows developers to produce structure without doing so within...

  • By
    Selector Engines: Right to Left

    One lessor known fact about CSS selectors, querySelectorAll, and JavaScript-based selector engines is that they read your selectors from right to left.  This news hit me as illogical at first, as you'd think that the first element in a selector string like "#myElement a.something .else" would...

  • By
    curl.js: Incredible AMD Loader

    Today there are dozens of AMD JavaScript loaders available, the most popular being RequireJS. There are also lesser known JavaScript loaders like YepNope, $script.js, LABjs, and Dojo's new native loader. My favorite JavaScript loader, however, is John Hann (unscriptable)'s curl. While allowing...

  • By
    Lazy Load Content and Widgets with MooTools and RequireJS

    The idea of lazy loading content is not new;  we've been lazy loading images (check out my MooTools LazyLoad plugin) for quite a while now.  And why wouldn't you lazy load content?  There are SEO advantages, load time advantages, bandwidth savings, and more, so including a bit of...

  • By
    Introducing LazyLoad 2.0

    While improvements in browsers means more cool APIs for us to play with, it also means we need to maintain existing code.  With Firefox 4's release came news that my MooTools LazyLoad plugin was not intercepting image loading -- the images were loading regardless of...

  • By
    MooTools History Plugin

    One of the reasons I love AJAX technology so much is because it allows us to avoid unnecessary page loads.  Why download the header, footer, and other static data multiple times if that specific data never changes?  It's a waste of time, processing, and bandwidth.  Unfortunately...

  • By
    Smarter Script Loading with LABjs

    We all know that asynchronous resource loading is the key to preventing unwanted and unnecessary blocking within the browser.  There are many scripts/libraries available to help with async script loading but the ones that succeed are simple, compact, and reliable.  Those words describe Kyle Simpson's LABjs...

  • By
    Load MooTools Classes on Demand with RequireJS

    RequireJS is a hugely popular JavaScript project right now thanks to what it does:  asynchronously load JavaScript files and properly handle their introduction to a namespace flawlessly.  Of course, callbacks are provided which allow you to work with the new code one it has been loaded.