Currently in an Angular project and I would say "somewhat". Our production bundle is still >1MB if you include all the polyfills etc.
As an alternative I recommend Svelte Kit:
But it's best to wait until it's out of beta. The value proposition here is that it's performant, bundles are exceptionally small since it's more a compiler than a framework and you need less code than in say, React, to achieve the same result.
Now that it has TypeScript support the developer experience is decent as well.
you can integrate it to a server with ssr: https://github.com/frandiox/vite-ssr
These days, I can't imagine using anything but Svelte/SvelteKit for anything JS.
What do you consider "unusually large in size?".
I am lead on a "large" Angular code-base, which compiles to less than 5 MB in production mode using lazy-loaded modules.
5 MB is often smaller than a picture of a cat people post online, and can be cached.
I think front-end developers often overthink "performance" and "bandwidth". Sure, it's great to keep things as small and concise as possible, but at the end of the day it gets a lot more nuanced.
I'm much more concerned about the C# code and the SQL than I am about anything Angular is doing in JS land.
5MB is large for a single bundle, I'd say if you are using lazy loaded modules 2MB for a single module is large.
Front-end performance varies in importance based on your context. In e-commerce performance is tied to conversion so it's very important. If you're a government contractor building CRUD apps, it's not as important.
I'm far from that, but "5MB is very large" to me is ludicrous. Press "play" on a Netflix movie and you're over that benchmark straight away.
I grew up in the era of sub-56k modems.
Just searching Google for "56k modems" returns 5.1 MB of data with an ad-blocker on.
Let's be realistic.
Open the profiler and see how long it takes for your computer to parse and execute those 5 megs of JS. especially if its not crafted in the right way for V8 or whatever to ignore the contents.
Also all the garbage your code might run on first run to get started. "Garbage" here being used as neutrally as possible (I like Python and it has a similar "pay init costs up the wazoo for anything" feelings)
I'm well aware of profiling as I am lead on this project.
No issues.
Great, now that that's sorted out: let's download a few MB of JSON, then parse that into Javascript data structure (more memory spikes), copy and slightly modify that about three times in different places, then use it to create a few representations of a "component" one of which will be a set of actual entries in the DOM. And we'll keep most of that around after we're done.
A reasonable rule of thumb is that on a low-end Android phone 100KB of JS takes about 1 second to download and parse. A 5MB bundle would take 50s or so to run. You probably don’t notice this if you’re only testing on fast PCs/macs, or modern iOS devices.
I deal with very large-scale Angular systems that handle this sort of stuff day in, day out ... can you give me an example of a 5 MB Angular payload that takes 50 seconds to execute?
Clearly this is on the developer.
https://developers.google.com/web/fundamentals/performance/o...
I'm two decades into this. As the lead on my current project, on both sides (Angular and C#), I know all about this.
We have performance benchmarks and to this point, we've had no issues.
These days, I would first check whether I can get away with just using web components, typically with lit for convenience. The reason being that web components are a browser standard, which means that if you do it right, you get an opportunity to escape the hamster wheel of keeping up with new frameworks.
That web components are often adequate to do the job is evidenced by Adobe releasing their web version of Photoshop based on web components and lit.
Otherwise, React for larger projects though I'm trying SvelteKit for a larger project right now, and it's pretty amazing. It's a lot less boilerplate than React, and god that feels good.
> it's pretty amazing. It's a lot less boilerplate than React, and god that feels good.
I could have said this for Elm! :)
i.e. if your product is relying on some organic search traffic to grow, would bundle size be a concern?
Svelte if I don’t.
React via CRA if I do.
I’m hopeful that Svelte will continue to pick up steam, but React serves my needs well as-is.
The complaint about the high initial complexity of Angular certainly resonated with me.
Have these kinds of issues been improved since? At the time it, at best, seemed like a decent fit to build things like backoffice / admin related tools.
On a related note, if you were building a web project in 2021, given the multitude of JS framework options available, which ecosystem would be your go-to pick in most cases that gives you:
- Performance
- Tree-shaking/AOT compilation/chunking/minification/cache-busting other optimization magic out-of-the-box.
- Good debugging tools
- A seamless way to drop-in to an existing server-side web framework without wanting to take over routing and other such things
- Good compatibility with third party JS