Skip to main content Accessibility Feedback

How to only load your JavaScript file if the browser supports your code

Yesterday, I talked about JavaScript feature detection.

One cool thing you can do to help improve performance (and save some bytes for people on limited data plans and old devices) is to only load your JavaScript file if the device or browser supports your code.

To do that, we’ll use loadJS from Filament Group.

Include loadJS on your site, and then include a “cut the mustard” test. If the browser passes, use loadJS to load your scripts. If not, do nothing.

function loadJS( src ) { ... }
var supports = 'querySelector' in document && 'addEventListener' in window;
if ( supports ) {
    // Load our scripts
    loadJS( 'path/to/your/scripts.js' );
}

🚀 I just relaunched my Vanilla JS Pocket Guides with new code examples and real projects to help tie everything you’ll learn together. Check it out.

Have any questions or comments about this post? Email me at chris@gomakethings.com or contact me on Twitter at @ChrisFerdinandi.

Get Daily Developer Tips