Show HN: Performative-UI – A react component library of design tropes

Posted by lizhang 8 days ago

Counter1179Comment213OpenOriginal

hope you enjoy

Comments

Comment by avaer 8 days ago

I've worked on several projects where people looked at the site, which was simple and straight to the point, and people would straight up tell me they didn't take it seriously because it didn't have these performative UI things on it.

It's like when a Youtuber's audience complains about how they're constantly asking you to subscribe. The reason it happens is because the statistics say it works.

Comment by theturtletalks 8 days ago

It really comes down to first impression. Your website design is your company’s first impression. If the design is clean, people will believe the product is clean and robust as well. Similar to how people think things that cost more and probably high quality and better overall.

As for this website, the best component is the ASCII animation in the hero and you can’t even copy that component. In fact, that nice ASCII hero is what gave me a good first impression to go thru all the components.

Comment by zevyoura 8 days ago

It's there: https://vorpus.github.io/performativeUI/#/components/ascii-h...

Comment by theturtletalks 8 days ago

Ah it’s in the hero section, kind of scanned that section but had lost interest by that point

Comment by vasco 8 days ago

So the thing that made you go through all the components didn't even hold your attention enough to make your argument true

Comment by theturtletalks 8 days ago

I was on mobile and a lot of the pages are overflowing. After going thru half, it got a bit annoying. I actually keep a directory of all these tailwind/shadcn registry websites and this one drew me in more than others.

Comment by freehorse 8 days ago

My first impression when entering websites with such "hero animations" is noticing my gpu usage spiking and my power consumption increasing by 20W because somebody thought it was cool to have some pointless but "cool" canvas/WebGL/CSS (or whatever it is) animation.

Comment by StilesCrisis 7 days ago

What's the point of having the GPU if you never use it, right?

Comment by freehorse 7 days ago

I want to use my compute resources for stuff that are actually useful/relavant. I have no problem if somebody makes some animation that actually conveys something relevant for the topic of the website/product/article etc, eg some animated plot to showcase some data, esp when that can convey more than a classical visualisation. To be fair, I also dislike hero images in general, as they are distracting/useless, consuming bandwidth resources and screen space (esp in mobile). But "hero animations" take this a step further.

Comment by sidewndr46 7 days ago

I worked at a startup that had an unusually fancy landing page. I noticed that it was sluggish on my laptop. Someone pointed out there phone tended to heat up when showing it off to customers. We poked into what the contractor had done. They apparently used some bezier curves to animate stuff in a nice way. Each time the animation moved it computed the entire bezier curve to some superfine detail then picked a point in it and put the elements on the page.

Comment by hdjrudni 8 days ago

Also on the HN homepage: https://cognition.ai/blog/frontier-code Not quite ASCII but pretty close!

Comment by aaronharding 8 days ago

explain why Craigslist, temu, etc. are all popular then? :p

Comment by theturtletalks 8 days ago

Sometimes utility can be so good, users don’t care about design. I was also thinking of it as a business coming to a SaaS website. B2C is filled with so many dark patterns, first impression probably plays less of a role.

Comment by HWR_14 8 days ago

Craigslist became popular when that was the clean look for a website, and then never bothered updating. Network effects in action.

Temu offers people the ability to save money. If your product is "X, but cheaper" you can have a worse UI than X.

Comment by beezlewax 8 days ago

Amazon is a hideous looking website too and always has been. Ebay is similar too in that aspect and plenty of others.

Comment by Urahandystar 8 days ago

They were established when hideous websites were common changing would cause uproar and possibly alienate a large group of users. Look at Googles web page just a text box on a blank page, no way you are launching with that UI in 2026.

Comment by _the_inflator 7 days ago

See? It is about goals.

There is a reason why landing pages don't use distraction.

As a platform lead and product lead with millions of customers, be assured that you are not your customer. Never ever think of you as the focus of your website if you want to have success in business.

If you want to sell or marked and money as well as the slightest bit of seriousness is involved, you have to follow industry standards and never your own taste which is highly misleading.

Boring first is a good statement and principle to follow. Always track and A/B. There is a reason why all landing pages look the same kinda, and at least follow a certain structure.

Any deviation from it won't help you, even though you personally enjoy your personal website. You would be surprised what other visitors think about your website, how they perceive it, use it, and I mean literally everything: browser size, smartphone model, screen size, scrolling, click behavior, colors - everything.

I am so glad the psychology of online sales has matured. It is in everybody's interest to work in a trustworthy environment and using the right approach signals a company acknowledges and appreciate its customers.

I learned it the hard way, but got the lesson. I am totally different. I find many landing pages fishy, while they are the most successful there are, and like exploring on my own as well as fantastic animations.

On the other hand, I value the text only principles of everything serious from archivex and Pubmed. I am a developer fist, who loves animations sind decades. But this is bad for business. ;)

Comment by wavemode 8 days ago

I don't think the commentary being made here is that startup websites should not be flashy. Just that, maybe they don't all need to look exactly the same as each other.

