Why React is my choice for front-end development

Feb 10, 2023 Loading...

Back in 2022 I started building the new HMRC Customs Search Service. There was already an existing Angular app and we were building a new React one, with a lot more functionality, to replace it.

I was asked why we are choosing React as opposed to another frontend technology like Svelte or Vue. They shared this article with me The Market for Lemons with this quote

The objective buyer, circa 2023, will understand heavy JS stacks as a regrettable legacy, one that teams who have hollowed out their HTML and CSS skill bases will pay for dearly in years to come.

The post has an overall bitter tone, like ReactJS didn’t show up at his birthday party.

I believe the author's core argument could be summed as “React/Next.js produces larger apps than alternatives - favouring DX over UX. So use alternatives instead”.

Some technologies aren't ready for prime time

As for the alternatives he suggests, some of them aren’t even released yet like Qwik, SvelteKit has been production ready for literally 2 months, and others have vastly less users than React.

Let's compare base app sizes

We'll look at an alternative he suggests: SvelteKit, that is known for having a very small bundle size:

• Next.js: 91kb (gzipped)
• Next.js (with Preact): 61kb (gzipped)
• SvelteKit: 16kb (gzipped)

Svelte being smaller is impressive (and I’m a big fan of Svelte). But when you consider the size of say an image on a website it puts it in perspective.

A single image can nullify your bundle size savings

Small bundle sizes are great. If initial app size / limited internet speeds is your number one priority, SvelteKit is a great option.

But you shouldn't choose a framework because its base app is smaller by a factor of a single image.

The Svelte website has an image that’s 120kb, and the header image is 40kb.

Of course images aren't part of the bundle, but they are still loaded into the browser and often contain vital data for the user. Like a single product image.

Theres more to consider than just initial app size

React/Next.js apps being larger than alternatives has been known for years, yet they still dominate the world of front-end, all because the positives outweigh the small size saving of the alternatives.

For our use case (and for most use cases) this initial app size saving isn’t worth it when you consider the pros of React Next.js that you would miss out on:

Pros of React Next.js:

• Most popular UI framework — tried and tested by millions of users
• Great Next.js DX and performance (page splitting, chunking etc)
• Biggest ecosystem of packages, tools, component libraries etc
• Biggest front-end framework community - easier to troubleshoot any issues
• React devs market is much bigger than other framework devs by a huge margin, which is very valuable from a business perspective
• More than sufficient performance for building typical web apps

Pros of Sveltekit

• App size is smaller than alternatives
• Very performant (surgical DOM updates etc)
• In built animation and state handling

To be clear React isn’t perfect, there are some DX annoyances that Svelte is better at. But overall it’s the best option for large scale UI development (imo).

Interestingly the creator of Svelte, Rich Harris, was employed by the creators of Next.js about a year ago. So there are lots of “copying each others homework” in SvelteKit and Next.js.

But it also means that now that SvelteKit has company backing, it’s likely we’ll see that rise in its popularity and use in businesses.

SPA issues

The author also talks a lot about SPAs issues, but ignores that modern frameworks began solving them 7 years ago when Next.js (a MPA-like framework with SPA benefits) first released. He even shows a tweet from the creator of Next.js, but omits the existence of Next.js to make other points:

React usage vs the recommended alternatives

This graph shows React against the alternative tools the author is recommending:

One recommended alternative UI framework has three thousand downloads a month, whereas React has 40 million downloads a month.

This seems like a very strange, idealistic, recommendation. One you might expect from a junior / novice, not from someone who's maintained a large production UI over a period of years.

From a business perspective, it’s vital to go with tried and tested technology, with a huge ecosystem, community, large amount of packages and plugins, and easy to find devs.