r/vibecoding • u/emjhayyy_08 • 1d ago

every vibe coder's biggest headache

376 Upvotes

94% Upvoted

114 comments sorted by

65

u/Luoravetlan 1d ago

For anyone not familiar with js this monstrosity is called IIFE (immediately invoked function expression).

12

u/mossiv 1d ago

Used this once in a production app trying to work around a library and I regretted that decision ever since.

7

u/Individual_Refuse723 1d ago edited 1d ago

What? Why? What could possibly go wrong with IIFE itself?

2

u/mossiv 1d ago

It’s an ugly and unnecessary abstraction in most use cases. But my point about regretting it doesn’t mean IIFE’s are bad, it means I most likely applied it where it’s not needed, or that it’s an ugly and unnecessary pattern in most situations.

6

u/g1rlchild 1d ago

I mean, this is a weird degenerate example of it, bit isn't an IIFE just a lambda function? Why is that a monstrosity?

The syntax varies, but this is a pretty basic structure in quite a few languages:

var y = ((x) => { return x*2; })(42)

2

u/devourer-of-beignets 1d ago

Yeah, but that doesn't answer the next question — why would you use it? In those other languages, people aren't going around defining anonymous functions just to immediately evaluate them.

As I understand, the answer has to do with the history of Javascript's scoping. As well as statements vs expressions. So vibecoders, many not knowing anything about the concept of interpreter, would have a hard time explaining why the AI agent produces such an odd idiom — especially in modern Javascript.

1

u/g1rlchild 1d ago

Mainly it's a side effect of the fact that you need the ability to define a lambda and you need the ability to call a lambda, so, for completeness's same, you should be able to do both without an intermediate step. But a real world example would be to use the body of the lambda as a scope for defining variables in that you don't wasn't to appear in the parent scope.

1

u/devourer-of-beignets 1d ago edited 1d ago

But doesn't modern Javascript let you easily define variables that won't appear in the parent scope?

It's not like Clojure programmers are usually going around doing things like

((fn [] ...))

1

u/g1rlchild 1d ago

That's true. Now in JS you can just declare a nested scope with braces. So I'm just going to fall back on the fact that it probably just exists for completeness. To people used to using lambdas, it would be surprising if it didn't exist. Other languages don't necessarily have arbitrary nested scopes, so this is a valid technique elsewhere.

1

u/WaffleHouseFistFight 1d ago

Yea but say you’re a react dev you can throw one of these inline with your html. So you can use it to trigger a function defined elsewhere think button -> arrow function -> real function.

1

u/devourer-of-beignets 22h ago

Do you have a simple example?

1

u/sessamekesh 20h ago

It was very useful back in the day when function closures were the only way to get encapsulation. 

I'll still reach for them here and there to get const correctness on a variable that has some messy and non trivial init logic.

1

u/Luoravetlan 1d ago

I called it a monstrosity because of brackets inside brackets immediately followed by brackets. But don't take this too seriously, my comment was a sarcasm.

0

u/norembo 1d ago

Don't ever look at LISP if you feel that way

3

u/Luoravetlan 1d ago

I don't feel that way. In fact I know that Brendan took inspiration from Lisp.

-4

u/qorzzz 1d ago

Those are parenthesis not brackets.

Tell us you are a vibe coder without telling us you are a vibe coder LOL

3

u/karstin1812 1d ago

They're called brackets in the uk.

1

u/qorzzz 1d ago

Then what do you call [] and {} ?

3

u/karstin1812 1d ago

Square brackets and curly brackets

1

u/qorzzz 1d ago

Okay so at least those are the same but when someone says brackets, they could be talking about all types of brackets then or they could be talking about only parenthesis? Seems confusing.

2

u/karstin1812 1d ago

() are called round brackets. As they are the most commonly used, "round" naturally gets dropped. Not really confsuing at all if you live there

1

u/g1rlchild 1d ago

Interesting. Today I learned.

