Browser Crasher
xxpertHacker (931)

About a month ago, I had opened Chromium bug reports explaining this, informing them that a single page can crash a whole browser, but they... seem to have not really cared, so Chromium is okay with it, thus this cannot be considered illegal or malicious, as the developers don't care.


Update

As of today, September 9th, Chromium finally acknowledged this bug and successfully replicated it, meaning the bug should be fixed within the year.


Update #2

They don't care, they closed the report.


Looping location.reload quickly in JavaScript can lock up the browser.
But... many factors come into play:

  • Page size: large pages load slower, thus they reload slower too, if it's too slow, it's completely ineffective, although annoying.
  • Loading speed: Related to the previous point, but there is more to loading than size, and HTML is just slow to parse in general, especially poorly designed HTML.
  • Execution speed: There are a few micro-optimizations that can be applied to improve the performance of the loop.

So, how do you beat all 3?

CSS: A style-less page will load faster than one with style, so I cut it out.
Loading speed: Cut out everything unnecessary for a basic webpage to test the crash. HTML is slow to parse, so I used XHTML instead. Lastly, the page has no external data to fetch, it's all in one page.
Execution speed: There's much that can be done to improve speed here:

  • Simply opting into "strict mode" improves performance noticeably.

An example of what we could use:

for (;;) {
    location.refresh();
}

This is straightforward and simple, but... it's not at it's best. refresh takes a boolean argument determining whether or not to reload from the server or cache, true indicating that it should load from the server.
As we used location.refresh, we kept doing a method lookup, directly binding to the function would be better.

const { reload } = location;

Unfortunately, reload exists on the prototype of the Location class, it requires the this of the location object, so it needs to be bound, put together:

"use strict";

const refresh = location.refresh.bind(location, false);
// false -> load from cache; faster than HTTP request to the server

for (;;) {
    refresh();
}

Now, that is probably the best you can do in JavaScript... but JavaScript isn't the only option for usage on the web, and I know how to use the other one: https://en.wikipedia.org/wiki/Webassembly. Wasm loads faster than JavaScript, parses faster, and executes faster, so you know what I did.

(import "location" "reload" (func $reload))

(func $_start
	loop
		call $reload
		br 0 ;; jumps to the inner most block,
		;; thus it repeats this loop
	end
)

(start $_start) ;; execution flow starts here

What the attached Wasm looks like in JavaScript is essentially just this:

import reload;

function _start() {
    for (;;) {
        reload();
    }
}

Very similar, yet what difference is there? It's faster in every way, that's it.

Now, why would you use this webpage? Maybe you want to redirect specific users from a specific URL on your server to it? ¯\_(ツ)_

Go check the source, run the page, have fun!


Report this to your browser vendor

I have already opened a Chromium report regarding this bug myself.
If you are on another browser, ex: Firefox, Safari, Edge, Opera, and this works, please report it to them as appropriate.
This bug is very annoying, I have personally opened the page too many times while developing it, and it almost crashed my low RAM computer :)

You are viewing a single comment. View All
xxpertHacker (931)

@CodeLongAndPros I barely remembered that I had asked, but I doubted that you would've remembered either, it was some time ago.

@Jasperscode This shouldn't have affected GPU usage at all :/
Any good CPU ought to be able to handle this.

Lastly, I've used an old Windows 7 and it nearly crashed the PC, but the hardware was perfectly fine.