People disable javascript in their browser? Give 'em something to cry about!

Did you know that two percent of people that use the internet disable javascript in their browser? That's a surprising amount.

Guess what? If you're a web developer using react, jquery, or some other js lib, it's gonna go haywire on them. Pitiful, eh? It won't even run! If you are using react on the client side for a simple application, it won't even run.

In this article, I'm going to show you some pretty (dark) techniques to make them turn javascript on forever.

1. The tag

This tag will display an html document on top of the existing one if javascript is disabled. All you have to do is put it in your html somewhere. You can not only store text, but also meta tags, headers, html bodies, and more!

<noscript>  <h1>Only Monkeys don't use javascript in their browser!</h1></noscript>

Something I've found useful on stackoverflow is redirecting them to a different page in your site.

<noscript>  <meta http-equiv="refresh" content="0;URL=/monkeysdontusejs"></noscript>

Pro Tip: Store a massive gif that takes up almost the whole screen size in the noscript tag or a rickroll video.

2. The IP logger prank

You can still log user IP addresses even when a client lives with javascript disabled.

I used Next.js for this since it does server-side rendering and can collect some sweet props from the backend and pass it to the frontend for you.

What I did was use the request-ip npm package and pass that as a prop from the backend with getServerSideProps.

import requestIp from 'request-ip'...export async function getServerSideProps(ctx){  return {    props: {      addr: requestIp.getClientIp(ctx.req)    }  }}

Here's the example: https://next-gen-noscript-killer.ironcladdev.repl.co/
And the code: https://replit.com/@IroncladDev/next-gen-noscript-killer

And I promise I'm not logging and stealing IPs. I don't even know what to do with one if I have it.

Well, what can you do with this? Maybe state something about still being able to log ips which makes no difference or that disabling javascript is a security vulnerability. Go wild!

3. Render your whole website with javascript

That'll make them feel left out. Even if a client has javascript disabled, they'll turn it on for a few sites that require it.

This isn't recommended for production websites, but yeah it works well.

If you don't want to do that, maybe render your css with javascript or make it so that they can't interact with any apis/backend functions. Get dirty!

4. Whoops.

Looks like @inhuofficial is gonna come after me for writing about making accessibility worse.

This article was for fun, and should be used for fun and not in production-level websites.

Adding some of these to your personal website or making a prank site would be reasonable.

Welp, have fun, don't get too dirty, and please share your ideas with me on how to take this a step further!

Also, happy new year!

Liked this post? Be sure to subscribe to my newsletter for new posts, new projects, recaps, and more!

Join my discord to get in touch and hang out!