Comment by dayjah 8 days ago

I think homogeneity is an unavoidable end game for the internet (unfortunately).

At work we’ve been discussing whether to migrate off our home grown component library to Material UI. I shudder at the thought, personally. However, a compelling reason to use a ubiquitous framework is that the ubiquity means folks intuitively know how to interact with your product.

Like many of us I was born into a deeply customizable Internet, all of my websites were green or red on black. They were a glorious amalgam of fixed width fonts and <blink> tags. With occasional wingdings characters for fun and games and complex <table>/<tr>/<td> tags for really epic layouts. They were l33t, honestly ^_^

But, as time goes on and more and more people use this thing, converging on the one-true-UX feels like a net good thing assuming the fundamentals are right. To some degree the LLM-ization of the Internet is essentially the end game of squashing the personality out of the Internet which bootstrap started.

We’re on the cusp of spoken word being the core UX of computers with a fall back to reading the LLM transcript, neither of which benefits from <blink>

Comment by hntiz 8 days ago

> a compelling reason to use a ubiquitous framework is that the ubiquity means folks intuitively know how to interact with your product

Not that I disagree with you, but I'll also offer a tradeoff.

When people expect to pick up your app intuitively, it can also just mean them using the app absent-mindedly, which can mean them skipping the manual and jumping straight to trying to tie up the support lines. Whereas if your ui asks for a user's full focus up front, yes there are downsides to that but they're also more engaged.

Comment by NewsaHackO 8 days ago

I guess the issue is that when someone can't use a product immediately, they have an urge to abandon it altogether, not learn how to use it.

Comment by preg_match 8 days ago

It depends highly on the application. If the application domain is inherently complex and or used in business contexts, then they will have to learn how to use it regardless. Intuitiveness only works for somewhat cookie-cutter applications. Consider Excel: Excel is not intuitive to people who have not used excel. We can make it easier to use, but regardless the user will have to learn the fundamentals of a spreadsheet (and even how the data is stored in memory!) in order to successfully use excel. The reason I say users even have to understand how data is stored in memory is because of types. Dates are not strings, for example.

Comment by maxweylandt 8 days ago

Related: institutional isomorphism https://en.wikipedia.org/wiki/Isomorphism_(sociology)

Comment by enos_feedler 8 days ago

Homogeneity doesnt need to be the endgame just a pitstop along the way. We should have a universal tool for creating unique things. If everything is unique the cognitive load is high we get lazy and output all converges on shallow stuff that is the same. If the tools are homogenous we learn something once and spend energy on making the diffetences

Comment by kid_cubi 8 days ago

We're migrating our Material UI components to homemade components, since MUI doesn't cater to our needs anymore.

Comment by szundi 8 days ago

[dead]

Comment by jsdalton 8 days ago

It seems to me the parent commenter is saying the opposite: looking exactly like each other _is_ the point. It's a form of social signaling, to indicate that a project "belongs" to the in group of high-flying successful AI hype projects.

Note I'm not arguing that this is a good strategy. But given that so many people follow it I imagine it's not as bad as it appears on the surface.

Comment by muvlon 8 days ago

It's a bit of in-group signaling but I think, importantly, also date signaling. A 2026 hype website looks different from a 2020 hype website looks different from a 2010 hype website. Having a generic 2026 hype website look tells visitors that you're either new or update your website's design to follow current trends.

They do the same with cars, where it's even more important and even more explicit. The design language has to change every couple years so that you can tell when somebody is driving a car older than 5 or so years. For example, currently we're doing blobs but with a few sharp features and muted colors. Before that it was more colorful and more metallic paint. Before that, in the 00s, it was pure blobs. Before that it was all sharp edges etc. Now sharp edges are beginning to make a comeback.

That's why I don't think we'll ever have the "one true design language". Fads and trends will continue, repeating themselves to a degree but also changing in new ways.

Comment by everforward 7 days ago

I think they sort of do, it’s a form of signaling.

It’s the same game we play verbally with slang. Slang word gets made up, people use it so others know they’re in the group that uses the slang, usage spreads until it’s no longer a group indicator. You see it all the time as an age grouping. You can almost guess someone’s age by the slang they use for “good” (cool, lit, bussin, etc).

This is the same. Startups invent a new UI style to separate themselves from the incumbents, incumbents eventually copy the style, cycle repeats.

Comment by noisy_boy 8 days ago

My colleague vibe coded a website that looks exactly like this one. Everyone on the meeting loved it - they thought it was cool. These were IT people.

Comment by ceejayoz 7 days ago

The IT people know no one's really buying just off the flashy website alone - because they don't! - and that it'll get management to okay it.

Comment by brightball 8 days ago

I use a Substack site for the conference that I run. The popup and subscribe buttons everywhere used to annoy me...but they work. Went from 0 to almost 1,000 subscribers on an otherwise low traffic site and it's by far the best way to reach people.

