[frontend-ninjas] js background bug on high resolution
flibustier opened this issue · comments
The page does not respond, because of chaos.js according to Firefox
Line 22 in chaos.js
Firefox on Windows 10 2736*1824 (because 1080p is for the weak!)
I tried emulating the same resolution in Firefox and it worked without problems:
I think the problem is the high DPI, not the high resolution. I couldn't find an option to emulate high DPI screens in Firefox. I tested the page in Chrome with an emulated high DPI screen and it worked, so I think Firefox that's buggy. I found a way to emulate high DPI screens and I still couldn't reproduce the issue. Maybe it's the Firefox version: I tested on Firefox Mobile Beta 49.0b6, Firefox Developer 54.0b12 and Firefox 45 on Windows (via browserling).
I don't want to touch a JavaScript file with 4 space indentations and double quotes (I prefer the chaos). Anyway, maybe replacing canvas.width and canvas.height with constants will fix it.
Same issue on Firefox ESR on Linux (Debian) with 1080p 15,7"
I can't reproduce the bug even emulating the resolution :(
@MUCHZER I didn't write the actual animation - no idea what happened there. I'm also not a canvas expert, and unfortunately I don't use Firefox nor do I have access to a high DPI screen 😕
The solution is instead of hardcoding 2x2 pixel blocks, use the DPI to figure out how large the blocks should be.
I'll make a PR.