Stealing from the libraries

It's more like borrowing... no one gets hurt.

I often don't use any framework to do my work unless it is part of the requirement. Often I am accused of trying to reinvent the wheel while someone has already solved the problem. I didn't want to include jQuery to the code, because at the time, I thought I didn't need it at all. Don't get me wrong, jQuery is amazing, and I highly recommend people to use it, after they have learned and mastered JavaScript. But even though I don't always use these libraries, I often steal from them.

I spent an evening trying to make sure my code runs when the DOM is ready. It worked like a breeze on Chrome. I tried it on Firefox, made a few tweaks and it worked just as well. Then I went on Safari and my code was not running at all. This was when you couldn't rely on DOMContentLoaded. So I spent the whole evening trying to find a way to make it work, and couldn't figure it out. I thought Safari sucked and went to test it on Good Ol' Internet Explorer and my page loaded silently, without ever firing the event.

I had no way of knowing whether this code would work on the multitude of browsers. So I did what any programmer would do and added jQuery to my page. I was confident about all other parts of my code because I don't use browser sniffing anywhere, I use feature detection. But I had to include the whole of jQuery's library just to make use of one feature. Not happy about it.

I slept on it. The next day, I opened the jQuery file and searched for DOM ready and read the whole section. Then I copied the section and resolved all the variables.

// jQuery 1.4.4
bindReady: function() {
    if ( readyBound ) {

    readyBound = true;

    // Catch cases where $(document).ready() is called after the
    // browser event has already occurred.
    if ( document.readyState === "complete" ) {
        // Handle it asynchronously to allow scripts the opportunity to delay ready
        return setTimeout( jQuery.ready, 1 );

    // Mozilla, Opera and webkit nightlies currently support this event
    if ( document.addEventListener ) {
        // Use the handy event callback
        document.addEventListener( "DOMContentLoaded", DOMContentLoaded, false );

        // A fallback to window.onload, that will always work
        window.addEventListener( "load", jQuery.ready, false );

    // If IE event model is used
    } else if ( document.attachEvent ) {
        // ensure firing before onload,
        // maybe late but safe also for iframes
        document.attachEvent("onreadystatechange", DOMContentLoaded);

        // A fallback to window.onload, that will always work
        window.attachEvent( "onload", jQuery.ready );

        // If IE and not a frame
        // continually check to see if the document is ready
        var toplevel = false;

        try {
            toplevel = window.frameElement == null;
        } catch(e) {}

        if ( document.documentElement.doScroll && toplevel ) {

Around 45 lines of code or a kilobyte uncompressed. Just like that I had the feature that I wanted without downloading the whole library. And the guarantee that it will work across all browsers.


I designed my PHP framework from the ground up. I have used it on multiple projects for clients and it is very efficient. However, I borrowed code from a lot of places. I have worked with Symfony, codeignitor, zend, and many more, and whenever I have encountered issues that I couldn't solve, I used those frameworks as reference. For example, when I had edge cases in my router, I looked at Symfony's implementation to fix the problem.

I like to be in control of my code, that's why I have a very hard time using NPM. Instead, I go to the source, read the code and then copy it. My buffet approach might be a slower process but at least I don't have to worry about a left padding issue.


There are no comments added yet.

Let's hear your thoughts

For my eyes only