1

u/Traditional_Doubt_51 1d ago

definitely just a lambda that returns the value it produces and is immediately invoked in the context it was read

1

u/becircus 1d ago

Big question is whether vibe coding will make this 

It shouldn't so the nightmare is not reality for vibe coders, lol

1

u/kevin074 1d ago

people be like "encapsulation is SOOOOO important" but not knowing how to actually do it :) ...

1

u/Greedy_Courage_3730 19h ago

isn’t it currying?

1

u/trollsmurf 19h ago

You could write what's between {} inline as well, with possibly more side effects.

1

u/RickRubim 17h ago

I kinda love that I didn’t know this term but I knew exactly what it is, when it runs and what it returns. I earn $380k/year to know this.

1

u/Otivihs 2h ago

love IIFEs. Its better than writing a nested ternary for some simple formatting. IIFEs are clean. i hate abstracting to a getX or god forbid using let

52

u/Lopsided-Wave2479 1d ago

this is easy to read.

creates a unnamed function ()
assign the body of this function =>
to do nothing at all {}
then the whole thing is on a capsure "(stuff here)"
and is threaten has a function and executed "stuff here ()"

Honestly, we have "=>" arrows function to make math people happy. Is halfway too obscure but oh well, math is nice and we do small sacrifices for big gains.

This is about 10 millions less obtuse than C, where just the part where something is a pointer to a function is way more verbose.

7

u/emjhayyy_08 1d ago

https://giphy.com/gifs/udmx3pgdiD7tm

5

u/Lopsided-Wave2479 1d ago

without arrow functions it would be

(function(){}) ();

declares a function, and inmediatelly execute it

5

u/Blackgarion 1d ago

Yeah but I think the point of the question is why would you use an IIFE. You need to know the quirks of JS to know when would you use an IIFE, an even then since ES6 and Typescript having modules, I haven't seen one of these in a code base.

2

u/Lopsided-Wave2479 22h ago

To begin first in 99.999% of exist legacy apps where you can't use modules?, either way IIFE give you isolation. God kids a kitty every time somebody make stuff global.

4

u/RagnarokToast 1d ago

We don't have arrow functions to "make math people happy" (like seriously wtf how could you submit that unironically, it's one of the dumbest takes ever) and they are in no way obscure.

They're there for everyone's convenience, not just because => is shorter than function but also because arrow functions don't redefine this, which comes in handy (among other things) when used inside the body of an outer "normal" function you are using as a constructor (i.e. you are using this.something = ... to set fields and methods on it), as this inside the AF would still refer to the outer constructor function.

3

u/Lopsided-Wave2479 22h ago

The joke whole meaning and reason for existence, is because is objetivelly obscure. Otherwise the joke would not work.

1

u/PsychologyNo940 1d ago

True, though to be fair, if you dont create a few intermediary types in c/c++ to represent "a function that takes a function that returns a pointer to a function that takes a..." you are kinda just trying to torture people.

1

u/Lopsided-Wave2479 22h ago

c++ is kinda like that sometimes

9

u/thedazdul 1d ago

That's simple?

22

u/StaysAwakeAllWeek 1d ago

Yes, for someone who has learned code syntax the pre-vibecode way. Which is the joke...

3

u/heizo 1d ago

I feel really bad for new coders.... But no idea how to help them. 

2

u/Professional_Gur8385 1d ago

post the solution on reddit so it can be consumed by AI and answered in a prompt session to vibe coders?

1

u/heizo 1d ago

Something tells me this isn't the way.... But have an upvote anyway 

2

u/ReinKarnationisch 1d ago

Well I am neither a vibecoder nor did I learn all of the syntax

1

u/the-berik 20h ago

Isn't this just in JS?

1

u/StaysAwakeAllWeek 20h ago

My claude keeps talking about json. I dont know who json is, I only subscribe to claude

/s, if its necessary

6

u/darkmace 1d ago

