Comment by LinuxAmbulance
7 days ago
As a backend person, sometimes I look at what's being done for front end stuff and pull back in ever so slight horror.
It's an excellent article, and the work within is very well done, but there's a part of me that screams "Why would you introduce this much complexity for what should be a simple scroll?" (overcoming technical hurdles to produce the desired end result aside).
I don't get "as a backend engineer" comments like these.
OP is doing a basic analysis on what kind of solutions exist for a typical UX edge-case. They even provide the simple solution that most people use (margin-bottom).
And for fun they go on to see if they can solve it without the minor drawback of the simple solution.
We've got to stop acting like it's a badge of honor to avoid UX consideration. We might not be people who implement UIs, we use UIs all day and should be able to muster up a few opinions about how a UX interaction should work.
The issue is that UI/UX is in a terrible place. Your comments would be valid if this was 15 years ago.
UX is in the gutter with extra clicks and terrible workflows in almost every website. UI is a catastrophe of mobile first, but not really, but sort of kind of we want power users but we need regular users, and all our UI kits look like total ass that is incompatible with so many other things.
This website is a great example. The webpage doesn't load instantly and instead forces the user to wait for text to appear. Great UX engineering guys, make the user wait!
Let’s not act like backend dev is much better. They’re two sides of the same coin.
The entire web stack – backend and frontend – is a mess because the nature of the web is cumulative development over two decades, leading to a pile of abstractions upon abstractions that by some miracle remain mostly interoperable and backwards compatible.
1 reply →
Looking at the UI of modern apps and websites, I think we're too late with this.
What the mass user finds "intuitive" is already formed and it's in a horrible place and it's hard to go back.
More people use computer applications effectively now than at any previous point in history. You might want to check your priors and consider that taste does not inform usefulness.
As a full-stack engineer who also studies UX, most UI solutions span from a desire for originality, aesthetics, etc. and not improved experience.
Which is what I loved about this article - it demonstrates a sizeable effort resulting in a UI implementation that is just not much better than having callouts / figures in the text- and then admits it.
[dead]
I think the article does a pretty good job of explaining the gap between what can happen easily, and what a 110% over engineered "perfect" solution is to a UX problem.
Building excellent user interfaces is hard, regardless of the technical stack. You have to sweat a lot of the finer details, break out of any platform default behaviour where appropriate, and over engineer something in service of building a 'delightful' user experience.
Or, you can do as most do, and just not do this. #anchor-links with `scroll-behavior: smooth;` CSS will get you the basic smooth scrolling.
The really hard part of that is that if you can’t build an excellent interface, you will build a worse one than if you used the native interface. So you either need to be prepared to sweat every last detail forever.
Using #anchor-links that show up in the URL (but not the browser navigation history) should really be the UX baseline for acceptable anchor link implementations. I hate it when long pages don't allow you to actually link specific sections.
Frontend is completely inaccessible to me.
From time to time I dip my toe in and try new things, but as productive as I can get with Astro, the illusion vanishes as soon as I have to understand any of the plumbing.
Fortunately, I can still party like it’s 1999 just fine: just yesterday, I worked on a janky brutalist web app (the same way I did back in 2002, cribbing from the O’Reilly “Dynamic HTML: the Definite Reference”) and “deployed” it with rsync to pico.sh. It’s practically unstyled and I didn’t even use jquery, but it works.
The thing is, backend stuff is largely solved. You need to store data? Here you go, here's a database. You need to process a bunch of strings for similarity? We got an algorithm for that.
But frontend stuff is messy. How do you tell a person what they're trying to do is wrong and they need to change their inputs? Oh, maybe we can highlight the input or we can pop a modal message. Haha, psyche! Users ignore that shit! Now what you gonna do, buddy?
Frontend is a mess because all you people are a mess.
Contempt for your users inevitably leads to bad products so it’s no wonder things are bad if this is the prevalent attitude among front end web developers.
20 replies →
> Frontend is a mess because all you people are a mess.
As a backend guy who considers himself extremely fortunate that nearly all of his users/customers are technical, this got an audible chuckle out of me.
> The thing is, backend stuff is largely solved. You need to store data? Here you go, here's a database.
That's like saying "You need user interaction? Here you go, here's a frontend."
I believe it's because on the frontend, everyone wants to look different and have a unique identity. Whereas on the backend, everyone needs to be the same to follow standard best practices.
2 replies →
I'd imagine consumer hardware is the same.
For example, every Thunderbolt dock's internals are basically the same, while the outer shell tries to be as different as possible.
I think the biggest problem is that HTML and even HTTP weren't developed with those use cases in mind.
Before WWW was a thing we already had user interfaces and the fact that current users frequently prefer those ancient, text user interfaces over modern ones tells a real LOT.
Well if it continues to be a mess, something like WASM-based flutter-web might just eat the frontend
> what should be a simple scroll
Because the scroll, as you see, is not simple. The complexity of the real-world scenarios outlined in the post force the complexity of the solution. It may feel that "it's simple common sense" kind of thing, but if you ever tried to implement a simple common-sense thing, you know that it only appear simple.
By the same token, some UX person might read about the mechanics of database transactions with two-phase commits, or about MVCC, and ask why so much complexity exists around what should just be a simple write to disk.
"Reality has a surprising amount of detail."
Because the default behavior, the problem they describe in the introduction, is bad. It confuses many people, I’ve seen it firsthand many times as an observer in usability testing.
Is it really necessary to highlight the heading at all?
I’m a passionate frontend engineer, but I do think we are often busy “asking if we could”, and ignore “if we should”.
Worth noticing, on mobile you can’t even read the conclusion in the “it’s beautiful” demo, because the navigation covers it.
I understand that it is just a demo, and that issue could be solved independently…
But I think it also points at the observation that when you try to do these kinds of unusual things, you open yourself to unintended consequences.
And while you can mitigate those consequences one by one, my experience is that you generally won’t have a chance nailing them all, unless you are also minimizing their number… by not getting too fancy.
> Is it really necessary to highlight the heading at all?
You should be able to take a given UX and ask yourself if it can be improved.
A table of contents that tells you where you are on the page is useful.
Here's an implementation: https://getbootstrap.com/docs/5.3/components/modal/
On desktop, the table of contents on the right shows you which header you're on.
All I know is the default browser behavior for anchor links within a page has real usability issues when you have anchored headings at the bottom of the page.
You are correct though that there are many cures worse than the disease, but it is a real "disease", so to speak.
1 reply →
Because I thought it would be fun :)
It is fun! The person you're responding to isn't wrong; front end is a little horrifying. But it's kind of like a jungle in that the scary beasts, swamps, poisonous plants, and the harsh elements are accompanied by incredible opportunities to experiment, explore, discover, and appreciate beauty.
Backend presents some awesome opportunities too, but I absolutely love weird problems like the one you're solving here. It's in the realm of simultaneously necessary and totally unnecessary. This is where interesting stuff happens!
Chrome developers keep adding unhinged complicated “features” that nobody wants or asked for and immediately are abused and broken.
Numerous autoplaying video methods for example especially when they follow the mouse, play in the background, or use lazy loading to be unkillable.
Speaking of lazy loading or whatever hundreds of variations probably exist around it now, the terrible front end devs of the world have decided to use that for everything. Everything is a sliding panel full of sliding panels and there’s no way to use browser back features coherently.
Scrolling down a site now loads a new site and destroys your history. Even if you scrolled to move content up because an autoplaying video anchored to the bottom of the screen is blocking the view. Scroll down too far causes a jump and the site decides you’re done and loads the next thing with no way to navigate back.
How do these developers have a job? How are features like this even invented with no critical thought or understanding of real world use cases questioned. It’s again and again and again that we see this.
And the Google team is so proud every time with their demo videos that is painfully obvious they put no thought into it outside of their bubble of them deciding some random thing was technically possible to do as a proof of concept and should therefore be immediately released as a fully supported feature.
> Numerous autoplaying video methods for example especially when they follow the mouse, play in the background, or use lazy loading to be unkillable.
Do you really think nobody asked for that? And maybe for something even more obnoxious than that?
(I use Firefox with uBlock Origin to preserve my sanity.)
That's only because you are used to the over complexity of backend work. As someone who is pretty far removed from both front and backend work (or web work in general), both seem pretty complex. Frontend at least has the excuse of being at the interface between humans and computers, which is inherently much harder
You say "backend" but I'm guessing you're not talking about modern cloud infrastructure work, the complexity at which I (as a frontend person) scream in similar abject horror.
As a DevOps engineer who’s spent the last decade specialising in cloud infrastructure, I whole heartedly agree with your scream of horror.
> Why would you introduce this much complexity for what should be a simple scroll?
The article explains the "why."
> overcoming technical hurdles to produce the desired end result
Yes.
As a backend developer, I have a lot of respect for frontend developers that have to deal with edge-cases and minutiae that we don't have to. Building APIs and interfaces for computers is easy. Building them for people is HARD.
I can recommend backend people to do frontend once in a while. You don't have to like it. But it will make you a better developer. I've been in more than one team where there was this us and them dynamic and some lack of mutual understanding about why things worked a certain way or limitations and constraints. It can lead to poorly thought through APIs and API responses, which then triggers frontend work to engineer around that. Also, frontend developers tend to have better intuition for asynchronous stuff; because everything in a browser is async. Backend developers tend to be a bit naive on that front.
I'm a hands-on CTO in a very small company. So, if it's technical, I'm doing it. Websites, apps, backends, databases, devops and all the rest. Not always fun. But at this point I can fill every role in a typical product team and do a decent job.
And I agree that what passes for state of the art on the web is a bit meh. Anchors date back to the early days of the web. One of those forgotten features that is still vaguely useful but a bit underused. There's a reason mobile developers prefer native UI toolkits. Browsers are a bit limited and backwards. CSS is a bit of a straight jacket. And Javascript is a bit of a basket case as a language.
> too far down to scroll
Yeah, when you can't easily scroll anymore because it's "too far" then something has gone very, very wrong.
I remember the days when every new project started with "now let's write our own String class". As someone who works on both, it seems server and native software left this era in the distant past, but we're still there in web development.