Fact is, JavaScript loaded in the browser is FAST! It’s the sending of code that needs to be optimized. The more libraries we add, the more code we write, the more we increase file size the more we decrease performance.

Customize Your JS Libraries

When building UIs, it’s not uncommon to see developers using large library tools like jQuery and jQuery UI.
Try to get only what you need out of the JS library you’re using, or get an alternative better and faster solution.

Avoid Polyfills

Polyfills are small libraries that fill a gap in browsers that don’t support the features we need them to.
For mobile, the use of Polyfills are typically not needed and add page weight.

JavaScript Media Queries

Use conditional scripts to load libraries depending on the device or user’s need.

    <script>
        if (window.matchMedia("(min-width:769px)").matches) {
            document.write('<script src="js/pikaday.min.js"><\/script>')
        }
    </script>

window.matchMedia()
A JavaScript version of CSS’s media query.

document.write
You should avoid using document.write() for scripts injection.
Try using: .innerHTML instead.

Example

    <script>
        if (window.matchMedia("(min-width:769px)").matches) {
            document.getElementById('#main').innerHTML = '<script src="js/aux.min.js"><\/script>';
        }
    </script>