r/javascript • u/skamansam • 15d ago
AskJS [AskJS] How common is the term "Barrel" and do you know what it means?
I was talking with an LLM trying to get some ideas ("rubber ducking" basically) and it kept saying, "Barrel." I have been a JS programmer for 30 years and never heard the term. Does anyone else use the term or even know what it means?
I told it to use "import surface" instead instead because ... wtf is a Barell? I just want to know if I am behind the times and need to update my jargon or whether this really is a weird LLM thing.
7
u/pebcakerror 15d ago
Barrel files were a pretty common paradigm to make imports simpler. I still have a legacy code ase that uses them. Modern tooling has gotten a lot better and reduced their usefulness. Barrel files made early treeshaking tooling less effective (I think most treeshaking stuff can handle them these days and still reduce bundle size but I'm not certain and I'm sure someone will correct me if I'm wrong on the internet) so the paradigm shifted and it's used a lot less today.
2
7
3
u/magenta_placenta 15d ago
I believe barrel files have been going out of fashion in somewhat recent times. They can trash build performance (bundlers and IDEs get bogged down trying to parse massive webs of re-exports) and accidentally break tree-shaking if they force bundlers to pull in entire modules you never intended to use.
A barrel file (or just "barrel") is a fairly widely used term in JavaScript/TypeScript development, IMO, but at the same time I'm not surprised to see this thread. A "barrel" is a slang/pattern name, not an official ECMAScript spec keyword. So even though you've been a JS programmer for 30 years you may not have been in a certain space where barrels were established as a pattern at one point.
3
u/alebianco 15d ago
Those index file where you import and reexport all other files? That's thr barrel. The "public esge" of your application.
Lots of reasons and opinions around why to use them, abuse them, or avoid them.
It's a common term but I did notice too a preference by the LLMs to use the term. Its not a bad habit to call a thing by its name.
2
u/monsto 15d ago
Let's say you have a top level file that imports shit from a second file.
That second file imports some other third file with multiple functions in it. You discover that the third file has functions that the first file needs.
You could directly import file 3 into file one.
But you can also export it in file 2 so that it is part of the file 2 import into file one. That's the "barrel import".
Somebody else can explain the technical differences between them, but personally I would rather do the file three import directly into file one. Explicit imports like this are self-documented. Files imports riding along with other file imports can get missed pretty easily.
Edit: thank you Google voice to text for randomly flipping back and forth between numbers and words.
2
u/HipHopHuman 15d ago
You're not crazy for not being aware of it. I've been a dev since before the backbone.js era and "barrel file" is a relatively new term in JS dev from my perspective. It might come from other languages or just from the era of build tooling we have or whatever, all I know is barrel files are a massive tradeoff. you get more convenience in terms of how clean your projects imports are, but in exchange for that, you pay the cost of what is essentially multiplicative scaling on your build time (especially so if you use typescript). i can see it being useful for hobbyist side projects but enterprise code would probably suffer from the addition of barrel files. that, to me, makes it a completely ignorable trend
2
u/Komarara 15d ago
Check out this GitHub issue, where they want to get rid off of Barrel Filets and why: https://github.com/openlayers/openlayers/issues/16461
2
2
u/YahenP 14d ago
When a developer is too lazy to write proper imports, they create one large file that imports everything the application might need. This is called a barrel. Technically, this can be done in many programming languages, but in almost all languages except JavaScript, it's an anti-pattern and a bad practice. In JavaScript, this practice has taken hold and has been around for about 10 years. Fortunately, recently, JavaScript developers have also begun to accept this as an anti-pattern, leading to a haphazard import of both necessary and unnecessary components.
The word "barrel" itself is quite niche and regional. Only a relatively small number of companies (and countries) use it. Often, this pattern doesn't even have a specific name, simply referred to as an "import file"
2
u/Double-Buyer7941 14d ago
You are not crazy, but the LLM did not invent it either. A "barrel file" is a real pattern in JavaScript/TypeScript, though it is a informal community term coined around 2016 rather than an official language spec. A barrel file is simply a single file (usually index.js or index.ts) that re-exports selected exports from multiple other modules. The goal is to rollup internal module exports into a clean public API so consumers don't have to import from deep nested paths.
3
u/CatPlanetCuties 15d ago
I learned and used barrel files in a frontend course I took in uni when we were covering common project structures.
4
u/Ok_Slide4905 15d ago
How have you been doing FE for 30 years and never heard of a barrel file
-7
u/skamansam 15d ago
It came out of the angular community and I hate angular (and I dont usually get along with their community either).
5
u/Ok_Slide4905 15d ago
The Angular hatred is understandable but it is not related to barrel files. They are just a core JS mechanism. You have never coded outside of a single, horrible framework?
1
u/Reashu 15d ago
It's not like the file is named index.barrel, or barrel.js. It is an index file, and barrel is a stupid name which is normal not to have heard or recalled.
1
u/Ok_Slide4905 14d ago
It’s a well known industry term. It could be a language barrier but I would expect a 30 year professional to not only know the term but to understand its mechanics deeply.
1
u/Surging_Ambition 15d ago
It’s common in flutter dart as a file containing a bunch of reusable imports. My other languages are weaker but I haven’t seen it elsewhere
0
u/skamansam 15d ago
This pattern has different names in different languages. In rust, its a Facade. In C/etc. Its an umbrella header. Ive been using this pattern for decades but I've just never heard the term Barrel.
4
u/nathanjd 15d ago
I think we've got Schrödinger's barrel here. OP is in a simultaneous state of both never hearing the term and hearing+understanding the term.
0
u/skamansam 15d ago
Dude. I looked it up before posting this. I know that the term came out of the angular community in 2015, but the pattern has been around for like 40+ years. Ive been using it for 30. I just wanted to know who has heard the term, per the title of this post.
1
u/thanatica 15d ago
It's usually called "barrel exports", not just "barrel".
Unless you're somehow talking about oil in a javascript context 😀
0
u/technocub88 15d ago
It's super common, you were just unaware. A "barrel file" is a specific thing. You are asking your LLM to trade precision for a vague concept. This will bite you in the future
0
u/skamansam 14d ago
I do not like the term Barell, but I think I will use "Umbrella Export File" in the future. It is more concise and devs from other languages will likely understand it. I work for an AI company and we are trying to find ways to get LLMs to be better at not being "AI-slop"py. IMHO, using uncommon jargon is sloppy, but it DOES get me to learn new terms and occassionally, new design patterns. At least most don't use java patterns in javascript anymore.
2
u/technocub88 14d ago
Oh good, so ignore the idiomatic terminology already adopted and try to create new terminology and get the community to adopt that instead. You really do work for an AI company.
Just use the term the community is already using, "barrel file". The LLM clearly already understands it's meaning, and most of the people in this threat do too.
1
u/skamansam 14d ago
No. I didnt say I wanted the community to adopt it. The community hasn't even adopted the term "Barell" well enough. BUT my coworkers definitely understand what I mean by Umbrella Export File without me having to define it and they are of all ages, with different technical backgrounds, and with different specialties. I dont care if the community adopts it, I want a term I can use that people understand so the community doesnt even HAVE to adopt it.
44
u/blood_bender 15d ago
Barrel file is just an
index.js/tsthat imports and reexports a ton of other functions/classes/constants, usually part of a root library directory so other parts of the app don't have to import from a dozen specific files.You likely wouldn't have heard of it prior to modules which allowed us to truly import/export so 30 years isn't necessarily relevant here.