10 ms·
hiccupFX.js
- thorum 5y agoMy favorite is when the link you’re trying to open jumps away 1 nanosecond before you click on it and you wind up clicking something else entirely.
- sneak 5y agoThis actually happens on the mobile website during the amazon.com one click checkout when you try to change your payment method. It's absolutely insane to me that they haven't fixed it yet.
- yawnxyz 5y agoGoogle does this by popping up a bunch of "related links" as soon as you're trying to click on the second link... I honestly thought all those well-paid engineers and UX designers who work there could make something better than that
- DarylZero 5y agoThey get paid the big bucks to make it worse in the way that benefits the owner
- draw_down 5y ago
- bogwog 5y agoI wonder if that’s the same team responsible for making embedded youtube videos start playing on mobile safari if your finger touches it while you’re just trying to scroll. Aka, the Evil Department.
- nkozyra 5y agoThis is so bad I refuse to believe it's inadvertent.
- giantrobot 5y ago> I honestly thought all those well-paid engineers and UX designers who work there could make something better than that Don't forget that you are not Google's customers. Their advertisers are their customers. You're just a product they sell. So the UX does exactly what it is supposed to do: get eyeballs on advertisements. Even if you click back at Google's scale inadvertent clicks are big money. Besides you seeing something advertised/promoted they got some free tracking data to sell. So long as whatever they linked to managed to load some tracking pixels or even full tracking scripts before you hit the back button that's more tracking data hoovered up. Even just the request for the resource is data for tracking purposes.
- jez 5y agoThis is yet another reason why I’m glad to have switched away from using Google search. Not even for privacy/advertising/tracking considerations, just general quality of life things like being able to click the whole search result bounding box (not just the top link), never having to suffer with related links appearing on back navigation, no AMP pages, etc.
- democracy 5y agoI am sure they can fix it but the fix is going to bring the revenue down so some heads can get chopped. Who wants to put their CV "improved Google search results user experience by increasing the ad revenue by -3%"
- 8note 5y agoI find the chrome android browser to be the worst for that. Not only does the page load new things, but google resizes everything just as you click
- nyellin 5y agoNow we're just missing that feature from Google Search which randomizes the order of buttons on the page.
- bob1029 5y agoThis kind of jank should be unforgivable in a modern webapp. I am happy to see it being shamed appropriately.
- Raed667 5y agoi didn't come here to be attacked like this /s
- The_rationalist 5y agoOK this is amazing
- The_rationalist 5y agowhere's the code?
- Raed667 5y agoYou can remove the `.min` from the URL and it easily readable https://cdn.jsdelivr.net/npm/hiccupfx@1.1.1/hiccupfx.js https://cdn.jsdelivr.net/npm/hiccupfx@1.1.1/hiccupfx.js
- teaearlgraycold 5y agoWhy the leading ;?
- jspash 5y agoSome build techniques simply concatenate scripts instead of transpiling etc. And there is no telling how the previous script ended (or not). I seem to remember this is done to mitigate some issues that can arise from poorly written scripts that come before this one.
- Raed667 5y agoIt's for avoiding syntax issues, when you import multiple self-invoking functions. Here is a stackoverflow that explains it https://stackoverflow.com/a/7365214/4690715 https://stackoverflow.com/a/7365214/4690715
- udia 5y agohttps://github.com/fanfare/hiccupfx/ https://github.com/fanfare/hiccupfx/
- erichanson 5y agoLMAO
- ss108 5y agoWas literally just dealing with this issue while trying to use Gilt. Happens all the time nowadays. Less server-side rendering
- vmception 5y agoReminds me of the time someone put a string concatenation function behind a server as a dependency just to see how many unskilled programmers would connect to it They even made a docker package
- _s2fz 5y agoHave you got a name? I'm curious.
- roryokane 5y agoMaybe they were thinking of http://left-pad.io/ http://left-pad.io/. I found a left-pad Docker image, too, but it’s by someone else: https://hub.docker.com/r/wbinnssmith/leftpad https://hub.docker.com/r/wbinnssmith/leftpad (source: https://github.com/wbinnssmith/leftpad-cli https://github.com/wbinnssmith/leftpad-cli).
- vortico 5y agoBonus: Can this be a pure CSS library?
- jspash 5y agoI thought CSS was generated by JS these days? Apparently it was too difficult to remain its own thing.
- brundolf 5y agoI think you could do it with keyframes, though the "randomness" would have to be hard-coded (the same every time)
- roryokane 5y agoYes, most of it can. I remade this effect using CSS animations, as an exercise: Demo: https://css-demo-client-side-render-jankiness.roryokane1.repl.co/ https://css-demo-client-side-render-jankiness.roryokane1.rep... Source code: https://replit.com/@RoryOKane1/CSS-demo-client-side-render-jankiness#fake-client-side-render.css https://replit.com/@RoryOKane1/CSS-demo-client-side-render-j... However, a limitation of not using JavaScript is that I can’t randomize the changed properties: the page changes in the same way after every reload.
- g8oz 5y agoI do love thinking about all the tree shaking, minifiying and bundling that went into slimming down a website as my browser struggles to decode a few MB of json and makes 20 async calls before fully rendering the screen.
- y4mi 5y agoThese 20 async calls don't actually need to reestablish the connection nowadays, so you don't actually get a significant performance penalty anymore for doing multiple requests. Unless the requests are triggered after another request finished of course. That's still significantly impacting loading times
- hamburglar 5y agoNot having to reestablish the connection is a nice thing, but 20 round trips is still 20 round trips. Lots of opportunity for delay there.
- giantrobot 5y agoYeah this is something people love to gloss over. On good 5G the connection latency might be 15-20ms to some topographically "close" server. Realistically that's an absolute minimum and you'll see 50-100ms latency to actual servers. When work depends on those resources it can't even start until all the data is returned. Far too often nothing can happen until a case are of resources gets returned. Then there's the fun outlier of some slow AdTech script that finally returns, screws with the DOM, and causes a layout and repaint. It's just today's "What Andy Giveth, Bill Taketh". Great job all around everyone.
- jcelerier 5y ago> These 20 async calls don't actually need to reestablish the connection nowadays, so you don't actually get a significant performance penalty anymore for doing multiple requests. why is everything so terrible to use then :-(
- 5y ago
- crate_barre 5y agoA lot of this happens due to a basic lack of understanding of how documents flow at best, pure negligence at worst. Ads and lazy loaded content are being dropped into elements without min heights causing everything to just suddenly shift down. The other thing some of these sites do is take raw lazy loaded json and render a whole view (who would have thought, an on-demand slideshow is jarring if you didn’t account for how it’s gonna just be plopped onto the page). They are also dynamically formatting dates, author names, titles, plopping in client side a/b testing, etc. Some people really should be fired honestly.
- louissan 5y agoSomeone must send this to the Google core web vitals (or whatever it's called) team. Their CLS guys/gals will have a fit :-)
- blurbleblurble 5y agosometimes I even click on the wrong thing
- samwillis 5y agoLove it, feels like browsing the web about 20 years ago. (Or a few bad websites now…) So this is an example of Cumulative Layout Shift (CLS)[0]. It is a metric (coined and named by Google) which indicates how much “movement” there is during the initial render of a page, caused by reflowing the layout. Ideally you have very little or none of it for better UX. I believe it can have an impact on organic search ranking and potentially ad rank. The most common cause is images included without width and height attributes, therefore the page has to reflow after the image has been downloaded. Other things that can cause it are multiple css files overriding each other and loading slowly, or JavaScript effecting the layout after it has loaded. You can use Google Lighthouse [1] to measure this (and other things) on a site. 0: https://web.dev/cls/ https://web.dev/cls/ 1: https://web.dev/measure/ https://web.dev/measure/
- andrepd 5y ago>a few
- nexuist 5y agoThe irony being that Google themselves doesn't even get good scores on Lighthouse. Check out the report for a simple search for "tomatoes": https://i.imgur.com/qcaMTBh.png https://i.imgur.com/qcaMTBh.png ...although I guess they got a green light on CLS, lol. URL for transparency: https://www.google.com/search?q=tomatoes&sxsrf=AOaemvKVS3_EpuZ4m5jaKqPLiwImb3aRbg%3A1642285667258&source=hp&ei=Y0rjYZj3DIrL_QaGiIjYAQ&iflsig=ALs-wAMAAAAAYeNYc8-wPwXCrioWgQcy7PdRwTomYkjA&ved=0ahUKEwjYtMHu5rT1AhWKZd8KHQYEAhsQ4dUDCAg&uact=5&oq=tomatoes&gs_lcp=Cgdnd3Mtd2l6EAMyCAguEIAEELEDMhEILhCABBCxAxCDARDHARCvATILCC4QgAQQxwEQrwEyBQgAELEDMggIABCABBCxAzIFCAAQgAQyCAgAEIAEELEDMgUILhCABDIICAAQgAQQsQMyBQgAEIAEOgQIIxAnOhEILhCABBCxAxCDARDHARDRAzoLCAAQgAQQsQMQgwE6CwgAEIAEELEDEMkDOgUIABCSAzoNCC4QgAQQxwEQ0QMQCjoHCCMQ6gIQJzoOCC4QgAQQsQMQxwEQowI6CAgAELEDEIMBOggILhCxAxCDAToRCC4QgAQQsQMQgwEQxwEQowI6CwguEIAEELEDEIMBOggIABCABBDJAzoHCAAQsQMQCjoHCC4QsQMQClAAWJsLYJ4MaANwAHgAgAFoiAHxBpIBBDEwLjGYAQCgAQGwAQo&sclient=gws-wiz https://www.google.com/search?q=tomatoes&sxsrf=AOaemvKVS3_Ep...
- sdflhasjd 5y agoGoogle search results have these annoying info boxes that automatically slide open, then they score themselves green
- bgia 5y agoThis definitely hits a nerve. Google does that nowadays and I cannot count how many times I have clicked by mistake on these suggested links that show up after all results have already loaded.
- hwers 5y agoI feel like this is a symptom of google etc not having enough real competition. If google and twitter were scared for their survival they wouldn't allow slack like janky sites and disrespecting the free speech of their users as much as twitter does.
- moralestapia 5y agoTwitter IS scared for its survival though, they just have truly incompetent product leads (+ all the damage from Dopesey's leadership). Google is only playing deaf while revenue keeps coming. I don't know which one is worse.
- peckrob 5y agoIt's hilarious to me how much Google is hammering on content layout shift as a web vital for ranking websites when they're one of the most annoying offenders. I can't tell you how often I have accidentally clicked that "People also search for" box that sometimes loads in beneath the first result, when I am actually trying to click the second result. It's infuriating, and makes me wonder if anyone at Google actually uses their own product.
- richnftio 5y agoIt happens when you click on a result, then hit the back button and want to click the next link. Then, just before you click, the suggested links appear. Maybe they measured clicks and thought this must be a really useful feature.
- phist_mcgee 5y agoThere's an extension [1] and a ublock filter [2] for this [1] https://chrome.google.com/webstore/detail/remove-people-also-search/cghpggkibkdhekhnobjelccimccodcpd?hl=en https://chrome.google.com/webstore/detail/remove-people-also... [2] google.*##[id^="eob_"]
- beebeepka 5y agoForgive me for saying this but I find all these complaints shallow, or a sign of youth. Hear me out, though. The reasons are real. The modern web sucks bad but it's been like that for many, many years. Certainly longer than a decade. From my point of view, as someone who writes js for a living, I started using NoScript a while ago and the web is generally very fast and nothing shifts position on my screen as things (ads) load. Yeah, I don't do social media and some sites are nothing but a blank page. It's a blessing. I guess my point is: avoid doing things that annoy you. If you don't like js heavy sites - stop using them. Or just adopt NoScript. No, ublock isn't the exact same thing. The granularity is counter productive in this respect.
- cyborgx7 5y ago"Don't use some of the most popular sites on the internet if shifting around during loading is annoying to you." isn't very productive advice.
- beebeepka 5y agoProductive? Don't have a short response to the implications here. In any case, doing things because they are popular doesn't sit well with me. Fast food is popular, and yet I would advise to stay away from most of it
- cyborgx7 5y agoProductive as in helpful. As in something that is of any use to anybody.
- togaen 5y agoThe hero we need.
- ryanmccullagh 5y agoLowes.com has the word jankines I've ever used.
- yeetaccount4 5y ago
- jb1991 5y agoWe've been using this in production for about six months, with various reactions from users. The results are mixed -- some really like it but others have sent us terrifying emails and we've lost two support staff in the great resignation over it. Your mileage may vary.