https://carolina.codes

Comment by SpyCoder77 8 days ago

Another way to get a lot of traffic is getting the top reply to the top comment on the top hacker news post. Speaking of which... https://github.com/SpyC0der77

Comment by nwatson 8 days ago

I was in the Winston-Salem Flywheel coworking for eight years, good place. I hope the Greenvile site is as good.

Comment by brightball 7 days ago

Beautiful facility. They renovated the old Pepsi bottling plant.

https://www.flywheelgreenvillesc.com/

Comment by epolanski 8 days ago

Same for clickbait thumbnails, people hate them, and yet don't really click on non clickbaity ones.

Comment by thewebguyd 8 days ago

In the marketing world this is called revealed preference. This stuff is A/B tested to death. Anyone trying to sell something is best served by watching people's behavior instead of listening to what they say, as the two are often different if not polar opposites.

Comment by 4chandaily 8 days ago

The perspective marketing world seems toxic. From the perspective of the "consumer", it sure does feel like we are being "ignored", "tricked", or "bamboozled" when our stated preferences are ignored in favor of "revealed preference".

It isn't that we have a "preference" for these things, it is far more likely that a user just doesn't have their guard up 100% of the time, and these psychological manipulations are designed to cut through that.

Sure, these strategies probably net clicks, but they aren't from people who "chose" your product, they are clicks from people who were manipulated into clicking.

I suppose whether you think that is okay depends on your industry and ethics.

Comment by thewebguyd 8 days ago

Yeah, it is highly toxic. I'd assume that in most cases those "revealed preferences" are specifically engineered, not organic. It's taking advantage of biological reflexes and calling it a true preference.

Comment by Lalabadie 8 days ago

It's behavioral marketing, vs status/aspirational marketing.

A stated preference isn't necessarily current or situational (I will choose to run instead of watching another 45 minutes of Youtube videos).

A situational preference is often inertia, and behavioral marketing will directly hinder the meta cognitive processes that usually give us the agency to override our default mode choices (John has been on YouTube for the last 20 minutes, what next suggestion is not likely to keep him there?)

Comment by gryn 8 days ago

Better for you(the seller) vs better for me (the buyer)

Two agents with two different utility functions fighting each other, it's an adversarial relationship/game.

The fight is for your limited attention span.

Clickbaity titles or least informative ones, 20min of rambling for what could've been a 2min video or article, spreading the meat of the info in the later half of the video for better retention instead of the beginning, highly misleading previews at the beggining, etc ... are good for the content producer but not so much for the content viewer that has to sift through it only to reliaze that didn't care about that particular thing.

Not limited to videos, but also things to buy the meat of the technical/practical description of the product get worse and worse each year and the other proxy signals for them too.

Seems like marketing is a lot like military conflict drown the enemy in lot of noise to drop the SNR.

what's that you want to buy a 4k video projector and set a filter for it? here it is for cheaper. Oh, you wanted the actual dots on the wall resolution to be 4k instead of max supported input signal, oops.

You're used to higher price meaning better quality? guess we'll flood that price point with shitier quality progressively until we find your limit

Comment by marcosdumay 8 days ago

I guess in the social sciences world this is called institutional erosion...

Youtube is a perfectly "unbiased" "democratic" repository, where crazy people shouting conspiracies and prize-winning documentaries have the same thumbnail and half-line of text for you to discover if they are any good.

Comment by all2 8 days ago

I really wish there was a way to filter out the soy-O-face thumbnails entirely. I do not like them. I do not want to see them.

Comment by unlogic 8 days ago

Check "DeArrow" chrome extension.

Comment by wnevets 8 days ago

Its like when people say they hate politicians all the while they've been voting for the same Senator for the past 30 years.

Comment by sgsvnk 8 days ago

There are 2 kinds of people- people who understand tech and people who use tech, in the ratio 1:9 (or even lower?). For the 90%+ people who like using fancy tech and feel smart/intelligent, the bling on your landing page is necessary.

Comment by XorNot 8 days ago

Youtubes monetization guidelines also require it.

Comment by jdw64 8 days ago

The funny thing is, the techniques shown here are the ones that were once considered something only advanced front-end developers or publishers could do. Seeing that a former symbol of skill has now become a subject of satire makes me think that what we call 'high-level' ultimately comes from what others can't do. I personally never even thought about how to implement ASCII art animation.

Comment by wbobeirne 8 days ago

As someone who used to pride myself on being able to make complex graphical designs a reality, it has definitely put me into a little bit of an identity crisis. But ultimately I think it just pushes you to find the things that are still hard for AIs, which in turn continues to differentiate your work from what everyone can now generate.

Feels similar to the move away from realism to impressionism as the camera became available.

Comment by arboles 8 days ago

Yeah, it used to function as proof-of-work but then the market was flooded with cheap printed circuits that trivialized the workload

Comment by shimman 8 days ago