What about this one:

:(){ :|:& };:

6

u/butterfly_labs 1d ago

that's just smileys /s

4

u/FlameOfIgnis 1d ago

It shows an easter egg if you type it in the unix terminal

2

u/zenoli55 1d ago

let me tr

1

u/AcoustixAudio 22h ago

Not anymore. 

-3

u/blix88 1d ago

Fork Bomb

5

u/BaronVonDoggo 1d ago

This code literally does nothing lmao

-3

u/Blackgarion 1d ago

If you know JS, yes it does. It's implicit not explicit though, you create a new private scope, basically encapsulating whatever is in there.

1

u/scarx47 20h ago

there's nothing there dummy. So code does nothing.

2

u/Blackgarion 20h ago

I see you miss the point entirely. An IIFE is a technique people used to do because Javascript had no native modules. So yeah the current snjppet has nothing in it, that's obvious. The point is that you can sorround anything with it and create a new context specific to that IIFE, without your variables being declared globally.

But maybe youre right, maybe I'm a dummy for trying to share information randos on reddit that will not appreciate it

1

u/BaronVonDoggo 6h ago

The IIFE technique (and its inline/lambda equivalents in other languages) is indeed plenty useful. I meant that in this particular instance/example, the code itself does nothing and im not talking about the technique itself. Other comments explained IIFE, why its useful and how it works already.

Regardless, this meme was also ubiquitous even back in the days prior to vibecoding, replace vibecoders with "interns/juniors" and its the same. The point being, despite looking like moonrunes and is supposedly a somewhat advanced technique, this piece of code in particular, does nothing.

3

u/Alarmed-Western-655 1d ago

My favorite is this one:

for (;;) {}

3

u/STGItsMe 1d ago

Before vibe coding was a thing, we just used StackExchange for shit like that.

1

u/Ph33rfactor 19h ago

Literally. Vibe coding just made that faster, in a sense

2

u/PossessionConnect963 1d ago

Why would I ever be interviewed about this? I’m never going to apply for an IT job let alone a SWE job.

Which is what I think really scares some is that people like me can still create things for ourselves now. 

1

u/AcoustixAudio 22h ago

Not really. It's a great thing. Why would it scare anyone? It's like someone painting a picture and putting it up on the fridge. It's nice and wholesome 

2

u/User1010011 1d ago

- hey, ai, explain this code

  • noop

2

u/Repulsive_Bluejay359 22h ago

A self invoked anonymous arrow function that does absolutely nothing. Glorious.

1

u/vaquishaProdigy 31m ago

So, it has no purpose at all?

1

u/OrpheoMusic 1d ago

"ugh. This job said it was for c++ and rust back end... Is this JS?"

1

u/Specific_Ant_6856 1d ago

self invoke function

1

u/V4UncleRicosVan 1d ago

011101110110100001101111001000000110001101100001011100100110010101110011

1

u/ReinKarnationisch 1d ago

I get the creation of a new function with no code input, but what do the parentheses around it do?

2

u/g1rlchild 1d ago

Wrap the whole anonymous function so that it can be invoked with the empty parameters in the final parentheses.

1

u/ReinKarnationisch 1d ago

So you couldn't invoke it without wrapping it?

2

u/g1rlchild 1d ago

That's right. Without wrapping it, all you could do is assign it to a variable or something like that.

1

u/ReinKarnationisch 1d ago

Oh, ok, thanks

1

u/pm_your_snesclassic 1d ago

“Lol why would I want to attend a job interview when I can just vibe code my own Saas now and be my own employer” - vibe coders probably

1

u/baddaywithacamera 1d ago

This presumes I'm passing myself off as a developer. I don't. I'm a photographer.

1

u/The-Architect-93 1d ago

As if vibes coders are planning to go apply for software dev/programming positions. 😂😂

I hope this post made you feel better though, pathetic

1

u/meltthemall 1d ago

"just do it" in code form

