14 ms·
Unrelated, but your homepage has very bad FPS using firefox on mac due to the animation. Once I manage to scroll it works quite well.
by xavxav 3y ago
Unrelated, but your homepage has very bad FPS using firefox on mac due to the animation. Once I manage to scroll it works quite well.
- ezekg 3y agoThanks. That shader doesn't seem to play nicely with some GPUs and I'm still working on edge cases. If possible, could you look at your console logs and email me your specs? They should be logged. Email is in bio. It should be doing automatic categorization of the GPU to determine render quality, but maybe something's still incorrect there.
- djbusby 3y agoJust turn it off.
- deleted 3y ago[deleted]
- ezekg 3y agoIt does turn off when it detects a low-end or integrated GPU. But something may not be working correctly, or is getting miscategorized. That's why the debug information would help.
- djbusby 3y agoOr, again, turn it off and avoid the whole class of issues, wasted time and asking random HN folk for debug logs.
- BudaDude 3y agoDon’t listen to random comments on hacker news. It looks cool OP. Don’t throw out the whole thing for a few bugs
- bborud 3y agoYeah, as long as we're focused on the really important things. Like animations that nobody actually needs or wants (apart from the person putting it there). That is, of course, until it ruins the user experience by bogging down the browser. And then, sure, let's debug that and make sure it runs on everyone's browser/os/cpu/gpu combo. That's a brilliant use of time. Until someone turns up with a new combo where it doesn't work. Because judging by the comments, this seems to be a janky piece of code that isn't well understood. "Turn it off" (or rather, "rip it out, and throw it away" is good advice. If there is even a slight chance this might come back to haunt you and screw the user experience, it isn't worth it. If your animation is more important than avoiding a horrible user experience, well, that's kind of useful for your customers I suppose.
- Zetice 3y agoHow do you imagine user conversations take place, if not from "random HN folk"? Do you want an appointment? A lab?
- arp242 3y agoWhen you emailed me about this a few weeks ago I played around a bit with the shader, and just creating fewer blobs made the problem go away (reducing "for (int i = 0; i < 15; i += 1) {" to 5 in the "void main"), but I didn't really have the time to investigate in-depth or see what kind of visual effects that would give (dealing with this minified JS isn't exactly fun and I never worked with OpenGL shaders either), but just FYI. Good to hear it's not just me though (and the effects also aren't disabled for me either).
- bmicraft 3y agoNo problems here with firefox on x11 and amdgpu/mesa drivers fwiw
- spdustin 3y agoWith respect, all of that for some bokeh? Is it worth it for y’all? Do you know how many folks just leave when the stuttering starts?
- ezekg 3y agoThe entire lava lamp effect is a shader, not just the bokeh. :) I haven't noticed any drop in registrations, conversions, or any noticeable differences in traffic patterns after launching the redesign, so I'm not sure if this is actually happening. Though it's a valid concern and issue, and I do want to fix it. And I appreciate all the reports. I think it may be a retina resolution issue, but could be wrong. On launch day, everyone loved the effect (it goes along with the new logo) and only a couple people said it performed badly, but they were on exotic devices. I may have caused this a few days ago when I enabled rendering at retina resolution for tier 3 devices. What I wasn't expecting was so many tier 3 devices that aren't really what I'd consider "tier 3." I was expecting all tier 3 devices to be gaming-level GPUs. I guess I should have read the source [^0] more closely and I could've avoid this. [^0]: https://github.com/pmndrs/detect-gpu/ https://github.com/pmndrs/detect-gpu/
- tpxl 3y ago> What I wasn't expecting was so many tier 3 devices that aren't really what I'd consider "tier 3." I was expecting all tier 3 devices to be gaming-level GPUs. Could be the detection of GPUs doesn't work correctly? My nVidia 1080Ti is detected as nVidia 980Ti, and a sibling comment mentions an integrated laptop GPU being detected as tier 3 with isMobile=false.
- rcxdude 3y agoAnother danger here is testing with the website being the only thing on the PC: some people use their computers like that but many others will have many different things open at once: just because it can run at an acceptable FPS on the detected hardware doesn't mean the resource use is acceptable on a system which is multitasking. I usually have >100 tabs in my browser and at least 20 of which are loaded: they cannot all demand what your site demands, even though the hardware is quite high-end.
- cldellow 3y agoI'm not the person you replied to, but it's janky for me, too. Console logs: device: undefined, fps: 60, gpu: amd renoir, isMobile: false, tier: 3 FWIW, my laptop is a relatively beefy 2021 model (granted, with integrated GPU). For a business that's not about 3D rendering, spending an innovation token on making sure your landing page can have a smooth background animation seems like it's playing on hard mode.
- sandyarmstrong 3y agoYeah this feels totally broken on my M1 Pro running Ventura.
- loeg 3y agoIt stutters on an M1 Macbook running Chrome, for example.
- richrichardsson 3y agoIt's also horrifically slow on Chrome macOS: { "fps": 130, "gpu": "amd radeon pro 5300m", "isMobile": false, "tier": 3, "type": "BENCHMARK" } Definitely wasn't 130 FPS and made the whole page stuttery.
- jeffhuys 3y agoWorks horrendously bad on Firefox, works great on Safari/Orion... Macbook Pro M1
- ezekg 3y agoInteresting. I wonder if this is a retina display issue. I just pushed out a change that renders the shader at standard resolution even if the device has a retina display. I don't have a retina display on any of my devices except a 2019 MBA and it renders fine on it. I wonder why.
- definitelyauser 3y ago> I wonder if this is a retina display issue I'm using an external monitor running at 5120x1440 (Samsung, not retina) only, and am experiencing the the same on Firefox. At least not retina exclusive.
- ezekg 3y agoOh wow. Sounds like I should put an upper bound on resolution. I wasn't even thinking of somebody opening the page full-screen on an ultra-wide.
- causi 3y agoYour homepage needing a shader is at least a hot-pink flag for the whole company. Pretty janky here on Vivaldi as well unless I scroll really slowly.
- ezekg 3y agoWhat do you mean by this? I wrote the shader because gamedev is an interest of mine, and I wanted to give writing a fragment shader a try for the redesign.
- causi 3y agoBecause it's not bad enough to be a red flag but it does make me wary of the company's priorities. You used a complicated shader to make a scroll bar that doesn't scroll, which may as well have been a static background image, and half-visible janky blobs in the background I thought at first were eye floaters. The crushed font looks like a rendering error and the e's and s's looking identical made me stare at the word "businesses" because I swore it was misspelled. I do have to say the color scheme is gorgeous though.
- definitelyauser 3y agoGPU: {device: undefined, fps: 342, gpu: 'apple m1 pro', isMobile: false, tier: 3, type: "BENCHMARK"} Despite the supposedly high FPS it's very jumpy/laggy in Firefox, though fast in Safari.
- lopkeny12ko 3y agoWith all due respect, this is possibly the dumbest rebuttal I've heard. Why do I need a powerful GPU or even need my GPU to waste compute cycles just to view a webpage? Just get rid of it entirely. The visual flair is not adding any value. It's a performance drag, highly distracting, and serves no useful purpose whatsoever. This "trend" in modern web design is truly infuriating.
- ezekg 3y agoWasn't expecting so much candid feedback today. There was a Launch HN yesterday that had a 3D rubik's cube on their home page. It was literally pointless. But kind of neat. But you probably hated that as well, if I could assume. But I say that to point out that lots of companies do it, sometimes simply because we can (just look at Stripe and GitHub). I think the lava lamp effect is cool. The perf issues can and will be fixed.
- electroly 3y agoI went and found that Launch HN, and yeah, that rubik's cube is horrendous on my computer. They did not do as much effort as you did to make it work on low end machines. I don't have a GPU at all; your site disables the background effect but their site shows the cube anyway. Their site drags once that rubik's cube appears, and the cube itself animates at 1-2 fps. It's a very poor experience and I don't really see what the cube adds, but I do see what the cube subtracts. (Your site works fine on my computer. The effect is disabled and it's not a problem.)
- zb3 3y agoI'm sorry, but what should just. be a _progressive enhancement_ in this case completely ruins the user experience for me. However, I'm probably not your target audience, I'm just commenting on this trend in general.
- mynameisvlad 3y agoIt literally is a progressive enhancement, so I'm not sure what your point is. There's clearly bugs where it's enabled where it shouldn't be, and that's certainly an issue, but the comments here make it clear that it gets disabled automatically on lower-end devices.
- RobotToaster 3y agoIt's working fine for me on windows and firefox device: undefined fps: 30 gpu: "intel mesa dri intel hd graphics 400" isMobile: false tier: 2 type: "BENCHMARK"
- ezekg 3y agoI'm questioning whether or not I should continue into the realm of gamedev... the amount of "works on my igpu from 2015 in low power mode" and "stutters on my rtx 4070 ti" here is making me laugh out loud.
- tpxl 3y agoTbh, games with the most problems usually run home-grown engines that try to do too much.
- robertlagrant 3y agoJanky for me even when scrolling has started. 2021 M1 MBP.
- Const-me 3y agoThe pixel shader is cool, but consumes too much resources. On my 1080Ti, uses about 20% of GPU to render, which is too expensive for such a simple graphics. I’ve looked at the source, and it seems you’re doing too much computations there. Metaballs are usually rather simple, and they don’t require any trigonometric functions. Compute something like `sum( ball.z / length( pixel - ball.xy ) )` and apply the threshold. If you want anti-aliasing, use fwidth() for the screen-space partial derivative of that value after the loop, compute two thresholds around the iso-value, then smoothstep() instead of a hard threshold. Also, consider moving the ball parameters (center and size) into a constant buffer and update them on CPU. Because there’s just a few balls, JavaScript is good enough for the job. Your current version computes these things from time for each pixel for each frame. There’re about 8 megapixels on my display, so these computation costs are escalating very quickly.
- morgannewman 3y ago+1 the website is borderline unusable on my work laptop. I have an M1 Pro in my standard MacBook Pro 2021. I am using the latest version Chrome and this animation causes a huge performance regression on my computer when it's visible.
- oefnak 3y agoAlso runs terrible on my Pixel 5 with Firefox. As for your design choices, they remind me of the Mezmo landing page...
- internetter 3y agoIt's very laggy for me, and I'm on high end hardware. {"CANVASES":2,"GPU":{"fps":209,"gpu":"apple m2","isMobile":false,"tier":3,"type":"BENCHMARK"},"RESOLUTION_RATIO":2,"BLOB_COUNT":20,"BLOB_AMPLITUDE":"52.60","BLOB_RADIUS":"2.54","POSITION_X":"4.43","POSITION_Y":"1.72","RANGE_X":"4.64","RANGE_Y":"6.51","SPEED_X":"9.60","SPEED_Y":"4.51"}
- sBqQu3U0wH 3y ago>mac Sorry, that's what you get for not using a normal computer.
- popcalc 3y agoThe VC partners who call the shots here all use macs, give me a break. http://gg.gg/14h9m9 http://gg.gg/14h9m9