Maybe once before but the web animation library has come a really long way over the last 5 years. Another thing to look into if you haven't in a while are container css queries. It makes responsive fluid design quite easier than how it was in 2015.

The web browser APIs are in a great state nowadays.

Comment by doginasuit 8 days ago

If this is the UI you want to make but you recognize that it has become cliche, the best way to do it and keep your hipster dignity is to make fun of everyone who likes it and wants to use it.

Comment by manoDev 8 days ago

Such is everything: at first, painstakingly crafted; later, mass produced.

Comment by Cthulhu_ 8 days ago

I for one am happy never to have needed to use assembly.

Comment by kidfiji 8 days ago

It's less about "can't do" and more about creativity :)

Comment by 8 days ago

Comment by jdw64 8 days ago

Well, yes.

Comment by prplfsh 8 days ago

I love how this is both hilarious and extremely well made. Great job!

And I'm gonna be honest, I kind of want to use a few of these components for real (the ASCII art is fantastic).

Comment by pseudosavant 8 days ago

Agreed. I am impressed by both the satire of this, and the very high-quality implementation. It is so well executed, that it is hard to laugh at the absurdity of the lemmings-like patterns modern AI start-ups have fallen into.

Comment by phatskat 7 days ago

At first I had a good chuckle of “this really encapsulates the tropes, even down to being React” and the more I scrolled through the components, it looks like a very serious library - lots of knobs to turn and consideration for various implementations!

Comment by reactordev 8 days ago

I was going to say that too. Some of these I definitely am guilty of. I have a few dozen that aren't on the list but it's a breath of fresh air to see it so well organized even though, we all know what it is :D fantastic job to the author(s).

Comment by lizhang 8 days ago

please share your few dozen components

Comment by reactordev 8 days ago

Why? They are silly gimmicks. You can easily prompt this.

Claude: “In react, make a full screen component that renders pixel squares that fade in and accumulate over a page component, taken as a target prop.”

Stupid crap like that. What’s cool is for those fullscreen tutorials or app walkthroughs, this works REALLY well to highlight the box on screen.

Comment by reassess_blind 8 days ago

The death of development, ladies and gentlemen.

Comment by reactordev 8 days ago

don't be so gloom. code that's more difficult than a zero-shot is worthy of sharing.

Comment by apsurd 8 days ago

or they can just prompt you for help.

Comment by timcobb 8 days ago

Yeah this is incredibly high quality (at least on the surface, who knows what's underneath). Great job authors.

Comment by padolsey 8 days ago

The most extreme virtue-signal is to go completely browser-default and have no styling whatsoever. Like lowercasing because your pinky can't be arsed to reach for the shift-key even though you've a billion dollars in series A.

Comment by thomascgalvin 8 days ago

https://www.berkshirehathaway.com/

Comment by jrflo 8 days ago

The hard-coded Geico ad really ties it all together

Comment by andy_ppp 8 days ago

My god, it's perfect.

Comment by sph 8 days ago

  <meta name="GENERATOR" content="MSHTML 8.00.6001.18828"></head>
  <body link="#800080" bgcolor="#ffffff" text="#000080" vlink="#ff0000"><b><font size="6">
  <p align="center">B</font><font size="4">ERKSHIRE </font>
God, that takes me back. MSHTML, the mismatched tags, <font>, table layout, the webmaster that added the Google Analytics snippet before the DOCTYPE tag

Comment by SpyCoder77 8 days ago

> If you have any comments about our WEB page

Haha, this webpage on the inter network is amazing

Comment by alex_suzuki 8 days ago

Ok, now I'm tempted to buy BRK-B (BRK-A a bit too pricey...)

Comment by halapro 8 days ago

Ew. I mean 500 bytes of CSS would make this so much better.

Comment by isatty 8 days ago

No. It’s perfect as is. I can find everything I want. Everything is accessible to everyone and screen readers. Does not require JavaScript.

Comment by crabmusket 8 days ago

The home page links are teeny tiny on a phone screen, borderline unreadable.

Comment by holowoodman 8 days ago

That's because phone browsers have the insane braindead default of scaling everything into tiny unreadableness. You have to explicitly say "stupid browser, nobody ever wanted this shit, behave sensibly by including <meta name="viewport" content="width=device-width, initial-scale=1.0">. No idea why this idiotic custom still hasn't been purged from mobile browsers, but I guess it's just a valuable tradition now...

Before mobile browsers arrived, everything was fine and nobody needed meta viewport stuff. That's why this 1997 era page doesn't have it.

Comment by halapro 8 days ago

> everything was fine

Everything was fine best viewed in IE5.5 at 1024x768. Time has changed.

Comment by FridgeSeal 8 days ago

If only there was a way to zoom, on your phone?!

Comment by halapro 8 days ago

If only you could add 500 bytes of CSS so the content fits the screen.

Comment by halapro 8 days ago

> Does not require JavaScript

Who mentioned JavaScript?

Comment by phatskat 7 days ago

They did - their list wasn’t all related to _your_ post, other than to say the site is “perfect” to them, after which they enumerated the reasons including “does not require JavaScript”

Comment by psadauskas 8 days ago

I've mostly stopped caring about using using proper capitalization, commas, grammar and spelling in my writing of comments, primarily as a signal that i'm not an llm.

Comment by nozzlegear 8 days ago

If you turn on HN's "Show Dead" setting, there are tons of LLM-generated comments on stories related to AI. You can see the human(s) behind the LLM trying to fiddle with the style of comment by making them skip proper grammar, capitalization, use or avoid certain phrases, and so on. The biggest tell for LLM content, though, is just the content as a whole: it sounds fake and ungenuine, like it passed through a committee of hostage negotiators to remove the speaker's own attachment/expectations.

They can configure it to use all lowercase letters, skip em-dashes, make grammar mistakes, stop saying "it's not X, it's Y", or whatever, yet the content itself just has a fake quality to it that makes it stand out, which is why those comments still get flagged IMO.

Comment by oneneptune 8 days ago

The uncanny valley of text. It looks and sounds like a human, but lacks the "soul" / humanity that our intuition somehow perceives.

It's really strange... I see some text with obvious tropes and sometimes I read something and there's no obvious AI trope... but it's just not human?

Comment by nozzlegear 8 days ago

> The uncanny valley of text.

Exactly, that's a great way to describe it.

Comment by Cthulhu_ 8 days ago

And yet, while on HN we're critical readers and can still see through it, there's many places on the internet where it just wouldn't stand out. I try to avoid them, but they would just blend in to e.g. youtube comments.

Unless the YT comments I've read have been bots since forever.

Comment by port11 8 days ago

My big gripe with LLMs is the “high verbosity but low signal” style of their writing. Even the new 4.8 Opus writes like that, it’ll spit out a paragraph of verbiage for what could’ve been one sentence. I’m guessing… because we pay by output tokens? $-)

