Hacker News Reader

Comment by jwalton | Hacker News Reader

Your website renders as a big empty blue page in Firefox unless I disable tracking protection (and in my case, since I have noscript, I have to enable javascript for "website-files.com", a domain that sounds totally legit).

View on HN

The problem is that the DIV that contains the main text has the attribute 'style="opacity:0"'. Presumably, this is something that the JavaScript turns off.

A lot of sites like to do things like this for some reason. I haven't figured out why. I like to use Stylus to mitigate these if I can, rather than enabling JavaScript.

This is a common anti-pattern — I believe they're trying to ensure that the web fonts have loaded before the text displays but it's really annoying for mobile users since it can add up to 2.5 seconds (their timeout) to the time before you can start reading unless you're using reader mode at which point it renders almost instantly.

The page animates in. I have no idea why it does, but it does, which explains why the opacity starts at 0%.

A lot of these sites (including this one) do work in reader view.

mitigation for a flash of unstyled content (FOUC) maybe?

I have tracking protection and ublock origin both enabled and it rendered fine (FF on Win10).

(presented as a data point for any poor soul trying to replicate your problem)

Chrome with uBlock Origin on default here, and it renders a big blue empty page for me, too. That's despite dragging in an ungodly amount of assets first.

Here's an archive link that works without any tracking, ads, Javascript etc.: https://archive.is/F5KZd

Noscript breaking websites? Who woulda thunk.

How do you manage to navigate the web with that on by default? It breaks just about everything since nothing is a static site these days.

Reply on news.ycombinator.com