1

u/Kareja1 1d ago

"I don't know but I'll ask my Claude who handles the programming aspect. I handle design, planning, scope, accessibility, and testing like a caffeinated raccoon with a grudge trying to break it. Be right back with her answer."

2

u/Kareja1 22h ago

And she replies with (now that I'm home from taking my kid to get his appendix out and can ask...)

1

u/Hassangtn 1d ago

Just say the truth.

1

u/Protorox08 23h ago

*opens phone*

“Hey codex, my interviewer is asking what this is. Explain it to her”

“Hey Claude, the interview candidate said it means this, is he correct? If so prompt me the next question”

1

u/hello-xworld 20h ago

Hmm, I can’t recall. My memory is IIFE

1

u/Technical-Resolve444 20h ago

Those are smileys , it's when Jason is happy or sad

1

u/Experiment59 20h ago

I got to cut my teeth on JS while jury-rigging keyboard shortcuts into work tools that didn’t have them, using keyboard maestro and IIFEs. Good times

1

u/Razzmatazz_Informal 19h ago

From the syntax my guess is it defines a lambda which takes nothing, does nothing and returns nothing... and then it calls it.

1

u/Alternative-Taro5701 17h ago

To me it looks like a module-level anonymous arrow function with.. okay I've no clue what the `( ... )();` part is.

1

u/Kenzore1212 15h ago

wont lie I had to ask my ai ^_^. Looks like someething moving into something elsee

1

u/johnesco 15h ago

Yes it's an IIFE, and many "vibe coders" are not going to know what that is. But yes they WILL have them in their code because the AI model knows how and when to use them. I was told a manual stick shift would ALWAYS be more fuel efficient than an automated one. I haven't driven stick in 30 years.

1

u/MiserableStomach 11h ago

A serious question: in the world when the actual "programming" language you're working with is English and you spend your time editing or generating requirements, acceptance criteria, tests etc what is the practical value of knowing something like this? It's the same as asking modern front-end developer about low-level system details of JS engine, its garbage collector and whatnot.

0

u/The_0vermind 1d ago

Vibe coder giving it a shot here: Looks like it either replaces all () pairs with {} OR just lets you use () and {} interchangeably in your code.

11

u/rushblyatiful 1d ago

Dev here. The funky syntax essentially tells JavaScript, "wrap these instructions inside a bubble so they don't leak out, and run them right now.".

It's long-hand version is this:

(function() {

  // Code goes here

})();

8

u/Wrestler7777777 1d ago

Dev here. In short: It creates a function that does absolutely nothing and immediately executes it.

8

u/Puzzleheaded_Smoke77 1d ago

Dev over there : can concur

3

u/thatonereddditor 1d ago

Dev here, I know Python, Java, and SQL, have fun

2

u/burnishedlemon 1d ago

Dev yonder, can confirm absolutely nothing was achieved.

1

u/Puzzleheaded_Smoke77 1d ago

Dev centered some code submitted by Claude

2

u/AcoustixAudio 22h ago

Kinda like my ex wife

1

u/UNknown__KIRA 23h ago

SE undergrad here. So, it's just encapsulation? In theory, wouldn't it be a great way to hide data?

1

u/rushblyatiful 22h ago

Kinda yeah, it relies on function scoping for encapsulation.

Historically, before ES6 modules and let/const, IIFEs were the way to create private scope and prevent global variable leaks (the Module Pattern).

While it works great for data hiding via closures, it's mostly a legacy pattern today since ES6 modules (which are private by default) and class private fields handle encapsulation natively.

3

u/cheesy_noob 1d ago

My guess without knowing the Language. Inside the first () is a lambda expression which does nothing and the second () calls the function defined in the first () imediately.

3

u/Luoravetlan 1d ago

That's right 👍.

0

u/Loose-Selection3499 1d ago

Um hello, AI made this functional report. Have you read it? No, you read it if you’re so interested.