Pinned Tweet
Ben Hong 🦋
5.9K posts

Ben Hong 🦋
@bencodezen
🧑💻 staff devex engineer 👨💻 @vuejs core team 🧑💻 @angular team 👨💻 @nuxt_js ambassador ❤️ docs 📝 @obsdmd nerd
Joined Mayıs 2015
1.5K Following10.6K Followers
Ben Hong 🦋 retweeted

March MadCSS Round 1 PART TWO (the right side of the bracket) starts in ONE HOUR at 10AM on YouTube.
@KevinJPowell vs @selfteachme
@JoshWComeau vs @cassidoo
@wesbos vs @bencodezen
@ania_kubow vs @argyleink
English
Ben Hong 🦋 retweeted

Tomorrow at 10AM EST!!
who you got your money on?
@KevinJPowell vs @selfteachme
@JoshWComeau vs @cassidoo
@wesbos vs @bencodezen
@ania_kubow vs @argyleink

English
Ben Hong 🦋 retweeted

Unpopular opinion: ALWAYS read the code, whether written by an AI agent or sentient meatbag
Too long to read?
Scope it down & redo
Can't understand it?
Use AI to explain (it's good at that)
Too lazy?
Go into upper management
dax@thdxr
mfs will do anything but read the code
English
Ben Hong 🦋 retweeted

we've just released Nuxt 4.4! it brings:
🏭 custom useFetch/useAsyncData factories
🗺️ vue-router v5
💪 typed layout props
🗣️ `useAnnouncer` for screen readers
⚡ 28x faster route generation with `unrouting`
🍫 smarter payload handling for cached routes
📊 build profiling
👉 read more at nuxt.com/blog/v4-4
English
Ben Hong 🦋 retweeted
Ben Hong 🦋 retweeted

I had no idea what I was getting myself into, but damn you're in for a treat.
Build a Bracket before Friday, March 6th for the chance to win awesome prizes at madcss.com!
Syntax@syntaxfm
Build your bracket for the world's first ever CSS tournament, March MadCSS. Premieres Friday 10ET on YouTube, and the stakes are high. win over $1,500 worth of prizes madcss.com
English
Ben Hong 🦋 retweeted

all my obsidian notes are now a living, digital garden 🌿🌸
each plant is a notes from a tag: older ones on the trunk, newer ones as leaves. i wanted to create a sense of tending your garden, so scrubbing the timeline lets you watch your notes grow chronologically.
Kat ⊷ the Poet Engineer@poetengineer__
i want to grow my ideas like a garden. a conceptual prototype inspired by this thread of tweets.
English
Ben Hong 🦋 retweeted
Ben Hong 🦋 retweeted

Of course frontend has a concept of architecture. The short version is we learned what you are suggesting doesn't work well in this space.
The history of web development answers your question. There is a category of data, we refer to as "state", that is ephemeral. Now we can define ephemeral in different ways since everything persists somewhere but the key is that the ownership of this state is very much tied to the User Interface. Focus, selection state, as so on are shallow examples of this, but you can also think of this in terms of projections of those too. This category only gets larger as things become more interactive.
Early web development did not exactly understand this. And when our life began on the server we'd lose this information between actions. POST a form, bye bye state. Now we wised up to that and started serializing it back and forth. ASP.NET had it's ViewState and so on. But we hit a fork in the road in mid 2000s because keeping ephemeral UI state on the server didn't scale great.
We wanted RESTful backends, so we could spin up microservices. MVC became king. Its simple model fit: Model (persistent data), View (projection of that data), Controller (singleton that wires it up). What is missing is this non-persisted state. This worked pretty well for simple things. But sort of ignored the problem. Which was ok because people wanted quicker interactivity so more and more started moving to the client.
Dawn of SPAs recognized that a more structured approach needed to be taken on the client. So what did we do? We tried to bring our MVC there. Angular, Backbone, Ember, these frameworks followed it. But a pattern started emerging.. we had this thing that had no place. Singleton controllers didn't cut it. `$scope` in angular is the most obvious. And as any early Angular dev will attest became a huge mess, but Ember also started adding all these new concepts, It was more like MVC(insert 12 more letters here).
But this was the problem. In fact the misery that was Angular.js => Angular 2 was IMO motivated almost entirely because of this unreconcilable gap in design.
React wasn't the first to realize this though. MVVM frameworks like Knockout.js replaced Controller singletons with per View (or per Model) instance wrappers as a natural place to hold this ephemeral state. The VM standing for View Models. But I'd say React was the first to consolidate on a pattern that was already happening in the wild. For better or for worse VMs did much more tightly couple things. Pretending these things weren't coupled just made traceability very difficult. React owned it and was like there is a natural split between the Model and the VM but the VM and the V are not benefiting from the seperation. And thus Components were born.
But people early days still really liked their separation. So we built really complicated stores. So we could model all but the most ephemeral state as a sort of hoisted Client model. Early attempts were really awkward because synchronization became really buggy. So work went into making this predictable, singular so that state couldn't get out of sync. Redux comes to mind. But there was this tension. Lifecycles were clearly tied to the UI, so there was this constant issue around either holding too much state that was unnecessary or needing to like register/unregister. Obviously things like Angular had services and DI as their approach. But the problems were the same.
Around the mid 2010s... thanks largely to GraphQL it became better understood that except for where the user was the source we could basically view state as derived from the server. When people started using it, the need for Client side stores shrunk considerably. This evolved eventually into things like React Query.
Now even though the sources no longer needed management, we still have this derived state graph running through our components. It might not be as obvious because of say the way React re-runs components. But by 2018 with the introduction of Hooks you could start seeing it right in front of you. An irony not lost on me because it was like looking at 2010 Knockout.js code.
The result while not realized completely mechanically is an acknowledgement that State and UI are not easily separable, they overlap. Modeling Component === state like early React might have oversimplified things, but something like MVC categorically misses. A lot of the progress in the last 5 years around Signals is based on preserving these 2 graphs(UI, State) ability to co-exist in a way that is natural.
As projects get larger it is the only sane approach to modularity. It's arguable that patterns around strict contracts/regions should be solidified into concepts, and to be fair boundaries around errors and loading(Suspense) do contain these things. We have natural boundaries around nested route sections (tied to URL subpaths). But each graph has their own mostly homogenous primitives so those coordination points are extra concepts, and because of the fluidity of this relationship being too strict here will cause you great pain later.
So architecture is very much at the top of mind of those designing these systems and tools. However, frontend web is also the most accessible platform. So I don't expect every bootcamp dev to know, understand, or appreciate these things.
The structure we have created to allow this modularity and co-location can also be greatly abused. Partially because new devs can be "productive" within their small slice. Which is by design and generally beneficial. But doesn't bestow the same sort of architectural purity and rigor one might expect to find in such large complex systems. To me this is more cultural than an engineering.
The information is out there. We're living in it, but who needs to know? It's hard because people who know a bit more keep respinning on the same expectations of what doesn't work and take few steps in before they realize it. And I think a lot of engineers outside of frontend have no appreciation for it.
Lewis Campbell@LewisCTech
Why do frontend devs put all their logic in "components"? I came up in the winform desktop all days and knew back then, as juniors, that it was an anti pattern to couple business logic and UI so tightly. How does frontend still not have a concept of architecture?
English
Ben Hong 🦋 retweeted
Ben Hong 🦋 retweeted

One of the best uses of AI in my workflow isn't generating code. It's capturing the ideas I used to lose.
One command. The agent generates an outline w/ full context in less than a minute.
No more disrupted flow state. No more lost insights.
bencodezen.io/blog/the-quick…
English
Ben Hong 🦋 retweeted
Ben Hong 🦋 retweeted
Ben Hong 🦋 retweeted

Some claim that web standards no longer matter now that an increasing percentage of code is written by AI.
If developers are not the ones writing code, who cares whether those languages and APIs are well-designed?
I beg to differ.
In fact, I think it now matters more than ever!
Hear me out.
AI is effectively a new type of web developer — a user of web technologies with its own constraints and user needs. Some overlap with humans. Many don’t. But one thing still holds true: how well web technologies cater to user needs directly affects how efficiently they can be learned, composed, used, and verified.
Usability has always struggled with quantification. We could describe friction, but mapping it cleanly to cost was hard.
But when the user is an AI, there is now a direct metric of user effort, and it maps cleanly to financial cost: tokens!
Try this experiment: Compare how many tokens @claudeai uses on a front-end project with complex UI interactions and implicit state, versus a similarly sized Node.js CLI application with explicit data flow. In my experience, the difference in tokens used, accuracy, and iterations necessary, is dramatic.
API design affects how *much* of the codebase an AI agent needs to traverse to understand what’s going on.
It affects whether the relevant pieces fit in context windows.
It affects how confidently they can verify correctness.
All of these translate *directly* to cost and reliability.
We’re still in the early days. We’ve spent decades refining design principles for humans, and we’re still not done. Figuring out what design principles we should follow to make languages and APIs learnable, efficient, and safe *for AIs as well* is a whole new (exciting) field of study.
But *what* the principles are is orthogonal to *how much* they matter.
The latter seems clear to me: In a world where code is increasingly generated, how could the quality of our code interfaces matter *less*? Quite the contrary — it compounds!
English










