Skip to main content

How To Test Your Website With JavaScript Disabled

· 3 min read

Testing your website with JavaScript disabled can help you provide a better user experience.

In this article we'll explain why testing your website without JavaScript is a good idea and explain different approaches you can take to test your website with JavaScript disabled.

Why test your website without JavaScript?

Most websites today use JavaScript to enhance their content, or even to render all page content in the case of single page applications.

So why test your website without JavaScript?

  • It helps you understand how JavaScript is impacting your page speed
  • It can help with indexing and improve SEO
  • Some users have JavaScript disabled for privacy or security reasons

You may find that some of your content depends on JavaScript and doesn't appear with out. Here's are two screenshots of the same website, one with JavaScript enabled and the other with it disabled.

Screenshots showing a page with and without JavaScript enabled

How to disable JavaScript with Chrome DevTools

One easy way to test your website without JavaScript is by disabling JavaScript execution in Chrome DevTools. Here's what you need to do:

  1. Open the website you want to test
  2. Right-click on the page and select Inspect
  3. Press Command+Shift+P on Mac or Control+Shift+P on Windows
  4. Type Disable JavaScript in the search field
  5. Press Enter and reload the page

For example, if we follow these steps on the Youtube homepage this is what we get:

Youtube loaded with JavaScript disabled

If you don't want to remember the shortcut for the DevTools Command menu, you can also click the top left Gear icon top open settings and then look for the Disable JavaScript checkbox in the Preferences tab.

Chrome DevTools settings

Use a browser extension to disable JavaScript

Another way to disable JavaScript is to use a browser extension like NoScript. This extension works in Chrome and Firefox.

NoScript lets you decide whether JavaScript is enabled or disabled by default, and you can choose to block or unblock specific websites.

NoScript extension

Showing fallback content with the noscript HTML tag

What can you do if your website doesn't work well without JavaScript?

Setting up server side rendering is a good starting point if content isn't showing up.

If parts of your website require JavaScript you can use the <noscript> HTML tag to show a message to visitors explaining why this part of the page isn't working.

<script src="app.js">
<noscript>
This part of our website requires JavaScript.
</noscript>

Trying to optimize your website?

Having a fast website and providing a good user experience helps your website rank higher in Google and convert better.

DebugBear is a monitoring tool that keeps track of your website performance, provides insights on how to improve it, and alerts you when something goes wrong. Start a free trial!

DebugBear performance monitoring

Get a monthly email with page speed tips