top | item 21357978

Ask HN: Show Me a Fast React/Vue/Angular Site

19 points| leeoniya | 6 years ago | reply

Hi HNers!

Can someone point me to a fast non-trivial React/Vue/Angular website?

I don't mean hide-the-latency "fast". I mean, don't-waste-my-battery-or-bandwidth fast. I'd like to record a DevTools perf timeline and see < 100ms of total JS execution and < 500ms for full page load (excluding images/media).

By non-trivial I mean a real-world, deployed app/site (not demo/mvp). An e-commerce site would be ideal but anything like Github, Airbnb, Facebook, Instagram, etc.

I'm asking because I've literally never encountered one; they all seem to load 500KB+ of js, make 200 HTTP requests and execute 1500ms+ of js during page load (on a desktop browser). Then I look at the DOM via `document.querySelectorAll("*").length` see there's only 1,000 total DOM nodes rendered.

9 comments

order
[+] codingdave|6 years ago|reply
Yes, many people over-develop their sites. That doesn't mean a fast, small site is impossible. But most people are not trying to build the fastest most elegant site in the world - they are trying to solve a problem, and < 100ms isn't likely to be a requirement for most real-world solutions. Likewise, what does it matter how many DOM nodes there are, if it gets the job done?

If you are trying to argue that people should think about whether or not they need a framework, I'd agree. I'd also agree that framework-supported sites do make it difficult to use resources efficiently on mobile devices.

But this post feels analogous to criticizing a parent because their minivan isn't as cool as your convertible roadster. It isn't supposed to be. It just is supposed to get a job done.

[+] muzani|6 years ago|reply
There's a lot out there where the loading time is several seconds long. Battery drain is really high too. I left my phone with a Vue site active and it drained down to 30% from 80% overnight.

There are plenty of situations where websites need speed - Google, social media type sites, anything with user exploration like wikis and IMDB, games.

I'd actually love to hear the question answered because my main concern with most frameworks is speed.

[+] chatmasta|6 years ago|reply
To have a fair discussion about this, you should probably also consider subsequent page loads after the first. With something like next.js, you get almost instant page loads after the first, because they are routed client side.

If the app is designed properly, the 500kb bundle is only loaded once, and cached until a new one is released. Subsequent requests are for data only.

Also, be sure not to conflate react performance with degradations due to third party marketing scripts.

[+] Fr33maan|6 years ago|reply
I know you said nodemo but their demo store is quite complete and close from a real world website, it's a ecommerce solution built on react. They open sourced it, it's called cezerin. https://store.cezerin.com/

EDIT: didn't check if it was online but apparently they stoped it

[+] soneca|6 years ago|reply
I am not sure if you want to make a point or if it is a genuine question. If it is a genuine question, why do you need to find such site?
[+] leeoniya|6 years ago|reply
> I am not sure if you want to make a point or if it is a genuine question.

it's both. i'm almost finished writing an SSR'd e-commerce site that easily surpasses these metrics using a not-the-big-three vdom layer and thinking about documenting the experience in a web-perf article(s) once it's deployed.

i don't want to make the claim that such websites don't currently exist (for a multitude of reasons) without asking for some help in finding at least one counter-example; i've searched for a long time already and have come up empty.