Comment by socksy 8 days ago

i mean, i definitely agree and am somehow allergic to seeing llm written text from other humans (you typed a prompt! why not just post it directly? i'd rather have bad spelling and grammar than llm slop). but... while i feel i can detect it pretty reliably in forums like HN, i can't help but think that this is the toupée fallacy[0] at work. of course, all the text that _i_ think is fake is clearly fake after all

[0] https://rationalwiki.org/wiki/Toupee_fallacy

Comment by otter-in-a-suit 8 days ago

I had this conversation the other day. I'm a native German speaker originally, which is why I hand out commas like it's candy and capitalize things unnecessarily. Sometimes I notice these things and leave them in when I write something, since at least it gives you a good indication that a human wrote it... for now.

Comment by abustamam 8 days ago

I stopped doing that long before LLMs were commonplace because I couldn't see a point in it. Like, the entire concept of spelling and grammar is arbitrary anyway. Proper English and spelling of the 20th century is not the same proper English and spelling of the 18th century.

For example, "you" was originally the formal form of the second person pronoun, and thee or thou the informal form. Many writers who try to write midieval period pieces tend to get this wrong though and just use thee or thou as a direct replacement for "you."

And then English spelling and pronunciation is just chaotic anyway.

I won't go out of my way to misspell things and I'll do my best to use the best grammar and spelling I can, but I'm not going to consult an llm or grammarly to make sure it'll get no notes from an English teacher when my only purpose is to comment on HN or write a quick update on slack.

Comment by frantathefranta 8 days ago

Claude's "write me a product description like a cool human would" is just using lower-case where it shouldn't be though.

Comment by quotemstr 8 days ago

The problem is that omitting capitalization, commas, and so on signals, in addition to "not AI in default settings", but also "I'm part of the San Francisco AI in-crowd and Altman is my spirit animal".

Comment by xnx 8 days ago

"Countersignaling" (https://en.wikipedia.org/wiki/Countersignaling) might be the better word: "Countersignaling is the behavior in which agents with the highest level of a given property invest less into proving it than individuals with a medium level of the same property."

Comment by Cthulhu_ 8 days ago

This is a great one to put in my vocabulary. It also ties into the "vocal minority" thing where people that aren't actually the best people to talk about an issue are the most visible.

Comment by davedx 8 days ago

Virtue-signalling or just the daddy?

https://www.berkshirehathaway.com/

Comment by MrBuddyCasino 8 days ago

Array language proponents also like to do this. In their case I‘ll allow it, it matches the substance.

Comment by arboles 8 days ago

Can you link to a genuine example?

Comment by MrBuddyCasino 8 days ago

Minimalist example: https://kona.github.io/

Extremely Minimalist example: https://k.nyc/

Comment by arboles 7 days ago

In the pages you linked there's not much writing to really get a taste (https://k.nyc responds with an unclosed <div> containing the letter k, come on), but I found some language examples in

* https://codeberg.org/growler/k/pulls/

* https://codeberg.org/growler/k/issues

User @growler writes in succinct sentences and uses only periods.

I'm having fun with the idea, in my head, that using array languages changes how you speak and write.

HN commenters have also pointed out the peculiar way ngn/k writes C:

https://news.ycombinator.com/item?id=31362512

Comment by MrBuddyCasino 7 days ago

I didn’t find the examples I was thinking of unfortunately.

But yeah it’s a very peculiar kind of Zen, all-encompassing.

Comment by Waterluvian 8 days ago

Netscape knows best.

Comment by ghurtado 8 days ago

Give me Navigator or give me death

Comment by sph 8 days ago

Ah yes, the jeevacation special

Comment by arm32 8 days ago

Craziest m'island

Comment by cmrdporcupine 8 days ago

lowercasing everything -- just means

you're literate smart... poetic; because

you read e.e.cummings

and william carlos

williams

...

fin.

Comment by arm32 8 days ago

Instructions unclear, am will.i.am

Comment by Cthulhu_ 8 days ago

I hate

this

style of

"poetry"

Comment by port11 8 days ago

  rupi.
  
  without substance,
  
  but words
  aligned —
  
  on a  
  page.

Comment by tfitz237 8 days ago

These all look very professional for (basically) a parody library

Comment by sv123 8 days ago

Definitely bookmarking for future ideas and inspiration, don't care if I'm shamed for it.

Comment by arnley 7 days ago

Definitely using it for a hackathon project ( Live). The timing was too perfect not to try and use it.

Comment by yieldcrv 8 days ago

Just because they're showing contempt for the process doesn't mean the process isn't refined

Joking about something tends to require an interconnected understanding of it

Comment by csomar 8 days ago

What are the odds some companies end up using it for a real product?

Comment by eranation 8 days ago

100%

Comment by visha1v 8 days ago

the distance b/w satire and SaaS is approx one quarter

Comment by sgt 7 days ago

What are the odds of LLM's being trained on this and picking it up as best practice?

Comment by scottyah 8 days ago

Honestly I can just swap these bad boys in and ship in less than a couple hours if it'd be funny enough. I don't think they're bad designs at all, and I don't think every aspect of my business needs to be unique and obsessed over.

IMO this is like judging landscaping companies for all using similar looking shovels.

Comment by marcosdumay 8 days ago

IMO that means "professional" will look very different in a few years.

Comment by Boxxed 8 days ago

...which might just show how predictable and similar all janky startup pages are.

Comment by NuclearPM 8 days ago

Janky?

Comment by Terretta 8 days ago

“TokenStream – Server-sent events (SSE) were added to the HTML5 spec in 2008 but never used until 2025.”

I remember chunked transfer encoding shipped in 1997. It's been possible since then to readily and easily stream bytes of text or chunks of html the way everyone sees LLMs do today.

I used this to write a web based telnet client in 1997, and later a text moo / chat for the web. In both cases used a frameset so your line to send was at bottom of screen, the incoming lines were server-sent as things happened server side, and scrolled the client as new lines came in.

There were other things you could abuse before that, but less reliable.

But yeah, talk about things nobody used....

Comment by ChiperSoft 8 days ago

COMET was so far ahead of its time. Sierra Online used it for their webchat in 1995 and it was absolutely the best webchat out there for years

Comment by wuliwong 8 days ago

I get the whole trope thing and maybe I'm just an old man but I still am kinda impressed when Claude sh*ts out this type of UI 100 times faster than I ever could. It might also be that I never could have made UI even of this quality before AI. (˶ˆᗜˆ˵)

Comment by grassfedgeek 8 days ago

Adding github link for those who want to use it (I do): https://github.com/vorpus/performativeUI

Comment by lizhang 8 days ago

wait my readme isnt performative enough yet, let me add a chart showing the star history

Comment by 8 days ago

Comment by consumer451 8 days ago

lol. Genuinely curious, what is your reaction to so much "actually, this is great and useful" feedback?

Comment by lizhang 8 days ago

this gives me great motivation to take on even more story points next sprint!

Comment by myaccountonhn 8 days ago

It's funny how many people here like it. Well it doesn't surprise me since the websites being upvoted here from startups look like this too.

Personally I barf when I come across a website that looks like this and close it immediately. It's about as appealing as stock images. I also immediately think that this is for a SAAS that will be bog-slow, expensive and only integrates with github.

Comment by 8 days ago

Comment by azangru 8 days ago

Well, at least the copy on the site reads like satire. I didn't notice it at first, looking at components; but then I started reading the text.

P.S.: The popover description is brilliant:

> The obtrusive newsletter modal every AI startup deploys. Takes over the entire viewport with a blurred backdrop. By design, neither the Escape key nor backdrop clicks close it; the visitor either submits the form inside or clicks the tiny dismissal link at the bottom. Pair with `timer` to auto-open after the visitor has skimmed a few paragraphs.

Comment by myaccountonhn 7 days ago

Yes I think the satire is brilliant. It really does feel like just another saas.

Comment by merveceylan 18 hours ago

As a designer I've thought a lot about why these tropes spread, they're all basically an "I belong to the club" signal. But once everyone wears the same costume, the costume stops meaning anything. This nails that.

Comment by jrflo 8 days ago

That ascii lava lamp effect is low key really cool

Comment by tyleo 8 days ago

Yeah probably my favorite of the bunch too. I bet there’s a fun project to do to make a customizer for that.

Comment by carlos-menezes 8 days ago

Lags the hell out of my browser (Safari) window though.

Comment by lizhang 8 days ago

sorry in advance if this post causes more sites to use that effect

Comment by SamBam 8 days ago

Huh, perfectly snappy on my Firefox on Android.

Comment by replwoacause 8 days ago

Not sure what's low key about it but I agree that it's cool

Comment by kfarr 8 days ago

Some of these are actually nice and appropriate to use in certain contexts. Also this issue is hilarious: https://github.com/vorpus/performativeUI/issues/2

Comment by aogaili 8 days ago

It's still better than the sh*t developers produced three years ago.

Some people just like to feel superior by shaming others' work. You can easily tweak the visual output if you want to, but it's good enough for most use cases and better than what developers used to produce.

So, it's progress.

Comment by chrisra 8 days ago

Agreed. I enjoy looking at and using a lot of these components.

Comment by CarlitosHighway 7 days ago

Why so angry?

Comment by aogaili 6 days ago

And who are you my therapist? Just argue the point, this is not group therapy forum. Passive-aggressive people are the angriest/nastiest people around.

Comment by CarlitosHighway 3 days ago

What gave you the idea I wanted to "therapy" you?

Comment by inopinatus 8 days ago

I don’t understand why the obnoxious popover didn’t automatically manifest when I scrolled its own doco. Needs more IntersectionObserver. Bonus points if the component props thereof are named like “selfArmTrigger”, I suppose.

Comment by elwell 8 days ago

The animated graph nodes background is obligatory for token sale marketing sites during 2017/18 ICO boom https://vorpus.github.io/performativeUI/#/components/node-gr...

Comment by hypfer 8 days ago

This is like building nerve agents for funsies.

I am torn between respect and terror.

Comment by loh 8 days ago

Actually quite good for a meme library! Unironically considering using some of this, or pulling some inspiration from it at least.

Also, I'm curious as to when the animated gradient text started being a popular thing. I started doing it back in 2021 or so. I think I was inspired by some of Apple's webpages at the time.

Comment by jtbayly 8 days ago

I could see actually using this…

Comment by ChiperSoft 8 days ago

Oh wow, it uses normal css, how delightful! https://github.com/vorpus/performativeUI/blob/main/src/style...

Comment by eranation 8 days ago

My Claude feels personally attacked.

Comment by kardianos 8 days ago

Savage and accurate. 100%.

Comment by Brajeshwar 8 days ago

Many a true word is spoken in jest.

Comment by gkfasdfasdf 8 days ago

The lib is a joke I know, but these will absolutely get your prototype greenlit.

Comment by lizhang 8 days ago

if it helps you raise a series A please send me a little caesars hot n ready

Comment by aryasyn 4 days ago

Haha well tagged, "Performative", finally a place for the majority of vibe coders to reference to and switch from blandly coded UI.

Comment by rubyevans109 6 days ago

This is hilarious, I have definitely written components that look exactly like some of these before. The 'loading animation that looks busy' one hits too close to home. Do people really fall for this stuff in demos?

Comment by guybedo 8 days ago

it's obviously a satire and that makes me feel bad because some components are actually cool and i'd like to use them ...

Comment by alehlopeh 8 days ago

I love the research. Those 6 files plus a 2 sentence prompt were probably enough for Claude to one-shot the entire library.

https://github.com/vorpus/performativeUI/blob/main/research/

Comment by erdaltoprak 8 days ago

It's very fun and way too polished, thanks!

Comment by smrtinsert 8 days ago

Not nearly enough animated gradient dropshadow. Check out googles AI Mode button and the same loading button status thing while waiting for responses in AI Mode. Please add it so I don't have to prompt for it - I can't tell if I'm joking.

Comment by yosef123 8 days ago

This needs an additional subscriptions service tier, that's even more performative and even more AI

Comment by tomaytotomato 8 days ago

When Agentic browsers become the norm, surely we will go back to the days of super plain HTML pages?

Comment by SilverSlash 8 days ago

I like the concept. It would indeed be good to have a modern component library with AI design tropes as I think the old components libs haven't caught up. But in this particular case I must say, a lot of the components here just look plain ugly.

Comment by CarlitosHighway 7 days ago

It needs some kind of "Japan" component...don't ask me what it does or how it looks like, but sites with performative UI will need some kind of reference to Japan.

Comment by butz 8 days ago

Dickover is suspiciously missing. How will I ask visitors to subscribe to my newsletter?

Comment by lizhang 8 days ago

i have published v0.3.0 with your feature request

Comment by butz 7 days ago

Thank you, animation looks really neat.

Comment by cmrdporcupine 8 days ago

NGL I'm going to steal/borrow/leach all sorts of these for my product.

When in Rome!

Comment by andrewstuart 8 days ago

I’m interested but cannot be bothered doing 60 clicks trying to see it all.

Comment by lizhang 8 days ago

you can now use square brackets [] to navigate between components •ᴗ•

Comment by andrewstuart 8 days ago

Can you show them all on the front page?

Comment by drob518 8 days ago

I’m totally triggered, but in the most ironic way. Or something like that.

Comment by kachoio 8 days ago

pretty decent, may even use some of the components eventually. star given

Comment by staminade 8 days ago

Very funny. Although ironic that this whole library was built with AI.

Comment by sbarre 8 days ago

Ironic, or appropriate?

Comment by ghurtado 8 days ago

Ironically appropriate

Comment by starkgoose 8 days ago

I find it funny that a website showcasing pretty preformative ui and yet fails so miserably at functional ui where it's painful to be used mobile

Comment by manoDev 8 days ago

Lovely. These React components are the new spam mail.

Comment by 8 days ago

Comment by bhargab_kalita 7 days ago

I really loved the design but I am getting overwhelmed by seeing the ui-libraries being dumped everday

Comment by m1rsh0 5 days ago

Pretty cool library. I'm gonna use it for one of my projects.

Comment by zaptrem 8 days ago

Needs more WebGL spinning rubik's cube

Comment by cubano 8 days ago

Well...what about a <BLINK> as well? For gramps.

Comment by darepublic 8 days ago

Slick and self aware. Looks good

Comment by gulugawa 8 days ago

Great work! It sounds to me like something a startup would use to vibe code a UI.

Comment by the_arun 8 days ago

Well done. I don't know what others say, I liked it being a non UX person.

Comment by heldrida 8 days ago

Spot on "AI Native".

Comment by lloydatkinson 8 days ago

I assume this is where charlatan companies like Vercel get their UI from

Comment by noobcoder 8 days ago

The purple colors look very sloppy, pls not the purplish tint

Comment by thedetailsguy 8 days ago

Nit - the UI glitches/flashes as I scroll the page.

Comment by emvied 8 days ago

I never knew it was called an eyebrow pill!

Comment by jdw64 8 days ago

Coooooooooool!!!!

Comment by the__alchemist 8 days ago

Wow, Blazing fast! Does this use Fiber?

Comment by glaslong 8 days ago

Finally! Bootstrap for AI Wrappers

Comment by smhanov 8 days ago

It needs a purple gradient mode.

Comment by julik 8 days ago

That is absolutely delightful

Comment by winddude 8 days ago

needs something for showing and copying simple terminal commands.

Comment by lizhang 8 days ago

no more stars please, we are at a funny number

Comment by wg0 8 days ago

Man... That's satire on a whole another level. What a technical and deep sense of humor.

Comment by MisterKent 8 days ago

Now I can produce slop without AI.

Comment by sph 8 days ago

Why would you do that, when you can make shit nobody needs 10x faster with AI

Comment by hyperhello 8 days ago

The author should have AI set up a simple deployment to EC2 and Azure and make an endless series of semantically meaningless AI companies with web sites and submit them everywhere. The web sites should also do this themselves.

Comment by igurss 8 days ago

Nice UI quality

Comment by LucasOe 7 days ago

Fuck. My personal portfolio website has like three of these components, even though I don't like using AI for development.

Comment by dongbinlee 8 days ago

Now I can make my landing page look funded before the product exists.

Comment by imafish 8 days ago

I heard you like AI slop...

Comment by iishanto 8 days ago

Starred this, my next project is going to be classified as slop anyway.

Comment by tanepiper 8 days ago

I don't actually hate this...

Comment by ajpaulson 8 days ago

Lmao!!! Awesome

Comment by echoforgex 12 hours ago

[dead]

Comment by professroclaw 8 days ago

[flagged]

Comment by Lupara 8 days ago

[flagged]

Comment by cdogukank 7 days ago

[dead]

Comment by igorusovich89 7 days ago

[flagged]

Comment by pushMiau 8 days ago

[dead]

Comment by onesingleblast 8 days ago

[dead]

Comment by vladsiu 8 days ago

[dead]

Comment by utopiah 8 days ago

Neat, opened an issue there for a finicky bit of code that'd help me quite a bit. /s

Comment by marknutter 8 days ago

Yawn. This is just bootstrap all over again. So what if people who don't have design skills can now create pleasant looking websites?

Comment by ghurtado 8 days ago

The thing about humor is that you don't have to tell people when you don't get a joke, you can just quietly continue to live your life while you wait for your next chance to be temporarily happy.

Comment by marknutter 7 days ago

I get the joke, and I do appreciate it. I shouldn't have been so flippant in my comment, I was more just pushing back on people who disparage others for using ai to create websites.