Is bundling my JS/TS project anti-pattern?

Question

I'm working on a project in Angular 2 using TypeScript and trying to nail-down my workflow.

Yesterday, I saw this video from Guy Bedford about package management. In it, he makes mention of the fact that he considers bundling to be anti-pattern.

I've seen similar mention of moving away from bundling on an angular-university guide.

From what I have read since watching the video, it seems to me that the reason for bundling being anti-pattern is that HTTP2 allows multiple responses per request, sent in parallel. This seems pretty useful since a single request to your server could return the whole angular app in individual files.

Is HTTP2 support now prevalent enough to transition to un-bundled apps? What are the pros and cons?

EDIT #2: tried to make the question more focused

Answer 1

Anti-pattern is a strong term. Its also a somewhat fuzzy one: we all have this intuitive sense of what it means, but it is certainly easy to get lost in the weeds of arguing whether questionable practice x is or is not, in fact, an anti-pattern.

So rather than trying to read too much into an off-hand comment during a talk from a library author, I'd like to present the case against bundling. These points should be fairly uncontroversial (if anyone disagrees let me know in the comments and I'll edit).

Important caveat before we start: I bundle. I'm a fan of bundling in general, it makes perfect sense for the work I do, and it generally has been a step forward. It has many positive aspects, my favorite being better closure compiler/rollup compression. But for the rest of this answer I'm only dwelling on potential flaws.

1. Bundling can lead to trivial cache misses. Any change to any part of your app invalidates the browser cache.

2. Bundling can make it harder to leverage a cache of common libraries. If you're using the same version of jquery from the same cdn as everyone else there's a good chance your users will never have to even hit your servers for it.

3. Bundling means that you generally are loading all of your JavaScript at once. There are exceptions like webpack code splitting but this complicates your build pipeline versus cating files.

4. Bundling means missing out on HTTP/2's ability to handle multiple asset requests in parallel. This may or may not be relevant to your use-case. If you're building an internal asset at FooCorp where everyone is still locked to IE 8 by IT because reasons this argument is uncompelling. Ditto most of your customer base being Chinese for the same reason. For most of the world, HTTP/2 is now widely supported (chrome, firefox, edge, iOS safari). Meaning that you are giving the majority of your users a possibly sub-par experience.